every_holiday/VRCT
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

[Update] To be switchable between ConfigPage and MainPage.

Browse Source
This commit is contained in:
Sakamoto Shiina
2024-09-01 19:48:58 +09:00
parent 8f2c81a7d7
commit 3446862eda
6 changed files with 130 additions and 21 deletions
Download Patch File Download Diff File Expand all files Collapse all files

62
src-ui/app/config_page/topbar/Topbar.module.scss
View File

@@ -1,12 +1,66 @@
.container {
width: 100%;
height: 0%;
// position: sticky;
}
.wrapper {
height: var(--config_page_topbar_height);
// height: var(--config_page_topbar_height);
background-color: var(--dark_850_color);
display: flex;
justify-content: space-between;
flex-shrink: 0;
cursor: pointer;
height: 1rem;
width: 100%;
// display: flex;
// justify-content: space-between;
// flex-shrink: 0;
position: relative;
transition: all 0.3s ease;
&:hover {
height: 2rem;
}
&:hover .go_back_button {
top: -11rem;
transform: rotate(35deg);
}
&:hover .arrow_left_svg {
color: var(--dark_400_color);
}
&:hover .go_back_text {
color: var(--dark_400_color);
transform: rotate(-20deg);
}
}
.go_back_button {
height: 16rem;
width: 16rem;
border-radius: 1.2rem;
background-color: var(--dark_850_color);
position: absolute;
top: -12rem;
right: 10rem;
transform: rotate(30deg);
transition: all 0.3s ease;
}
.arrow_left_svg {
height: 3.2rem;
position: absolute;
right: 1rem;
bottom: 0.4rem;
color: var(--dark_600_color);
transform: rotate(-100deg);
}
.go_back_text {
color: var(--dark_650_color);
font-size: 1.6rem;
position: absolute;
bottom: 4.6rem;
right: -7rem;
transform: rotate(-30deg);
transition: all 0.3s ease;
}