perf: adapt to small screen

This commit is contained in:
molvqingtai 2024-09-27 09:03:22 +08:00
parent 1e904f12d7
commit c9b60fc6d4
2 changed files with 3 additions and 3 deletions

View file

@ -19,6 +19,7 @@ export default defineContentScript({
cssInjectionMode: 'ui',
runAt: 'document_end',
matches: ['https://*/*'],
async main(ctx) {
const store = Remesh.store({
externs: [IndexDBStorageImpl, BrowserSyncStorageImpl, PeerRoomImpl, ToastImpl],
@ -32,7 +33,6 @@ export default defineContentScript({
append: 'last',
mode: 'closed',
onMount: (container) => {
// container.style.visibility = 'visible'
const app = createElement('<div id="app"></div>')
container.append(app)

View file

@ -10,7 +10,7 @@ export interface AppContainerProps {
const AppContainer: FC<AppContainerProps> = ({ children, open }) => {
const { size, ref } = useResizable({
initSize: Math.max(375, window.innerWidth / 6),
maxSize: Math.max(750, window.innerWidth / 3),
maxSize: Math.min(750, window.innerWidth / 3),
minSize: Math.max(375, window.innerWidth / 5),
direction: 'left'
})
@ -26,7 +26,7 @@ const AppContainer: FC<AppContainerProps> = ({ children, open }) => {
style={{
width: `${size}px`
}}
className="fixed bottom-10 right-10 z-infinity box-border grid h-full max-h-[1200px] grid-flow-col grid-rows-[auto_1fr_auto] rounded-xl bg-slate-50 font-sans shadow-2xl"
className="fixed bottom-10 right-10 z-infinity box-border grid h-screen max-h-[min(calc(100vh_-60px),_1200px)] grid-flow-col grid-rows-[auto_1fr_auto] rounded-xl bg-slate-50 font-sans shadow-2xl"
>
{children}
<div