diff --git a/rsconcept/frontend/src/App.tsx b/rsconcept/frontend/src/App.tsx
index dabdcd51..d0969811 100644
--- a/rsconcept/frontend/src/App.tsx
+++ b/rsconcept/frontend/src/App.tsx
@@ -1,4 +1,3 @@
-import { useMemo } from 'react';
import { Route, Routes } from 'react-router-dom';
import Footer from './components/Footer';
@@ -17,21 +16,7 @@ import RSFormPage from './pages/RSFormPage';
import UserProfilePage from './pages/UserProfilePage';
function App () {
- const { noNavigation } = useConceptTheme();
-
- const scrollWindowSize = useMemo(
- () => {
- return !noNavigation ?
- 'calc(100vh - 4.5rem)'
- : '100vh';
- }, [noNavigation]);
- const mainSize = useMemo(
- () => {
- return !noNavigation ?
- 'calc(100vh - 9.2rem)'
- : '100vh';
- }, [noNavigation]);
-
+ const { noNavigation, viewportHeight, mainHeight } = useConceptTheme();
return (
@@ -42,8 +27,8 @@ function App () {
pauseOnFocusLoss={false}
/>
-
-
+
+
} />
diff --git a/rsconcept/frontend/src/context/ThemeContext.tsx b/rsconcept/frontend/src/context/ThemeContext.tsx
index 69ad107a..895bd516 100644
--- a/rsconcept/frontend/src/context/ThemeContext.tsx
+++ b/rsconcept/frontend/src/context/ThemeContext.tsx
@@ -1,10 +1,12 @@
-import { createContext, useContext, useEffect, useState } from 'react';
+import { createContext, useContext, useLayoutEffect, useMemo, useState } from 'react';
import useLocalStorage from '../hooks/useLocalStorage';
interface IThemeContext {
darkMode: boolean
noNavigation: boolean
+ viewportHeight: string
+ mainHeight: string
toggleDarkMode: () => void
toggleNoNavigation: () => void
}
@@ -38,16 +40,31 @@ export const ThemeState = ({ children }: ThemeStateProps) => {
root.setAttribute('data-color-scheme', !isDark ? 'light' : 'dark');
};
- useEffect(() => {
+ useLayoutEffect(() => {
setDarkClass(darkMode)
}, [darkMode]);
+ const mainHeight = useMemo(
+ () => {
+ return !noNavigation ?
+ 'calc(100vh - 9.2rem)'
+ : '100vh';
+ }, [noNavigation]);
+
+ const viewportHeight = useMemo(
+ () => {
+ return !noNavigation ?
+ 'calc(100vh - 4.5rem)'
+ : '100vh';
+ }, [noNavigation]);
+
return (
setDarkMode(prev => !prev),
noNavigation,
- toggleNoNavigation: () => setNoNavigation(prev => !prev)
+ toggleDarkMode: () => setDarkMode(prev => !prev),
+ toggleNoNavigation: () => setNoNavigation(prev => !prev),
+ viewportHeight, mainHeight
}}>
{children}
diff --git a/rsconcept/frontend/src/pages/ManualsPage/index.tsx b/rsconcept/frontend/src/pages/ManualsPage/index.tsx
index d358d112..46233d22 100644
--- a/rsconcept/frontend/src/pages/ManualsPage/index.tsx
+++ b/rsconcept/frontend/src/pages/ManualsPage/index.tsx
@@ -1,6 +1,7 @@
import { useCallback, useLayoutEffect, useState } from 'react';
import { useLocation, useNavigate } from 'react-router-dom';
+import { useConceptTheme } from '../../context/ThemeContext';
import { HelpTopic } from '../../utils/models';
import TopicsList from './TopicsList';
import ViewTopic from './ViewTopic';
@@ -8,6 +9,7 @@ import ViewTopic from './ViewTopic';
function ManualsPage() {
const navigate = useNavigate();
const search = useLocation().search;
+ const { mainHeight } = useConceptTheme();
const [activeTopic, setActiveTopic] = useState(HelpTopic.MAIN);
const navigateTo = useCallback(
@@ -31,7 +33,7 @@ function ManualsPage() {
}, [search, setActiveTopic, navigateTo]);
return (
-
+
onSelectTopic(topic)}
diff --git a/rsconcept/frontend/src/pages/RSFormPage/EditorItems.tsx b/rsconcept/frontend/src/pages/RSFormPage/EditorItems.tsx
index ff5763d4..33620c04 100644
--- a/rsconcept/frontend/src/pages/RSFormPage/EditorItems.tsx
+++ b/rsconcept/frontend/src/pages/RSFormPage/EditorItems.tsx
@@ -8,7 +8,6 @@ import Divider from '../../components/Common/Divider';
import HelpRSFormItems from '../../components/Help/HelpRSFormItems';
import { ArrowDownIcon, ArrowsRotateIcon, ArrowUpIcon, DumpBinIcon, HelpIcon, SmallPlusIcon } from '../../components/Icons';
import { useRSForm } from '../../context/RSFormContext';
-import { useConceptTheme } from '../../context/ThemeContext';
import { prefixes } from '../../utils/constants';
import { CstType, IConstituenta, ICstCreateData, ICstMovetoData } from '../../utils/models'
import { getCstTypePrefix, getCstTypeShortcut, getCstTypificationLabel, mapStatusInfo } from '../../utils/staticUI';
@@ -21,7 +20,6 @@ interface EditorItemsProps {
function EditorItems({ onOpenEdit, onCreateCst, onDeleteCst }: EditorItemsProps) {
const { schema, isEditable, cstMoveTo, resetAliases } = useRSForm();
- const { noNavigation } = useConceptTheme();
const [selected, setSelected] = useState([]);
const nothingSelected = useMemo(() => selected.length === 0, [selected]);
@@ -200,7 +198,7 @@ function EditorItems({ onOpenEdit, onCreateCst, onDeleteCst }: EditorItemsProps)
reorder: true,
},
{
- name: 'Тип',
+ name: 'Типизация',
id: 'type',
cell: (cst: IConstituenta) => {getCstTypificationLabel(cst)}
,
width: '175px',
@@ -256,8 +254,7 @@ function EditorItems({ onOpenEdit, onCreateCst, onDeleteCst }: EditorItemsProps)
return (