diff --git a/rsconcept/frontend/src/context/ConceptOptionsContext.tsx b/rsconcept/frontend/src/context/ConceptOptionsContext.tsx index 08ebfe83..914f2cd4 100644 --- a/rsconcept/frontend/src/context/ConceptOptionsContext.tsx +++ b/rsconcept/frontend/src/context/ConceptOptionsContext.tsx @@ -110,8 +110,14 @@ export const OptionsState = ({ children }: OptionsStateProps) => { }, [setDarkMode]); const mainHeight = useMemo(() => { - return !noNavigation ? 'calc(100dvh - 6.75rem)' : '100dvh'; - }, [noNavigation]); + if (noNavigation) { + return '100dvh'; + } else if (noFooter) { + return 'calc(100dvh - 3rem)'; + } else { + return 'calc(100dvh - 6.75rem)'; + } + }, [noNavigation, noFooter]); const viewportHeight = useMemo(() => { return !noNavigation ? 'calc(100dvh - 3rem)' : '100dvh'; diff --git a/rsconcept/frontend/src/pages/OssPage/EditorOssCard/EditorOssCard.tsx b/rsconcept/frontend/src/pages/OssPage/EditorOssCard/EditorOssCard.tsx index bd43b2c6..79b1152e 100644 --- a/rsconcept/frontend/src/pages/OssPage/EditorOssCard/EditorOssCard.tsx +++ b/rsconcept/frontend/src/pages/OssPage/EditorOssCard/EditorOssCard.tsx @@ -49,7 +49,7 @@ function EditorOssCard({ isModified, onDestroy, setIsModified }: EditorOssCardPr /> diff --git a/rsconcept/frontend/src/pages/OssPage/EditorOssGraph/OssFlow.tsx b/rsconcept/frontend/src/pages/OssPage/EditorOssGraph/OssFlow.tsx index 9b0ac2d0..1bb5da6f 100644 --- a/rsconcept/frontend/src/pages/OssPage/EditorOssGraph/OssFlow.tsx +++ b/rsconcept/frontend/src/pages/OssPage/EditorOssGraph/OssFlow.tsx @@ -40,7 +40,7 @@ interface OssFlowProps { } function OssFlow({ isModified, setIsModified }: OssFlowProps) { - const { calculateHeight, colors } = useConceptOptions(); + const { mainHeight, colors } = useConceptOptions(); const model = useOSS(); const controller = useOssEdit(); const flow = useReactFlow(); @@ -342,8 +342,6 @@ function OssFlow({ isModified, setIsModified }: OssFlowProps) { } } - const canvasHeight = useMemo(() => calculateHeight('1.75rem + 4px'), [calculateHeight]); - const OssNodeTypes: NodeTypes = useMemo( () => ({ synthesis: OperationNode, @@ -389,7 +387,7 @@ function OssFlow({ isModified, setIsModified }: OssFlowProps) { return ( - + ) : null} -
+
{graph}
diff --git a/rsconcept/frontend/src/pages/OssPage/OssTabs.tsx b/rsconcept/frontend/src/pages/OssPage/OssTabs.tsx index c247fb8a..d90e9ea1 100644 --- a/rsconcept/frontend/src/pages/OssPage/OssTabs.tsx +++ b/rsconcept/frontend/src/pages/OssPage/OssTabs.tsx @@ -9,6 +9,7 @@ import { toast } from 'react-toastify'; import { urls } from '@/app/urls'; import InfoError, { ErrorData } from '@/components/info/InfoError'; import Loader from '@/components/ui/Loader'; +import Overlay from '@/components/ui/Overlay'; import TabLabel from '@/components/ui/TabLabel'; import TextURL from '@/components/ui/TextURL'; import AnimateFade from '@/components/wrap/AnimateFade'; @@ -37,7 +38,7 @@ function OssTabs() { const activeTab = query.get('tab') ? (Number(query.get('tab')) as OssTabID) : OssTabID.GRAPH; const { user } = useAuth(); - const { calculateHeight, setNoFooter } = useConceptOptions(); + const { setNoFooter } = useConceptOptions(); const { schema, loading, loadingError: errorLoading } = useOSS(); const { destroyItem } = useLibrary(); @@ -107,8 +108,6 @@ function OssTabs() { }); }, [schema, destroyItem, router]); - const panelHeight = useMemo(() => calculateHeight('1.625rem + 2px'), [calculateHeight]); - const cardPanel = useMemo( () => ( @@ -143,14 +142,16 @@ function OssTabs() { selectedTabClassName='clr-selected' className='flex flex-col mx-auto min-w-fit' > - - + + + - - - + + + + - + {cardPanel} {graphPanel} diff --git a/rsconcept/frontend/src/pages/RSFormPage/EditorConstituenta/EditorConstituenta.tsx b/rsconcept/frontend/src/pages/RSFormPage/EditorConstituenta/EditorConstituenta.tsx index ea076e1c..935b2d56 100644 --- a/rsconcept/frontend/src/pages/RSFormPage/EditorConstituenta/EditorConstituenta.tsx +++ b/rsconcept/frontend/src/pages/RSFormPage/EditorConstituenta/EditorConstituenta.tsx @@ -28,7 +28,7 @@ interface EditorConstituentaProps { function EditorConstituenta({ activeCst, isModified, setIsModified, onOpenEdit }: EditorConstituentaProps) { const controller = useRSEdit(); const windowSize = useWindowSize(); - const { calculateHeight } = useConceptOptions(); + const { mainHeight } = useConceptOptions(); const [showList, setShowList] = useLocalStorage(storage.rseditShowList, true); const [toggleReset, setToggleReset] = useState(false); @@ -39,7 +39,6 @@ function EditorConstituenta({ activeCst, isModified, setIsModified, onOpenEdit } ); const isNarrow = useMemo(() => !!windowSize.width && windowSize.width <= SIDELIST_LAYOUT_THRESHOLD, [windowSize]); - const panelHeight = useMemo(() => calculateHeight('1.75rem + 4px'), [calculateHeight]); function handleInput(event: React.KeyboardEvent) { if (disabled) { @@ -79,7 +78,7 @@ function EditorConstituenta({ activeCst, isModified, setIsModified, onOpenEdit } } return ( -
+ <> setToggleReset(prev => !prev)} onToggleList={() => setShowList(prev => !prev)} /> -
- - - {showList ? ( - - ) : null} - +
+
+ + + {showList ? ( + + ) : null} + +
-
+ ); } diff --git a/rsconcept/frontend/src/pages/RSFormPage/EditorConstituenta/ToolbarConstituenta.tsx b/rsconcept/frontend/src/pages/RSFormPage/EditorConstituenta/ToolbarConstituenta.tsx index e460328f..a18c9dbe 100644 --- a/rsconcept/frontend/src/pages/RSFormPage/EditorConstituenta/ToolbarConstituenta.tsx +++ b/rsconcept/frontend/src/pages/RSFormPage/EditorConstituenta/ToolbarConstituenta.tsx @@ -50,7 +50,7 @@ function ToolbarConstituenta({ return ( {controller.schema && controller.schema?.oss.length > 0 ? ( diff --git a/rsconcept/frontend/src/pages/RSFormPage/EditorRSFormCard/EditorRSFormCard.tsx b/rsconcept/frontend/src/pages/RSFormPage/EditorRSFormCard/EditorRSFormCard.tsx index 585fe6d2..69f74f39 100644 --- a/rsconcept/frontend/src/pages/RSFormPage/EditorRSFormCard/EditorRSFormCard.tsx +++ b/rsconcept/frontend/src/pages/RSFormPage/EditorRSFormCard/EditorRSFormCard.tsx @@ -49,7 +49,7 @@ function EditorRSFormCard({ isModified, onDestroy, setIsModified }: EditorRSForm /> diff --git a/rsconcept/frontend/src/pages/RSFormPage/EditorRSFormCard/ToolbarRSFormCard.tsx b/rsconcept/frontend/src/pages/RSFormPage/EditorRSFormCard/ToolbarRSFormCard.tsx index c7787f54..22c73c3d 100644 --- a/rsconcept/frontend/src/pages/RSFormPage/EditorRSFormCard/ToolbarRSFormCard.tsx +++ b/rsconcept/frontend/src/pages/RSFormPage/EditorRSFormCard/ToolbarRSFormCard.tsx @@ -45,7 +45,7 @@ function ToolbarRSFormCard({ modified, controller, onSubmit, onDestroy }: Toolba }, [controller]); return ( - + {ossSelector} {controller.isMutable || modified ? ( {controller.isContentEditable ? : null} - + {controller.isContentEditable ? (
diff --git a/rsconcept/frontend/src/pages/RSFormPage/EditorRSList/ToolbarRSList.tsx b/rsconcept/frontend/src/pages/RSFormPage/EditorRSList/ToolbarRSList.tsx index d2a50416..e2132e1f 100644 --- a/rsconcept/frontend/src/pages/RSFormPage/EditorRSList/ToolbarRSList.tsx +++ b/rsconcept/frontend/src/pages/RSFormPage/EditorRSList/ToolbarRSList.tsx @@ -28,7 +28,7 @@ function ToolbarRSList() { return ( {controller.schema && controller.schema?.oss.length > 0 ? ( diff --git a/rsconcept/frontend/src/pages/RSFormPage/EditorTermGraph/EditorTermGraph.tsx b/rsconcept/frontend/src/pages/RSFormPage/EditorTermGraph/EditorTermGraph.tsx index 64413bc7..c6084658 100644 --- a/rsconcept/frontend/src/pages/RSFormPage/EditorTermGraph/EditorTermGraph.tsx +++ b/rsconcept/frontend/src/pages/RSFormPage/EditorTermGraph/EditorTermGraph.tsx @@ -287,7 +287,7 @@ function EditorTermGraph({ onOpenEdit }: EditorTermGraphProps) { ); return ( - + <> {showParamsDialog ? ( - + - + + - {hoverCst && hoverCstDebounced && hoverCst === hoverCstDebounced ? ( - - + {hoverCst && hoverCstDebounced && hoverCst === hoverCstDebounced ? ( + + + + ) : null} + + +
+ {selectors} + {viewHidden} +
- ) : null} - -
- {selectors} - {viewHidden} -
-
- - {graph} -
+ {graph} +
+ ); } diff --git a/rsconcept/frontend/src/pages/RSFormPage/EditorTermGraph/TermGraph.tsx b/rsconcept/frontend/src/pages/RSFormPage/EditorTermGraph/TermGraph.tsx index ec2e5bfe..b09cb528 100644 --- a/rsconcept/frontend/src/pages/RSFormPage/EditorTermGraph/TermGraph.tsx +++ b/rsconcept/frontend/src/pages/RSFormPage/EditorTermGraph/TermGraph.tsx @@ -53,7 +53,7 @@ function TermGraph({ onSelect, onDeselect }: TermGraphProps) { - const { calculateHeight, darkMode } = useConceptOptions(); + const { mainHeight, darkMode } = useConceptOptions(); const { selections, setSelections } = useSelection({ ref: graphRef, @@ -111,10 +111,8 @@ function TermGraph({ return 'calc(100vw - 1rem)'; }, []); - const canvasHeight = useMemo(() => calculateHeight('1.75rem + 4px'), [calculateHeight]); - return ( -
+
{ - setNoFooter(activeTab === RSTabID.CST_EDIT || activeTab === RSTabID.CST_LIST); + setNoFooter(activeTab !== RSTabID.CARD); setIsModified(false); if (activeTab === RSTabID.CST_EDIT) { const cstID = Number(cstQuery); @@ -189,8 +190,6 @@ function RSTabs() { }); }, [schema, library, oss, router]); - const panelHeight = useMemo(() => calculateHeight('1.625rem + 2px'), [calculateHeight]); - const cardPanel = useMemo( () => ( @@ -255,19 +254,23 @@ function RSTabs() { selectedTabClassName='clr-selected' className='flex flex-col mx-auto min-w-fit' > - - + + + - Версия: ${labelVersion(schema)}`} /> - Ошибок: ${schema.stats?.count_errors ?? 0}`} - /> - - - + Версия: ${labelVersion(schema)}`} /> + Ошибок: ${ + schema.stats?.count_errors ?? 0 + }`} + /> + + + + - + {cardPanel} {listPanel} {editorPanel} diff --git a/rsconcept/frontend/src/styling/styles.css b/rsconcept/frontend/src/styling/styles.css index 96887332..cf3958b4 100644 --- a/rsconcept/frontend/src/styling/styles.css +++ b/rsconcept/frontend/src/styling/styles.css @@ -221,6 +221,10 @@ @apply clr-text-primary; } + .cc-tab-tools { + @apply top-[1.9rem] pt-1 right-1/2 translate-x-1/2; + } + .cc-modal-blur { opacity: 0.3; backdrop-filter: blur(2px);