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

Move form element styling to SCSS

Browse source 
Add time timetable on index page
This commit is contained in:
Michał Gdula 2024-04-26 15:30:01 +01:00
parent 3614a2553f
commit a53879b86f
9 changed files with 178 additions and 74 deletions
Download patch file Download diff file Expand all files Collapse all files

5
front/src/styles/_announcement_banner.scss
View file

@ -13,6 +13,7 @@
display: block;
aspect-ratio: 16 / 7;
object-fit: cover;
}
}
@ -22,5 +23,9 @@
margin: -$spacing-normal;
margin-bottom: 0;
border-radius: 0;
img {
aspect-ratio: 16 / 9;
}
}
}

49
front/src/styles/_form_element.scss Normal file
View file

@ -0,0 +1,49 @@
.form-element {
margin-bottom: $spacing-normal;
width: fit-content;
overflow: hidden;
}
.form-label {
padding: $spacing-xsmall;
display: block;
font-size: $font-size-small;
text-shadow: 0 1px 0.5px rgba(#000, 0.2);
color: $color-on-background;
}
.form-input {
padding: $spacing-small;
display: block;
font-family: $font-family;
font-size: $font-size-p;
border: 1px solid rgba($color-dark, 0.2);
border-radius: $border-radius-normal;
background-color: $color-light;
color: $color-on-light;
&:hover {
border: 1px solid rgba($color-dark, 0.4);
}
&:focus {
border: 1px solid rgba($color-primary, 0.9);
outline: 0 solid transparent;
}
}
.form-notice {
padding: 0 $spacing-xsmall;
display: block;
font-size: $font-size-xsmall;
text-shadow: 0 1px 0.5px rgba(#000, 0.2);
color: rgba($color-on-background, 0.7);
&.error {
color: $color-error;
}
}

2
front/src/styles/main.scss
View file

@ -6,3 +6,5 @@
@import "announcement_banner";
@import "container";
@import "menu_item";
@import "form_element";