Docker/codex.docs
Docker/codex.docs
1
0
Fork 0
mirror of https://github.com/codex-team/codex.docs.git synced 2025-07-19 21:29:41 +02:00
Code Issues Releases Activity

Merge branch 'main' into feature/backend-search

Browse source
This commit is contained in:
Taly 2022-09-13 18:58:06 +03:00
commit 5d004acfd3
12 changed files with 103 additions and 72 deletions
Download patch file Download diff file Expand all files Collapse all files

1
.codexdocsrc.sample
View file

@ -5,7 +5,6 @@
"Guides", "Guides",
{"title": "CodeX", "uri": "https://codex.so"} {"title": "CodeX", "uri": "https://codex.so"}
], ],
"landingFrameSrc": "https://codex.so/editor?frame=1",
"startPage": "", "startPage": "",
"misprintsChatId": "12344564", "misprintsChatId": "12344564",
"yandexMetrikaId": "", "yandexMetrikaId": "",

17
src/backend/routes/home.ts
View file

@ -1,5 +1,8 @@
import express, { Request, Response } from 'express'; import express, { Request, Response } from 'express';
import verifyToken from './middlewares/token.js'; import verifyToken from './middlewares/token.js';
import PagesOrder from '../controllers/pagesOrder.js';
import Pages from '../controllers/pages.js';
const router = express.Router(); const router = express.Router();
@ -7,10 +10,22 @@ const router = express.Router();
router.get('/', verifyToken, async (req: Request, res: Response) => { router.get('/', verifyToken, async (req: Request, res: Response) => {
const config = req.app.locals.config; const config = req.app.locals.config;
// Check if config consists startPage
if (config.startPage) { if (config.startPage) {
return res.redirect(config.startPage); return res.redirect(config.startPage);
} } else {
const pageOrder = await PagesOrder.getRootPageOrder();
// Check if page order consists
if (pageOrder.order.length > 0) {
// Get the first parent page
const page = await Pages.get(pageOrder.order[0]);
res.redirect(page.uri!);
} else {
res.render('pages/index', { isAuthorized: res.locals.isAuthorized }); res.render('pages/index', { isAuthorized: res.locals.isAuthorized });
}
}
}); });
export default router; export default router;

13
src/backend/views/pages/index.twig
View file

@ -3,7 +3,6 @@
<head> <head>
<title>{{ config.title }}</title> <title>{{ config.title }}</title>
<link rel="stylesheet" href="/dist/main.css" /> <link rel="stylesheet" href="/dist/main.css" />
<link rel="preload" href="{{ config.landingFrameSrc }}" as="document">
<link rel="icon" type="{{ favicon.type }}" href="{{ favicon.destination }}"> <link rel="icon" type="{{ favicon.type }}" href="{{ favicon.destination }}">
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no" /> <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no" />
<meta property="og:title" content="{{ config.title }}" /> <meta property="og:title" content="{{ config.title }}" />
@ -12,13 +11,15 @@
</head> </head>
<script> <script>
</script> </script>
<body class="landing-body"> <body class="greeting-body">
{% include "components/header.twig" %} {% include "components/header.twig" %}
<div class="landing-loader" id="frame-loader"> <div class="greeting-content">
{{ svg('loader') }} {{ svg('frog') }}
<p class="greeting-content__message">
It’s time to create the first page!
</p>
{% include 'components/button.twig' with {label: 'Add page', icon: 'plus', size: 'small', url: '/page/new'} %}
</div> </div>
<iframe class="landing-frame" src="{{ config.landingFrameSrc }}" seamless frameborder="0" onload="this.style.opacity = 1; setTimeout(document.getElementById('frame-loader').remove(), 500)"></iframe>
{% if config.yandexMetrikaId is not empty %} {% if config.yandexMetrikaId is not empty %}
<script type="text/javascript" > <script type="text/javascript" >
(function(m,e,t,r,i,k,a){m[i]=m[i]||function(){(m[i].a=m[i].a||[]).push(arguments)}; (function(m,e,t,r,i,k,a){m[i]=m[i]||function(){(m[i].a=m[i].a||[]).push(arguments)};

25
src/frontend/styles/components/greeting.pcss Normal file
View file

@ -0,0 +1,25 @@
.greeting-body {
display: flex;
flex-direction: column;
width: 100%;
height: 100%;
}
.greeting-content {
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
margin: auto;
& > svg {
width: 62px;
height: 71px;
}
&__message {
margin: 0;
padding: 26px 0 26px 0;
font-weight: 500;
}
}

30
src/frontend/styles/components/landing.pcss
View file

@ -1,30 +0,0 @@
/**
* Index page landing iframe
*/
.landing-body {
display: flex;
flex-direction: column;
width: 100%;
height: 100%;
}
.landing-loader {
position: absolute;
left: 50%;
top: 50%;
z-index: -1;
transform: translate(-50%, -50%);
& > svg {
width: 80px;
height: 80px;
}
}
.landing-frame {
width: 100%;
height: 100%;
opacity: 0;
transition: opacity 500ms ease;
will-change: opacity;
}

13
src/frontend/styles/components/page.pcss
View file

@ -53,6 +53,7 @@
&__title { &__title {
@apply --text-content-title; @apply --text-content-title;
margin-bottom: 10px;
} }
.cdx-marker { .cdx-marker {
@ -257,7 +258,11 @@
.block-list { .block-list {
margin: 0; margin: 0;
list-style: outside; list-style: outside;
padding-left: 26px; padding-left: 40px;
&--ordered {
list-style-type: decimal
}
li:not(:last-of-type) { li:not(:last-of-type) {
margin-bottom: 8px; margin-bottom: 8px;
@ -269,8 +274,7 @@
* ================== * ==================
*/ */
.block-image { .block-image {
margin: 40px auto; margin: 0 auto;
text-align: center;
&__content { &__content {
img, video { img, video {
@ -297,8 +301,9 @@
} }
&__caption { &__caption {
margin: 1em auto; margin-top: 10px;
color: var(--color-text-second); color: var(--color-text-second);
font-size: 0.9em;
} }
} }

22
src/frontend/styles/components/sidebar.pcss
View file

@ -1,6 +1,15 @@
.docs-sidebar { .docs-sidebar {
width: 100vw; width: 100vw;
/* Bottom and Left coord of the "Hide Sidebar" toggler */
--hide-sidebar-toggler-offset: 11px;
--hide-sidebar-toggler-size: 28px;
@media (--widest-desktop) {
--hide-sidebar-toggler-offset: var(--layout-padding-horizontal);
--hide-sidebar-toggler-size: 32px;
}
&--animated { &--animated {
.docs-sidebar__content { .docs-sidebar__content {
transition: transform 200ms ease-in-out; transition: transform 200ms ease-in-out;
@ -21,7 +30,7 @@
} }
.docs-sidebar__slider { .docs-sidebar__slider {
transform: translateX(20px); transform: translateX(var(--hide-sidebar-toggler-offset));
svg { svg {
transform: rotate(180deg); transform: rotate(180deg);
@ -228,15 +237,16 @@
&__slider { &__slider {
display: none; display: none;
position: fixed; position: fixed;
transform: translateX(calc(var(--layout-sidebar-width) + 20px)); transform: translateX(calc(var(--layout-sidebar-width) + var(--hide-sidebar-toggler-offset)));
bottom: 20px; bottom: var(--hide-sidebar-toggler-offset);
width: 32px; width: var(--hide-sidebar-toggler-size);
height: 32px; height: var(--hide-sidebar-toggler-size);
border-radius: 8px;
cursor: pointer; cursor: pointer;
background-color: var(--color-link-hover); background-color: var(--color-link-hover);
z-index: 10; z-index: 10;
@apply --squircle;
@media (--desktop) { @media (--desktop) {
display: flex; display: flex;
justify-content: center; justify-content: center;

5
src/frontend/styles/components/writing.pcss
View file

@ -3,7 +3,6 @@
margin-top: 0; margin-top: 0;
background: #fff; background: #fff;
box-shadow: 0 3px 10px #fff; box-shadow: 0 3px 10px #fff;
z-index: 2;
font-size: 14px; font-size: 14px;
&__save { &__save {
@ -92,6 +91,10 @@
padding: 6px 8px; padding: 6px 8px;
} }
.cdx-list {
padding-left: 40px;
}
@media (--desktop) { @media (--desktop) {
.ce-block__content, .ce-block__content,
.ce-toolbar__content { .ce-toolbar__content {

36
src/frontend/styles/layout.pcss
View file

@ -14,15 +14,29 @@
} }
&__content { &__content {
--max-space-between-cols: 160px;
box-sizing: border-box;
display: flex;
justify-content: space-between;
padding: var(--layout-padding-vertical) var(--layout-padding-horizontal);
flex-grow: 2; flex-grow: 2;
word-wrap: break-word; word-wrap: break-word;
@media (--mobile) { @media (--mobile) {
width: 100%; width: 100%;
flex-basis: 100%; flex-basis: 100%;
} }
@media (--desktop) {
max-width: min(
calc(var(--layout-width-main-col) + var(--max-space-between-cols) + var(--layout-sidebar-width)),
calc(100vw - var(--layout-sidebar-width))
);
margin-left: max(var(--main-col-min-margin-left), calc(50vw - var(--layout-sidebar-width) - var(--layout-width-main-col) / 2) - var(--layout-padding-horizontal));
margin-right: auto;
padding: 0;
}
&-inner { &-inner {
max-width: var(--layout-width-main-col); max-width: var(--layout-width-main-col);
margin: 0 auto; margin: 0 auto;
@ -31,29 +45,11 @@
@media (--desktop) { @media (--desktop) {
margin-left: 0; margin-left: 0;
padding: var(--layout-padding-vertical) var(--layout-padding-horizontal); padding: var(--layout-padding-vertical) var(--layout-padding-content-horizontal);
} }
} }
} }
&__content {
--max-space-between-cols: 160px;
box-sizing: border-box;
display: flex;
justify-content: space-between;
padding: var(--layout-padding-vertical) var(--layout-padding-horizontal);
@media (--desktop) {
max-width: min(
calc(var(--layout-width-main-col) + var(--max-space-between-cols) + var(--layout-sidebar-width)),
calc(100vw - var(--layout-sidebar-width))
);
margin-left: max(var(--main-col-min-margin-left), calc(50vw - var(--layout-sidebar-width) - var(--layout-width-main-col) / 2) - var(--layout-padding-horizontal));
margin-right: auto;
padding: 0;
}
}
&__aside-right { &__aside-right {
width: var(--layout-sidebar-width); width: var(--layout-sidebar-width);
min-width: 160px; min-width: 160px;

2
src/frontend/styles/main.pcss
View file

@ -6,7 +6,7 @@
@import './components/header.pcss'; @import './components/header.pcss';
@import './components/writing.pcss'; @import './components/writing.pcss';
@import './components/page.pcss'; @import './components/page.pcss';
@import './components/landing.pcss'; @import './components/greeting.pcss';
@import './components/auth.pcss'; @import './components/auth.pcss';
@import './components/error.pcss'; @import './components/error.pcss';
@import './components/button.pcss'; @import './components/button.pcss';

8
src/frontend/styles/vars.pcss
View file

@ -40,7 +40,8 @@
*/ */
--layout-padding-horizontal: 22px; --layout-padding-horizontal: 22px;
--layout-padding-vertical: 30px; --layout-padding-vertical: 30px;
--layout-sidebar-width: 290px; --layout-padding-content-horizontal: 50px;
--layout-sidebar-width: 280px;
--layout-width-main-col: 700px; --layout-width-main-col: 700px;
--layout-height-header: 56px; --layout-height-header: 56px;
@ -48,6 +49,7 @@
--layout-padding-horizontal: 15px; --layout-padding-horizontal: 15px;
--layout-padding-vertical: 15px; --layout-padding-vertical: 15px;
--layout-height-header: 88px; --layout-height-header: 88px;
--layout-padding-content-horizontal: var(--layout-padding-horizontal);
} }
@media (--wide-desktop) { @media (--wide-desktop) {
@ -264,3 +266,7 @@
@custom-media --not-mobile all and (min-width: 981px); @custom-media --not-mobile all and (min-width: 981px);
@custom-media --retina all and (-webkit-min-device-pixel-ratio: 1.5); @custom-media --retina all and (-webkit-min-device-pixel-ratio: 1.5);
@custom-media --can-hover all and (hover:hover); @custom-media --can-hover all and (hover:hover);
/**
* Big screens that have additional space around the center column
*/
@custom-media --widest-desktop all and (min-width: 1470px);

1
src/frontend/svg/frog.svg Normal file
View file

File diff suppressed because one or more lines are too long
Side by side

After

Width:  |  Height:  |  Size: 12 KiB