ConceptProd/ConceptPortal-public
1
0
Fork 0
mirror of https://github.com/IRBorisov/ConceptPortal.git synced 2025-06-26 13:00:39 +03:00
Code Issues Actions Packages Projects Releases Wiki Activity

Fix viewport units for mobile

Browse Source
This commit is contained in:
IRBorisov 2024-06-05 18:07:02 +03:00
parent 6a8794f5f2
commit 69baba7848
6 changed files with 11 additions and 12 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

3
rsconcept/frontend/src/app/Footer.tsx
View File

@ -12,10 +12,9 @@ function Footer() {
}
return (
<footer
tabIndex={-1}
className={clsx(
'z-navigation',
'w-full',
'mx-auto',
'sm:px-4 sm:py-2 flex flex-col items-center gap-1',
'text-xs sm:text-sm select-none whitespace-nowrap'
)}

4
rsconcept/frontend/src/components/ui/Modal.tsx
View File

@ -89,8 +89,8 @@ function Modal({
className={clsx('overflow-auto overscroll-contain', className)}
style={{
overflow: overflowVisible ? 'visible' : 'auto',
maxHeight: 'calc(100vh - 8rem)',
maxWidth: 'calc(100vw - 2rem)'
maxHeight: 'calc(100svh - 8rem)',
maxWidth: 'calc(100svw - 2rem)'
}}
>
{children}

10
rsconcept/frontend/src/context/OptionsContext.tsx
View File

@ -98,11 +98,11 @@ export const OptionsState = ({ children }: OptionsStateProps) => {
const calculateHeight = useCallback(
(offset: string, minimum: string = '0px') => {
if (noNavigation) {
return `max(calc(100vh - (${offset})), ${minimum})`;
return `max(calc(100dvh - (${offset})), ${minimum})`;
} else if (noFooter) {
return `max(calc(100vh - 3rem - (${offset})), ${minimum})`;
return `max(calc(100dvh - 3rem - (${offset})), ${minimum})`;
} else {
return `max(calc(100vh - 6.75rem - (${offset})), ${minimum})`;
return `max(calc(100dvh - 6.75rem - (${offset})), ${minimum})`;
}
},
[noNavigation, noFooter]
@ -114,11 +114,11 @@ export const OptionsState = ({ children }: OptionsStateProps) => {
}, [setDarkMode]);
const mainHeight = useMemo(() => {
return !noNavigation ? 'calc(100vh - 6.75rem)' : '100vh';
return !noNavigation ? 'calc(100dvh - 6.75rem)' : '100dvh';
}, [noNavigation]);
const viewportHeight = useMemo(() => {
return !noNavigation ? 'calc(100vh - 3rem)' : '100vh';
return !noNavigation ? 'calc(100dvh - 3rem)' : '100dvh';
}, [noNavigation]);
return (

2
rsconcept/frontend/src/dialogs/DlgCreateCst/FormCreateCst.tsx
View File

@ -52,7 +52,7 @@ function FormCreateCst({ schema, state, partialUpdate, setValidated }: FormCreat
value={{ value: state.cst_type, label: labelCstType(state.cst_type) }}
onChange={data => partialUpdate({ cst_type: data?.value ?? CstType.BASE })}
/>
<BadgeHelp topic={HelpTopic.CC_CONSTITUENTA} offset={16} className='max-w-[40rem] max-h-[calc(100vh-2rem)]' />
<BadgeHelp topic={HelpTopic.CC_CONSTITUENTA} offset={16} className='max-w-[40rem] max-h-[calc(100svh-2rem)]' />
<TextInput
id='dlg_cst_alias'
dense

2
rsconcept/frontend/src/dialogs/DlgRenameCst.tsx
View File

@ -60,7 +60,7 @@ function DlgRenameCst({ hideWindow, initial, onRename }: DlgRenameCstProps) {
}}
onChange={data => updateData({ cst_type: data?.value ?? CstType.BASE })}
/>
<BadgeHelp topic={HelpTopic.CC_CONSTITUENTA} offset={16} className='max-w-[40rem] max-h-[calc(100vh-2rem)]' />
<BadgeHelp topic={HelpTopic.CC_CONSTITUENTA} offset={16} className='max-w-[40rem] max-h-[calc(100svh-2rem)]' />
<TextInput
id='dlg_cst_alias'
dense

2
rsconcept/frontend/src/dialogs/DlgShowAST.tsx
View File

@ -67,7 +67,7 @@ function DlgShowAST({ hideWindow, syntaxTree, expression }: DlgShowASTProps) {
</div>
) : null}
</div>
<div className='relative w-[calc(100vw-6rem-2px)] h-[calc(100vh-14rem-2px)]'>
<div className='relative w-[calc(100vw-6rem-2px)] h-[calc(100svh-14rem-2px)]'>
<GraphUI
animated={false}
nodes={nodes}