Rasmus
/
website_rasmus
forked from data.coop/website
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Responsive menu

This commit is contained in:
Benjamin Bach 2021-05-04 22:21:50 +02:00
parent f60a5a5e9c
commit 47b221d422
Signed by untrusted user: 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

47
themes/datacoop2020/assets/static/css/style.scss
View File

@ -75,8 +75,11 @@ body {
} }
.everything-container { .everything-container {
height: 100%; // Desktop
max-width: 1200px; @include media-breakpoint-up(md) {
height: 100%;
max-width: 1200px;
}
padding: 0; // Overwrites .container-fluid padding: 0; // Overwrites .container-fluid
margin: 0; // Overwrites .container-fluid margin: 0; // Overwrites .container-fluid
@ -84,11 +87,20 @@ body {
{ {
max-width: 1200px; max-width: 1200px;
margin: 0; // Overwrites .row margin: 0; // Overwrites .row
height: 100%; height: 100%;
} }
} }
// 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;
} }
.datacoop-menulists // Mobile
{ @include media-breakpoint-down(sm) {
/*position: absolute;*/ display: block;
/*bottom: 20px;*/ 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
{
display: block !important;
}
}
.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,10 +9,8 @@
<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">