hazza/dspace-angular
1
0
Fork 1
mirror of https://github.com/DSpace/dspace-angular.git synced 2025-10-07 18:14:17 +00:00
Code Issues Packages Projects Releases Wiki Activity

Workaround missing navbar @768px for dspace and custom templates

Browse Source 
The treatment of the breakpoints is inconsistent. md is defined as
768px<=md<992px.
The statement
@media screen and (max-width: map-get($grid-breakpoints, md)) {}
,which is in some instances used at the moment for referencing break intervals BELOW md includes the lower md border which should be excluded.
The sass mixin
@include media-breakpoint-down($name) {}
or function
breakpoint-max($name)
for some unknown reason don't work, so this is a workaround.
This commit is contained in:
Peter Wolfersberger
2022-09-27 15:19:00 +02:00
parent 064dae2581
commit fc624a406f
2 changed files with 4 additions and 4 deletions
Download Patch File Download Diff File Expand all files Collapse all files

4
src/app/navbar/navbar.component.scss
View File

@@ -4,7 +4,7 @@ nav.navbar {
} }
/** Mobile menu styling **/ /** Mobile menu styling **/
@media screen and (max-width: map-get($grid-breakpoints, md)) { @media screen and (max-width: map-get($grid-breakpoints, md)-0.02) {
.navbar { .navbar {
width: 100vw; width: 100vw;
background-color: var(--bs-white); background-color: var(--bs-white);
@@ -26,7 +26,7 @@ nav.navbar {
/* TODO remove when https://github.com/twbs/bootstrap/issues/24726 is fixed */ /* TODO remove when https://github.com/twbs/bootstrap/issues/24726 is fixed */
.navbar-expand-md.navbar-container { .navbar-expand-md.navbar-container {
@media screen and (max-width: map-get($grid-breakpoints, md)) { @media screen and (max-width: map-get($grid-breakpoints, md)-0.02) {
> .container { > .container {
padding: 0 var(--bs-spacer); padding: 0 var(--bs-spacer);
} }

4
src/themes/dspace/app/navbar/navbar.component.scss
View File

@@ -6,7 +6,7 @@ nav.navbar {
} }
/** Mobile menu styling **/ /** Mobile menu styling **/
@media screen and (max-width: map-get($grid-breakpoints, md)) { @media screen and (max-width: map-get($grid-breakpoints, md)-0.02) {
.navbar { .navbar {
width: 100%; width: 100%;
background-color: var(--bs-white); background-color: var(--bs-white);
@@ -28,7 +28,7 @@ nav.navbar {
/* TODO remove when https://github.com/twbs/bootstrap/issues/24726 is fixed */ /* TODO remove when https://github.com/twbs/bootstrap/issues/24726 is fixed */
.navbar-expand-md.navbar-container { .navbar-expand-md.navbar-container {
@media screen and (max-width: map-get($grid-breakpoints, md)) { @media screen and (max-width: map-get($grid-breakpoints, md)-0.02) {
> .container { > .container {
padding: 0 var(--bs-spacer); padding: 0 var(--bs-spacer);
a.navbar-brand { a.navbar-brand {