benjaoming/website
1
0
Fork 0
forked from data.coop/website
Code Issues Pull requests Releases Wiki Activity

Responsive menu

Browse source
This commit is contained in:
Benjamin Bach 2021-05-04 22:21:50 +02:00
parent f60a5a5e9c
commit 47b221d422
Signed by: benjaoming
GPG key ID: 7D49441634585664
2 changed files with 38 additions and 13 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

37
themes/datacoop2020/assets/static/css/style.scss
View file

@ -75,8 +75,11 @@ body {
} }
.everything-container { .everything-container {
// Desktop
@include media-breakpoint-up(md) {
height: 100%; height: 100%;
max-width: 1200px; max-width: 1200px;
}
padding: 0; // Overwrites .container-fluid padding: 0; // Overwrites .container-fluid
margin: 0; // Overwrites .container-fluid margin: 0; // Overwrites .container-fluid
@ -89,6 +92,15 @@ body {
} }
// Mobile
@include media-breakpoint-down(sm) {
display: block;
.datacoop-sidebar {
height: 0;
display: block;
}
}
.datacoop-sidebar { .datacoop-sidebar {
background-color: $datacoop-light-blue; background-color: $datacoop-light-blue;
} }
@ -104,12 +116,25 @@ body {
color: $datacoop-purple; color: $datacoop-purple;
} }
// Mobile
@include media-breakpoint-down(sm) {
display: block;
width: 100%;
}
// Desktop
@include media-breakpoint-up(md) {
height: 100%;
width: 340px;
// Overwrite because of usage of flexbox stuff, we use display: block
.navbar-collapse,
.datacoop-menulists .datacoop-menulists
{ {
/*position: absolute;*/ display: block !important;
/*bottom: 20px;*/
} }
}
.data-coop-sidebar-logo .data-coop-sidebar-logo
{ {
display: block; display: block;
@ -118,8 +143,9 @@ body {
display: block; display: block;
width: 100%; width: 100%;
margin-left: 2px; margin-left: 2px;
max-width: 400px;
} }
font-size: 20px; margin-bottom: 30px;
} }
ul ul
@ -138,14 +164,15 @@ body {
ul > li > a ul > li > a
{ {
font-size: 40px; font-size: 30px;
} }
ul.datacoop-langchooser ul.datacoop-langchooser
{ {
display: block !important;
margin-top: 20px; margin-top: 20px;
li { li {
display: inline-block; display: block;
margin-right: 20px; margin-right: 20px;
a { a {
font-size: 18px; font-size: 18px;

4
themes/datacoop2020/layouts/_default/baseof.html
View file

@ -9,11 +9,9 @@
<div class="row"> <div class="row">
<div class="col-md-3 datacoop-sidebar d-print-none navbar navbar-expand-md mb-3" style="min-width: 340px;"> <div class="col-md-3 datacoop-sidebar d-print-none navbar navbar navbar-light navbar-expand-md">
<div style="width: 340px; height: 100%;">
{{ partial "nav.html" . }} {{ partial "nav.html" . }}
</div> </div>
</div>
<div class="col-md-1 datacoop-sidebar-gutter d-print-none d-none d-md-flex"> <div class="col-md-1 datacoop-sidebar-gutter d-print-none d-none d-md-flex">
<div class="sticky-bottom"> <div class="sticky-bottom">