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

Added sidebar toggler (#214)

Browse source 
* feat: add sidebar slider

* fix: fix visibility on mobile layout

* fix visibility on mobile layout
* change keyboard shortcut
* change css property

* fix: fix shortcuts to support Mac

* fix shortcuts to support Mac
* add comment to explain properties

* fix: fix shortcuts

* resolve merge conflict

* fix: remove redundant property

Co-authored-by: Peter Savchenko <specc.dev@gmail.com>
This commit is contained in:
YeoKyung Yoon 2022-08-27 15:21:50 +09:00 • committed by GitHub
parent 136702aeb7
commit 09835e3007
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
6 changed files with 117 additions and 12 deletions
Download patch file Download diff file Expand all files Collapse all files

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

@ -1,6 +1,34 @@
.docs-sidebar {
width: 100vw;
&--animated {
.docs-sidebar__content {
transition: transform 200ms ease-in-out;
will-change: transform;
}
.docs-sidebar__slider {
transition: transform 200ms ease-in-out;
will-change: transform;
}
}
&--collapsed {
@media (--desktop) {
.docs-sidebar__content {
transform: translateX(-100%);
}
}
.docs-sidebar__slider {
transform: translateX(20px);
svg {
transform: rotate(180deg);
}
}
}
@media (--desktop) {
width: var(--layout-sidebar-width);
}
@ -188,6 +216,24 @@
}
}
&__slider {
display: none;
position: fixed;
transform: translateX(calc(var(--layout-sidebar-width) + 20px));
bottom: 20px;
width: 32px;
height: 32px;
border-radius: 8px;
cursor: pointer;
background-color: var(--color-link-hover);
@media (--desktop) {
display: flex;
justify-content: center;
align-items: center;
}
}
&__logo {
display: none;
margin-top: auto;