heboba/goodgarden
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Update Front-End

Browse Source
This commit is contained in:
Renzo
2024-03-05 10:49:25 +01:00
parent 24875bf7c6
commit 4e9c8f415c
1 changed files with 167 additions and 74 deletions
Download Patch File Download Diff File Expand all files Collapse all files

109
src/css/style.scss
View File

@@ -9,23 +9,65 @@ $secondary-color: rgb(143, 188, 143);
$font-titels: "Akaya Kanadaka", system-ui;
$font-text: "Afacad", sans-serif;
/* The Main container and border*/
@mixin flexbox
{
display: flex;
justify-content: space-around;
}
@mixin groene-border
{
border: solid 2px $primary-color;
}
@mixin box-shadow
{
box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.5);
}
@mixin border-radius
{
border-radius: 40px;
}
h1, h2, h3, h4, h5
{
font-family: $font-titels;
margin: 0;
}
p, td
{
font-family: $font-text;
}
body
{
background-image: url("../images/achtergrond.png");
background-repeat: no-repeat;
background-size: cover;
font-family: $font-text;
}
background-position: center;
// font-family: $font-text;
display: flex;
justify-content: center;
align-items: center;
height: 100vh;
margin: 0;
.mainContainer
{
margin: 2rem;
.mainContainer
{
width: 85vw;
height: 38rem;
background-color: rgb(255, 255, 255, 95%);
border-radius: 40px;
padding: 2rem;
.informatie-kas-main-container
{
display: grid;
grid-template-columns: 5fr 7fr;
}
.mainBorder
{
padding: 1rem 0;
@@ -33,6 +75,53 @@ body
border: solid 5px $primary-color;
border-radius: 40px;
#sectie-1
{
h1
{
background-color: green;
}
.parent-algemeen-overzicht
{
@include box-shadow;
@include border-radius;
padding: 1rem;
.algemeen-overzicht
{
@include groene-border;
@include border-radius;
font-size: 1.25rem;
padding: 1rem;
background-color: red;
.table-informatie-kas
{
width: 100%;
.tr-informatie-kas
{
display: flex;
justify-content: space-between;
text-align: left;
}
// .tr-informatie-kas > :last-child
// {
// text-align: center; /* Centers the numbers */
// flex: 1; /* Allows it to expand to fill the space */
// }
// }
}
}
.grafiek
{
// background-color: blue;
}
}
.content
{
display: grid;
@@ -83,14 +172,16 @@ body
background-color: lightgray;
}
}
}
}
}
&-rechts
{
grid-column: 3;
margin-right: 2rem;
// margin-right: 2rem;
#metingen
{
@@ -118,9 +209,11 @@ body
}
}
}
}
}
}
/* Divider */
/* Divider */
.divider {
display: flex;
justify-content: center;