JakeHillion/storj
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

web/satellite: adjust mobile header padding and logo

Browse Source 
The mobile header's horizontal padding has been adjusted to match the
padding of the page content. Additionally, the size of the logo in the
mobile header has been decreased.

Change-Id: I7559813455fb186f1402783db6022ebdaa59c7ae
This commit is contained in:
Jeremy Wharton 2023-06-29 00:03:34 -05:00 committed by Storj Robot
parent f1fab9edfb
commit bd3aaf4f34
2 changed files with 8 additions and 26 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

17
web/satellite/src/components/navigation/MobileNavigation.vue
View File

@ -5,9 +5,7 @@
<div class="navigation-area"> <div class="navigation-area">
<div class="navigation-area__container"> <div class="navigation-area__container">
<header class="navigation-area__container__header"> <header class="navigation-area__container__header">
<div class="navigation-area__container__header__logo" @click.stop="onLogoClick"> <LogoIcon class="navigation-area__container__header__logo" @click.stop="onLogoClick" />
<LogoIcon />
</div>
<CrossIcon v-if="isOpened" @click="toggleNavigation" /> <CrossIcon v-if="isOpened" @click="toggleNavigation" />
<MenuIcon v-else @click="toggleNavigation" /> <MenuIcon v-else @click="toggleNavigation" />
</header> </header>
@ -570,21 +568,14 @@ async function onLogout(): Promise<void> {
display: flex; display: flex;
width: 100%; width: 100%;
box-sizing: border-box; box-sizing: border-box;
padding: 0 32px; padding: 0 24px;
justify-content: space-between; justify-content: space-between;
align-items: center; align-items: center;
height: 4rem; height: 4rem;
&__logo { &__logo {
width: 211px; height: 30px;
max-width: 211px; width: auto;
height: 37px;
max-height: 37px;
svg {
width: 211px;
height: 37px;
}
} }
} }

17
web/satellite/src/views/all-dashboard/components/Heading.vue
View File

@ -33,9 +33,7 @@
<div class="header__mobile-area"> <div class="header__mobile-area">
<div class="header__mobile-area__container"> <div class="header__mobile-area__container">
<header class="header__mobile-area__container__header"> <header class="header__mobile-area__container__header">
<div class="header__mobile-area__container__header__logo" @click.stop="goToProjects"> <LogoIcon class="header__mobile-area__container__header__logo" @click.stop="goToProjects" />
<LogoIcon />
</div>
<CrossIcon v-if="isNavOpened" @click="toggleNavigation" /> <CrossIcon v-if="isNavOpened" @click="toggleNavigation" />
<MenuIcon v-else @click="toggleNavigation" /> <MenuIcon v-else @click="toggleNavigation" />
</header> </header>
@ -368,21 +366,14 @@ function sendDocsEvent(): void {
display: flex; display: flex;
width: 100%; width: 100%;
box-sizing: border-box; box-sizing: border-box;
padding: 0 32px; padding: 0 20px;
justify-content: space-between; justify-content: space-between;
align-items: center; align-items: center;
height: 4rem; height: 4rem;
&__logo { &__logo {
width: 211px; height: 30px;
max-width: 211px; width: auto;
height: 37px;
max-height: 37px;
svg {
width: 211px;
height: 37px;
}
} }
} }