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

[DURACOM-195] fix issue with logo on small screens

Browse Source 
(cherry picked from commit bff93a0847)
This commit is contained in:
Davide Negretti
2024-02-26 18:23:51 +01:00
parent 48e9817245
commit 49efc4175d
2 changed files with 12 additions and 3 deletions
Download Patch File Download Diff File Expand all files Collapse all files

4
src/themes/dspace/app/header/header.component.html
View File

@@ -1,5 +1,5 @@
<header id="main-site-header"> <header id="main-site-header">
<div class="container h-100 d-flex flex-row flex-nowrap justify-content-between gapx-3"> <div class="container h-100 d-flex flex-row flex-wrap align-items-center justify-content-between gapx-3 gapy-2" id="main-site-header-container">
<!-- Logo and navbar wrapper --> <!-- Logo and navbar wrapper -->
<div id="header-left" <div id="header-left"
[attr.role]="(isMobile$ | async) ? 'navigation' : 'presentation'" [attr.role]="(isMobile$ | async) ? 'navigation' : 'presentation'"
@@ -13,7 +13,7 @@
</nav> </nav>
</div> </div>
<!-- Search bar and other menus --> <!-- Search bar and other menus -->
<div id="header-right" class="h-100 d-flex flex-row flex-nowrap justify-content-end align-items-center gapx-1"> <div id="header-right" class="h-100 d-flex flex-row flex-nowrap justify-content-end align-items-center gapx-1 ml-auto">
<ds-themed-search-navbar></ds-themed-search-navbar> <ds-themed-search-navbar></ds-themed-search-navbar>
<div role="menubar" class="h-100 d-flex flex-row flex-nowrap align-items-center gapx-1"> <div role="menubar" class="h-100 d-flex flex-row flex-nowrap align-items-center gapx-1">
<ds-themed-lang-switch></ds-themed-lang-switch> <ds-themed-lang-switch></ds-themed-lang-switch>

11
src/themes/dspace/app/header/header.component.scss
View File

@@ -1,7 +1,16 @@
:host { :host {
#main-site-header { #main-site-header {
height: var(--ds-header-height); min-height: var(--ds-header-height);
@include media-breakpoint-up(md) {
height: var(--ds-header-height);
}
background-color: var(--ds-header-bg); background-color: var(--ds-header-bg);
&-container {
min-height: var(--ds-header-height);
}
} }
img#header-logo { img#header-logo {