Updated page style & added drop love button

This commit is contained in:
2024-09-03 19:36:34 +02:00
parent f357cd97fb
commit 8c5423887b
4 changed files with 49 additions and 11 deletions
+22 -9
View File
@@ -1,34 +1,47 @@
.navbar {
$navSize: 60px;
position: fixed;
bottom: 0;
left: 0;
position: relative;
z-index: 1;
display: grid;
justify-items: center;
align-items: center;
width: 100svw;
height: $navSize;
height: var(--navSize);
background-color: #d94253;
box-shadow: 0 0 6px rgba(0, 0, 0, 0.6);
& > .navButton {
position: relative;
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
gap: 5px;
width: $navSize;
height: $navSize;
width: var(--navSize);
height: var(--navSize);
border-radius: 50%;
background-color: #d94253;
color: #ffffff;
& > svg {
width: $navSize / 2.5;
width: calc(var(--navSize) / 2.5);
}
&.selected {
margin-top: $navSize / -2;
scale: 1.2;
margin-top: calc(var(--navSize) / -2);
&::after {
content: '';
position: absolute;
top: 0;
left: 0;
display: block;
width: 100%;
height: 100%;
border-radius: 50%;
box-shadow: 0 0 6px rgba(0, 0, 0, 0.6);
clip-path: inset(-6px -6px 42px -6px);
}
}
& > .navButtonLabel {