vrifox/website
vrifox/website
1
0
Fork 0
Code Issues 3 Pull requests Activity

update

Browse source
This commit is contained in:
Vri 🌈 2023-03-09 17:02:06 +01:00
parent 287077d9a9
commit 4c2cc9f3b4
Signed by: vrifox
GPG key ID: D40098E5B60B2197
4 changed files with 48 additions and 23 deletions
Download patch file Download diff file Expand all files Collapse all files

32
assets/scss/partials/sidebar.scss
View file

@ -17,6 +17,18 @@
border-radius: 0 2rem 2rem 0;
border: 1px solid var(--sidebar-border);
border-left: 0;
overflow: hidden;
@media (max-width: 1040px) {
top: auto;
bottom: 0;
border-radius: 2rem 2rem 0 0;
flex-direction: row;
width: calc(100vw - 1rem);
height: 5rem;
margin: 0 0.5rem;
overflow-y: hidden;
overflow-x: scroll;
}
header {
text-align: center;
user-select: none;
@ -37,6 +49,11 @@
list-style: none;
padding: 0;
margin: 0;
@media (max-width: 1040px) {
display: flex;
flex-direction: row;
height: 100%;
}
}
li {
border-radius: 0.5em;
@ -49,13 +66,16 @@
align-items: center;
justify-content: center;
transition: background-color 0.2s linear;
@media (max-width: 1040px) {
margin: 0 0.5rem;
}
a {
display: block;
padding: .25em .5em;
line-height: 4rem;
}
&::after {
background-color: var(--sidebar-accent);
background-color: var(--sidebar-accent-1);
bottom: 0;
content: "";
height: 100%;
@ -69,12 +89,12 @@
transition: left 0.5s ease-out, opacity 0.5s ease-out, background-color 0.2s linear;
}
&.active {
background-color: var(--sidebar-accent);
background-color: var(--sidebar-accent-1);
&:hover {
background-color: var(--sidebar-accented);
background-color: var(--sidebar-accent-2);
}
&:active {
background-color: var(--sidebar-accentest);
background-color: var(--sidebar-accent-3);
}
}
&:hover {
@ -85,7 +105,7 @@
}
&:active {
&::after {
background-color: var(--sidebar-accented);
background-color: var(--sidebar-accent-2);
}
}
}
@ -123,7 +143,6 @@
pointer-events: none;
&:hover {
#languages {
//display: block;
bottom: 2em;
opacity: 100%;
pointer-events: all;
@ -145,7 +164,6 @@
padding: 0;
user-select: none;
position: absolute;
//display: none;
bottom: 1em;
opacity: 0%;
transition: bottom .5s, opacity .5s;