about

src/App.tsx

@@ -7,7 +7,7 @@ import {
 
 import { CustomFonts } from './CustomFonts';
 import { KartaPage } from "./KartaPage";
-// import { Landing } from "./Landing";
+import { Landing } from "./Landing";
 import { Article } from "./Article";
 import { HeaderSimple } from "./Header";
 import { FooterLinks } from "./Footer";
@@ -19,10 +19,10 @@ const router = createBrowserRouter([
     path: "/",
     element: <KartaPage />,
   },
-  // {
+  {
-  //   path: "/about",
+    path: "/about",
-  //   element: <Landing />,
+    element: <Landing />,
-  // },
+  },
   {
     path: "/article/:id",
     element: <Article />,

src/Landing.tsx

@@ -1,122 +1,102 @@
 import {
-    createStyles,
   Title,
-    SimpleGrid,
-    Text,
-    Button,
-    ThemeIcon,
-    Grid,
-    Col,
-    rem,
   Container,
-  } from '@mantine/core';
+  rem,
-  import { IconReceiptOff, IconFlame, IconCircleDotted, IconFileCode } from '@tabler/icons-react';
+  createStyles,
+  TypographyStylesProvider,
+} from "@mantine/core";
 
 const useStyles = createStyles((theme) => ({
-    wrapper: {
+  content: {
-      padding: `calc(${theme.spacing.xl} * 2) ${theme.spacing.xl}`,
+    padding: rem(30),
-      minHeight: '58vh',
-      display: 'flex',
-      alignItems: 'center',
-      justifyContent: 'center',
-      overflowX: 'hidden'
   },
 
   title: {
-      fontFamily: `Greycliff CF, ${theme.fontFamily}`,
+    fontSize: rem(55),
-      fontSize: rem(36),
+    lineHeight: 1.2,
     fontWeight: 900,
-      lineHeight: 1.1,
+    paddingBottom: rem(20),
-      marginBottom: theme.spacing.md,
+    [theme.fn.smallerThan("xs")]: {
-      color: theme.colorScheme === 'dark' ? theme.white : theme.black,
+      fontSize: rem(28),
-    },
-  }));
-  
-  const features = [
-    {
-      icon: IconReceiptOff,
-      title: 'Открывает',
-      description: 'All packages are published under MIT license, you can use Mantine in any project',
-    },
-    {
-      icon: IconFileCode,
-      title: 'Сохраняет',
-      description: 'Build type safe applications, all components and hooks export types',
     },
-    {
-      icon: IconCircleDotted,
-      title: 'Объединяет',
-      description:
-        'With new :focus-visible selector focus ring will appear only when user navigates with keyboard',
   },
-    {
+
-      icon: IconFlame,
+  heading2: {
-      title: 'Помогает',
+    color: theme.colorScheme === "dark" ? theme.white : theme.black,
-      description:
+    paddingTop: rem(11),
-        'Customize colors, spacing, shadows, fonts and many other settings with global theme object',
   },
-  ];
+}));
 
 export function Landing() {
   const { classes } = useStyles();
 
-    const items = features.map((feature) => (
-      <div key={feature.title}>
-        <ThemeIcon
-          size={44}
-          radius="md"
-          variant="gradient"
-          gradient={{ deg: 133, from: 'blue', to: 'cyan' }}
-        >
-          <feature.icon size={rem(26)} stroke={1.5} />
-        </ThemeIcon>
-        <Text fz="lg" mt="sm" fw={500}>
-          {feature.title}
-        </Text>
-        <Text c="dimmed" fz="sm">
-          {feature.description}
-        </Text>
-      </div>
-    ));
-  
   return (
-      <Container size={'xl'} className={classes.wrapper}>
+    <Container className={classes.content}>
-        <Grid gutter={80}>
+      <Title order={1} className={classes.title}>
-          <Col span={12} md={5}>
+        О проекте
-            <Title className={classes.title} order={2}>
-              Литкарта
       </Title>
-            <Text c="dimmed">
+      <TypographyStylesProvider>
-              Пространство для русской литературы
+        <p>
-            </Text>
+          Культурно-просветительский <a href="/" style={{color: "#eb7b1a"}}>онлайн-проект «Литературные музеи России» </a>
-  
+          создан Государственным музеем истории российской литературы имени В.И.
-            <Button
+          Даля в творческом содружестве с Русским географическим обществом и
-              variant='outline'
+          Московским государственным университетом геодезии и картографии.
-              size="lg"
+          Проект реализован при поддержке фонда «История Отечества».
-              radius="md"
+        </p>
-              mt="xl"
+        <p>
-              mr={'md'}
+          Литература исторически занимает особое место в отечественной культуре.
-            >
+          В последние годы возникли новые междисциплинарные подходы к изучению
-              Подробнее
+          истории литературы на границе литературоведения и культурной
-            </Button>
+          географии. В основе онлайн-проекта лежит идея комплексного
-            <Button
+          представления литературного и исторического наследия России на
-              component='a'
+          интерактивной географической карте. Информационную базу портала
-              href="/"
+          составит значительный корпус научно выверенной информации, собранной в
-              variant="gradient"
+          ходе работы над энциклопедией «Литературные музеи России» —
-              gradient={{ deg: 133, from: 'blue', to: 'cyan' }}
+          многолетним проектом Государственного музея истории российской
-              size="lg"
+          литературы имени В.И. Даля, флагманского музея Ассоциации литературных
-              radius="md"
+          музеев России.
-              mt="xl"
+        </p>
-            >
+        <p>
-              К карте
+          Запуск портала приурочен к литературным юбилеям, которые отмечаются в
-            </Button>
+          2023 году: 200 лет со дня рождения А.Н. Островского, 150 лет со дня
-          </Col>
+          рождения В.Я. Брюсова и М.М. Пришвина. Основой структуры нового
-          <Col span={12} md={7}>
+          интернет-ресурса стали литературные музеи в географическом
-            <SimpleGrid cols={2} spacing={30} breakpoints={[{ maxWidth: 'md', cols: 1 }]}>
+          пространстве. Литературные музеи, как правило, созданы в местах, где
-              {items}
+          жили и творили писатели, они являются центрами сохранения
-            </SimpleGrid>
+          литературного наследия и точками притяжения для широкой аудитории, от
-          </Col>
+          туристов до ученых-исследователей. Первыми локациями, отмеченными на
-        </Grid>
+          интерактивной карте, стали Музей Серебряного века (Дом В.Я. Брюсова) и
+          Дом-музей М.М. Пришвина (отделы ГМИРЛИ имени В.И. Даля), а также
+          Государственный мемориальный и природный музей-заповедник А.Н.
+          Островского «Щелыково».
+        </p>
+        <p>
+          Совмещение географического пространства и пространства литературы
+          стало возможным благодаря современным геоинформационным технологиям.
+          Онлайн-проект «Литературные музеи России» — пилотная версия цифровой
+          платформы, в которой заложен функционал для развития сразу в
+          нескольких направлениях: научном, образовательном, просветительском,
+          туристическом. От оцифрованной энциклопедии — к интерактивному
+          учебнику, набору научных инструментов, каталогу тематических
+          литературных маршрутов внутреннего туризма.
+        </p>
+        <p>
+          Использование пространственных и временных данных позволит создавать
+          цифровые карты, где найдут отражение места жизни писателей и места
+          действия их произведений, маршруты авторов, их героев и многое другое.
+        </p>
+        <p>
+          Проект рассчитан на долгосрочное сотрудничество с музеями и вузами
+          гуманитарной и естественнонаучной направленности. Благодаря ролевой
+          модели управления контентом работать над пополнением портала смогут
+          как филологи и музейщики, так и геоинформатики и веб-картографы.
+        </p>
+        <p>
+          Для широкой аудитории пользователей онлайн-проект станет уникальной
+          возможностью исследовать пространство отечественной словесности в
+          реальном географическом пространстве.
+        </p>
+      </TypographyStylesProvider>
     </Container>
   );
 }

src/assets/footer.json

@@ -9,7 +9,7 @@
           },
           {
             "label": "О проекте",
-            "link": "#"
+            "link": "/about"
           }
         ]
       }