phundrak/nord-for-org
Archived
1
0
Fork 0
Code Issues 1 Pull Requests Releases 4 Activity

Fixes #4

Browse Source 
Also put in common some code between TOC and Pages dropdown, made style
more mobile-friendly.
This commit is contained in:
Lucien Cartier-Tilet 2020-05-09 15:16:42 +02:00
parent 3c942b4b8f
commit fc1556128c
Signed by: phundrak
GPG Key ID: BD7789E705CB8DCA
1 changed files with 18 additions and 16 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

34
web/style/style.scss
View File

@ -336,7 +336,7 @@ header {
box-shadow: rgba(2, 8, 20, 0.1) 0px 0.175em 0.5em; box-shadow: rgba(2, 8, 20, 0.1) 0px 0.175em 0.5em;
transform: translateX(-40%); transform: translateX(-40%);
transition: opacity 500ms ease-in-out, top 500ms ease-in-out; transition: opacity 500ms ease-in-out, top 500ms ease-in-out, height 500ms ease-in-out;
} }
.has-dropdown { .has-dropdown {
@ -348,7 +348,7 @@ header {
pointer-events: auto; pointer-events: auto;
} }
#table-of-contents { #table-of-contents, #drop-page {
top: $navbar-height / 1.3; top: $navbar-height / 1.3;
opacity: 1; opacity: 1;
z-index: 5; z-index: 5;
@ -364,15 +364,26 @@ header {
transform: translateX(-75%); transform: translateX(-75%);
} }
#drop-page { #drop-page, #table-of-contents {
flex-direction: column; flex-direction: column;
transform: translateX(-40%);
li { transform: translateX(-45%);
padding: 5px; top: -40px;
height: 0;
min-width: 350px;
overflow-y: auto;
font-size: 0.9em;
}
@media #{$switch-small-screen} {
#drop-page {
transform: translateX(-27.5%);
} }
} }
#drop-share { #drop-share, #drop-page {
li { li {
padding: 10px; padding: 10px;
} }
@ -384,7 +395,6 @@ header {
a { a {
width: 100%; width: 100%;
height: 100%; height: 100%;
size: 0.7rem;
padding-left: 10px; padding-left: 10px;
padding-right: 10px; padding-right: 10px;
font-weight: bold; font-weight: bold;
@ -392,17 +402,9 @@ header {
} }
#table-of-contents { #table-of-contents {
flex-direction: column;
padding: 20px; padding: 20px;
float: right; float: right;
overflow-y: auto;
height: 0%;
width: 75%; width: 75%;
min-width: 350px;
transform: translateX(-45%);
font-size: 0.9em;
top: -40px;
transition: height 500ms ease-in-out, opacity 500ms ease-in-out, top 500ms ease-in-out; transition: height 500ms ease-in-out, opacity 500ms ease-in-out, top 500ms ease-in-out;
li { li {