Pop_Slime/crtr
1
0
Fork 0
Code Issues 6 Pull Requests Projects 1 Releases Activity

Add dark mode for skin editor.

Browse Source
This commit is contained in:
PopSlime
2022-10-12 23:28:56 +08:00
parent 7704fb6682
commit e642f1a4ac
1 changed files with 150 additions and 116 deletions
Download Patch File Download Diff File Expand all files Collapse all files

40
Http/SkinEditor/app.css
View File

@@ -13,7 +13,6 @@ body {
#toolbar { #toolbar {
height: 32px; height: 32px;
display: flex; display: flex;
align-items: center;
} }
.tgbtn { .tgbtn {
@@ -192,17 +191,19 @@ input {
display: inline-block; display: inline-block;
} }
.t-internal {
background-color: lightgray;
}
/* Debug Mode */ /* Debug Mode */
.mode-debug .t-internal { .mode-debug .t-internal {
display: block; display: block;
background-color: lightgray;
opacity: 0.6; opacity: 0.6;
} }
/* Sort Mode */ /* Sort Mode */
.mode-sort .t-internal { .mode-sort .t-internal {
display: block; display: block;
background-color: lightgray;
opacity: 1; opacity: 1;
} }
@@ -251,3 +252,36 @@ input {
margin: 0; margin: 0;
border: solid 1px green; border: solid 1px green;
} }
@media (prefers-color-scheme: dark) {
body {
background-color: black;
color: white;
}
.t-list {
background-color: darkslategray;
}
.t-li:hover {
background-color: darkblue;
}
input {
background-color: black;
color: white;
}
.tgbtn-active {
background-color: darkslateblue;
}
.tgbtn:hover {
background-color: gray;
}
.t-internal {
background-color: dimgray;
}
.mode-sort.state-grabbing .t-grabbing {
background-color: green;
border-left-color: lightgreen;
}
.grab-ptr {
border: solid 1px lightgreen;
}
}