Northbrook/TastyBites
1
0
Fork 0
mirror of https://github.com/Fluffy-Bean/TastyBites.git synced 2025-06-05 09:53:12 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions

Mobile nav bar

Browse source 
Self closing divs to make stuff easier to read
This commit is contained in:
Michał Gdula 2024-04-25 23:32:04 +01:00
parent 4433d7cc19
commit 8ab0957a85
7 changed files with 91 additions and 51 deletions
Download patch file Download diff file Expand all files Collapse all files

18
front/src/styles/_navigation_bar.scss
View file

@ -1,5 +1,5 @@
nav {
padding: $spacing-small;
padding: $spacing-small $spacing-normal;
width: 100%;
height: $sizing-navigation-height;
@ -31,16 +31,21 @@ nav {
list-style: none;
li {
padding: 0 $spacing-small;
font-weight: $font-weight-normal;
font-size: $font-size-h6;
border-radius: $border-radius-circle;
a {
padding: $spacing-xsmall $spacing-normal;
display: block;
text-decoration: none;
color: inherit;
}
&:hover {
background-color: rgba($color-light, 0.05);
}
&.active {
color: $color-primary !important;
}
@ -63,4 +68,11 @@ nav {
&.scrolled {
//box-shadow: 0 0 15px 1px $color-background;
}
&.mobile {
ul {
width: 100%;
justify-content: space-around;
}
}
}

1
front/src/styles/vars.scss
View file

@ -25,6 +25,7 @@ $sizing-full-width: 1200px;
$sizing-navigation-height: 55px;
// PADDING/MARGIN
$spacing-xsmall: 5px;
$spacing-small: 10px;
$spacing-normal: 16px;
$spacing-large: 32px;