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

Added page navigation (#209)

Browse source 
* Added navigation on page

* Removed useless log, added docs to navigator component

* Fixed duplicated variables, some changes in navigation functions, changed pages.twig and navigator.twig

* Added flatArray model, changed navigation functions

* Replaced page footer style to page.pcss

* Fixed generating flat array, when pages remove

* Removed useless generating

* Renamed flatArray model to pagesFlatArray, updated descriptions, renamed generate to regenerate, removed hardcoded key name in cache

* Changed styles naming and added margin for navigation

* Added ability to change nesting in flat array, fixed BEM

* Updated nesting parameter, fixed BEM

* Changed navigator component by passing objects, removed navigator wrapper

* Style navigator renamed to navigator__item

* Update src/backend/models/pagesFlatArray.ts

Co-authored-by: Peter Savchenko <specc.dev@gmail.com>

* Renamed navigator__item to navigator_item

* Deleted wrappers from navigator buttons, removed page__footer

Co-authored-by: Peter Savchenko <specc.dev@gmail.com>
This commit is contained in:
slaveeks 2022-08-02 17:38:02 +03:00 • committed by GitHub
parent 213f9d89a3
commit 70f89f28da
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
15 changed files with 352 additions and 18 deletions
Download patch file Download diff file Expand all files Collapse all files

42
src/frontend/styles/components/navigator.pcss Normal file
View file

@ -0,0 +1,42 @@
.navigator {
display: flex;
}
.navigator__item {
margin-top: 35px;
cursor: pointer;
-webkit-user-select: none;
display: flex;
flex-direction: column;
justify-content: space-between;
background-color: var(--color-link-hover);
border-radius: 10px;
padding: 12px 16px 12px 16px;
color: black;
width: max-content;
font-weight: 500;
font-size: 14px;
&--previous {
align-items: flex-start;
margin-left: 0;
}
&--next {
align-items: flex-end;
margin-left: auto;
}
&-direction {
text-transform: capitalize;
color: var(--color-direction-navigation);
font-size: 12px;
font-weight: 400;
}
&-label {
width: 100%;
}
}

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

@ -496,3 +496,4 @@
}
}
}

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

@ -10,6 +10,7 @@
@import './components/auth.pcss';
@import './components/button.pcss';
@import './components/sidebar.pcss';
@import './components/navigator.pcss';
@import './components/table-of-content.pcss';
body {

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

@ -1,6 +1,7 @@
:root {
--color-text-main: #313649;
--color-text-second: #5d6068;
--color-direction-navigation: #717682;
--color-line-gray: #E8E8EB;
--color-link-active: #2071cc;
--color-link-hover: #F3F6F8;
@ -124,7 +125,7 @@
--squircle {
border-radius: 8px;
@supports(-webkit-mask-box-image: url('')){
border-radius: 0;
-webkit-mask-box-image: url("data:image/svg+xml,%3Csvg width='24' height='24' viewBox='0 0 24 24' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M0 10.3872C0 1.83334 1.83334 0 10.3872 0H13.6128C22.1667 0 24 1.83334 24 10.3872V13.6128C24 22.1667 22.1667 24 13.6128 24H10.3872C1.83334 24 0 22.1667 0 13.6128V10.3872Z' fill='black'/%3E%3C/svg%3E%0A") 48% 41% 37.9% 53.3%;;