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

[Refactor] Adjust color variables. Add some comments.

Browse Source
This commit is contained in:
Sakamoto Shiina
2025-06-09 12:35:40 +09:00
parent 5facadf139
commit 1f52c3625a
3 changed files with 12 additions and 8 deletions
Download Patch File Download Diff File Expand all files Collapse all files

10
src-ui/app/_index_css/variables.css
View File

@@ -18,12 +18,13 @@
--primary_600_color_44: #36877744; --primary_600_color_44: #36877744;
/* primary_300_color 61b4a7 as standard */
--sent_400_color: #6197b4; --sent_400_color: #6197b4;
--sent_300_color: #6197b4;
--received_300_color: #a861b4; --received_300_color: #a861b4;
--error_bc_color: #bb4448; --error_bc_color: #bb4448;
--error_bc_active_color: #9c3938; --error_bc_active_color: #9c3938;
--success_bc_color: #368777; --success_bc_color: --primary_600_color;
--warning_color: #cb944f; --warning_color: #cb944f;
--warning_bc_color: #cf7b1b; --warning_bc_color: #cf7b1b;
@@ -60,6 +61,8 @@
--dark_1000_color_aa: #151517aa; --dark_1000_color_aa: #151517aa;
--dark_1000_color_dd: #151517dd; --dark_1000_color_dd: #151517dd;
/*sent_400_color + #000 10% = */
--supporters_color_fuwa: #5788a2;
--title_bar_height: 2rem; --title_bar_height: 2rem;
--main_page_topbar_height: 4.8rem; --main_page_topbar_height: 4.8rem;
@@ -68,4 +71,5 @@
--font_family: "Yu Gothic UI"; --font_family: "Yu Gothic UI";
} }
/* https://m2.material.io/design/color/the-color-system.html#tools-for-picking-colors */ /* https://m2.material.io/design/color/the-color-system.html#tools-for-picking-colors */
/* https://meyerweb.com/eric/tools/color-blend/#::1:hex */

6
src-ui/app/config_page/setting_section/setting_box/supporters/support_us_container/SupportUsContainer.module.scss
View File

@@ -86,7 +86,7 @@ $progress_ease: cubic-bezier(0, 1, 0.75, 1);
} }
.line_fuwa { .line_fuwa {
background-color: #5788a2; background-color: var(--supporters_color_fuwa);
animation: expandWidth 1s $progress_ease 0.6s forwards; animation: expandWidth 1s $progress_ease 0.6s forwards;
} }
@@ -150,8 +150,8 @@ $progress_ease: cubic-bezier(0, 1, 0.75, 1);
box-shadow: 0 0 0.4rem 0 var(--dark_800_color); box-shadow: 0 0 0.4rem 0 var(--dark_800_color);
} }
.spiral_top::after { .spiral_top::after {
background: #5788a2; background: var(--supporters_color_fuwa);
box-shadow: 0 0 0.4rem 0 #5788a2; box-shadow: 0 0 0.4rem 0 var(--supporters_color_fuwa);
} }
.spiral_bottom::before { .spiral_bottom::before {
background: var(--received_300_color); background: var(--received_300_color);

4
src-ui/app/config_page/setting_section/setting_box/supporters/supporters_container/supporters_wrapper/SupportersWrapper.module.scss
View File

@@ -62,7 +62,7 @@ $progress_ease: cubic-bezier(0, 1, 0.75, 1);
height: 4rem; height: 4rem;
aspect-ratio: 1 /1; aspect-ratio: 1 /1;
border-radius: 50%; border-radius: 50%;
background-color: #ffffff; background-color: var(--dark_basic_text_color);
overflow: hidden; overflow: hidden;
position: relative; position: relative;
transition: transform 0.6s $progress_ease; transition: transform 0.6s $progress_ease;
@@ -236,7 +236,7 @@ $progress_ease: cubic-bezier(0, 1, 0.75, 1);
background-color: var(--received_300_color); background-color: var(--received_300_color);
} }
&.fuwa_bar { &.fuwa_bar {
background-color: #5788a2; background-color: var(--supporters_color_fuwa);
} }
&.basic_bar { &.basic_bar {
background-color: var(--dark_800_color); background-color: var(--dark_800_color);