improve styles
This commit is contained in:
Vendored
+8
-8
@@ -145,7 +145,7 @@ main {
|
|||||||
}
|
}
|
||||||
[color]:not([color=standard]).subtle-background {
|
[color]:not([color=standard]).subtle-background {
|
||||||
--luma: var(--subtle-luma);
|
--luma: var(--subtle-luma);
|
||||||
background: hsl(var(--hue), 30%, var(--luma));
|
background: hsl(var(--hue), 100%, var(--luma), 50%);
|
||||||
}
|
}
|
||||||
@media (prefers-color-scheme: dark) {
|
@media (prefers-color-scheme: dark) {
|
||||||
[color]:not([color=standard]).subtle-background {
|
[color]:not([color=standard]).subtle-background {
|
||||||
@@ -164,7 +164,7 @@ main {
|
|||||||
--accent-text-luma: 100%;
|
--accent-text-luma: 100%;
|
||||||
--accent-text-luma-dark: 100%;
|
--accent-text-luma-dark: 100%;
|
||||||
--background-luma: 90%;
|
--background-luma: 90%;
|
||||||
--background-luma-dark: 10%;
|
--background-luma-dark: 11%;
|
||||||
--subtle-luma: 95%;
|
--subtle-luma: 95%;
|
||||||
--subtle-luma-dark: 5%;
|
--subtle-luma-dark: 5%;
|
||||||
}
|
}
|
||||||
@@ -175,7 +175,7 @@ main {
|
|||||||
--accent-text-luma: 0%;
|
--accent-text-luma: 0%;
|
||||||
--accent-text-luma-dark: 0%;
|
--accent-text-luma-dark: 0%;
|
||||||
--background-luma: 85%;
|
--background-luma: 85%;
|
||||||
--background-luma-dark: 10%;
|
--background-luma-dark: 11%;
|
||||||
--subtle-luma: 95%;
|
--subtle-luma: 95%;
|
||||||
--subtle-luma-dark: 5%;
|
--subtle-luma-dark: 5%;
|
||||||
}
|
}
|
||||||
@@ -186,7 +186,7 @@ main {
|
|||||||
--accent-text-luma: 100%;
|
--accent-text-luma: 100%;
|
||||||
--accent-text-luma-dark: 0%;
|
--accent-text-luma-dark: 0%;
|
||||||
--background-luma: 85%;
|
--background-luma: 85%;
|
||||||
--background-luma-dark: 9%;
|
--background-luma-dark: 12%;
|
||||||
--subtle-luma: 95%;
|
--subtle-luma: 95%;
|
||||||
--subtle-luma-dark: 5%;
|
--subtle-luma-dark: 5%;
|
||||||
}
|
}
|
||||||
@@ -197,7 +197,7 @@ main {
|
|||||||
--accent-text-luma: 0%;
|
--accent-text-luma: 0%;
|
||||||
--accent-text-luma-dark: 0%;
|
--accent-text-luma-dark: 0%;
|
||||||
--background-luma: 85%;
|
--background-luma: 85%;
|
||||||
--background-luma-dark: 8%;
|
--background-luma-dark: 12%;
|
||||||
--subtle-luma: 95%;
|
--subtle-luma: 95%;
|
||||||
--subtle-luma-dark: 5%;
|
--subtle-luma-dark: 5%;
|
||||||
}
|
}
|
||||||
@@ -208,7 +208,7 @@ main {
|
|||||||
--accent-text-luma: 100%;
|
--accent-text-luma: 100%;
|
||||||
--accent-text-luma-dark: 100%;
|
--accent-text-luma-dark: 100%;
|
||||||
--background-luma: 90%;
|
--background-luma: 90%;
|
||||||
--background-luma-dark: 10%;
|
--background-luma-dark: 12%;
|
||||||
--subtle-luma: 95%;
|
--subtle-luma: 95%;
|
||||||
--subtle-luma-dark: 5%;
|
--subtle-luma-dark: 5%;
|
||||||
}
|
}
|
||||||
@@ -219,7 +219,7 @@ main {
|
|||||||
--accent-text-luma: 100%;
|
--accent-text-luma: 100%;
|
||||||
--accent-text-luma-dark: 100%;
|
--accent-text-luma-dark: 100%;
|
||||||
--background-luma: 90%;
|
--background-luma: 90%;
|
||||||
--background-luma-dark: 12%;
|
--background-luma-dark: 11%;
|
||||||
--subtle-luma: 95%;
|
--subtle-luma: 95%;
|
||||||
--subtle-luma-dark: 5%;
|
--subtle-luma-dark: 5%;
|
||||||
}
|
}
|
||||||
@@ -258,7 +258,7 @@ body[showing-chat] #chat-page-wrapper {
|
|||||||
left: 0px;
|
left: 0px;
|
||||||
right: 0px;
|
right: 0px;
|
||||||
bottom: 0px;
|
bottom: 0px;
|
||||||
background-color: var(--background);
|
background-color: var(--background-glass);
|
||||||
z-index: 2;
|
z-index: 2;
|
||||||
}
|
}
|
||||||
#chat-page {
|
#chat-page {
|
||||||
|
|||||||
@@ -16,7 +16,7 @@ body[showing-chat] #chat-page-wrapper {
|
|||||||
right: 0px;
|
right: 0px;
|
||||||
bottom: 0px;
|
bottom: 0px;
|
||||||
|
|
||||||
background-color: var(--background);
|
background-color: var(--background-glass);
|
||||||
|
|
||||||
z-index: 2;
|
z-index: 2;
|
||||||
}
|
}
|
||||||
|
|||||||
+7
-7
@@ -89,7 +89,7 @@
|
|||||||
/* subtle */
|
/* subtle */
|
||||||
[color]:not([color="standard"]).subtle-background {
|
[color]:not([color="standard"]).subtle-background {
|
||||||
--luma: var(--subtle-luma);
|
--luma: var(--subtle-luma);
|
||||||
background: hsl(var(--hue), 30%, var(--luma));
|
background: hsl(var(--hue), 100%, var(--luma), 50%);
|
||||||
}
|
}
|
||||||
|
|
||||||
@media (prefers-color-scheme: dark) {
|
@media (prefers-color-scheme: dark) {
|
||||||
@@ -115,7 +115,7 @@
|
|||||||
--accent-text-luma-dark: 100%;
|
--accent-text-luma-dark: 100%;
|
||||||
|
|
||||||
--background-luma: 90%;
|
--background-luma: 90%;
|
||||||
--background-luma-dark: 10%;
|
--background-luma-dark: 11%;
|
||||||
|
|
||||||
--subtle-luma: 95%;
|
--subtle-luma: 95%;
|
||||||
--subtle-luma-dark: 5%;
|
--subtle-luma-dark: 5%;
|
||||||
@@ -131,7 +131,7 @@
|
|||||||
--accent-text-luma-dark: 0%;
|
--accent-text-luma-dark: 0%;
|
||||||
|
|
||||||
--background-luma: 85%;
|
--background-luma: 85%;
|
||||||
--background-luma-dark: 10%;
|
--background-luma-dark: 11%;
|
||||||
|
|
||||||
--subtle-luma: 95%;
|
--subtle-luma: 95%;
|
||||||
--subtle-luma-dark: 5%;
|
--subtle-luma-dark: 5%;
|
||||||
@@ -147,7 +147,7 @@
|
|||||||
--accent-text-luma-dark: 0%;
|
--accent-text-luma-dark: 0%;
|
||||||
|
|
||||||
--background-luma: 85%;
|
--background-luma: 85%;
|
||||||
--background-luma-dark: 9%;
|
--background-luma-dark: 12%;
|
||||||
|
|
||||||
--subtle-luma: 95%;
|
--subtle-luma: 95%;
|
||||||
--subtle-luma-dark: 5%;
|
--subtle-luma-dark: 5%;
|
||||||
@@ -163,7 +163,7 @@
|
|||||||
--accent-text-luma-dark: 0%;
|
--accent-text-luma-dark: 0%;
|
||||||
|
|
||||||
--background-luma: 85%;
|
--background-luma: 85%;
|
||||||
--background-luma-dark: 8%;
|
--background-luma-dark: 12%;
|
||||||
|
|
||||||
--subtle-luma: 95%;
|
--subtle-luma: 95%;
|
||||||
--subtle-luma-dark: 5%;
|
--subtle-luma-dark: 5%;
|
||||||
@@ -179,7 +179,7 @@
|
|||||||
--accent-text-luma-dark: 100%;
|
--accent-text-luma-dark: 100%;
|
||||||
|
|
||||||
--background-luma: 90%;
|
--background-luma: 90%;
|
||||||
--background-luma-dark: 10%;
|
--background-luma-dark: 12%;
|
||||||
|
|
||||||
--subtle-luma: 95%;
|
--subtle-luma: 95%;
|
||||||
--subtle-luma-dark: 5%;
|
--subtle-luma-dark: 5%;
|
||||||
@@ -195,7 +195,7 @@
|
|||||||
--accent-text-luma-dark: 100%;
|
--accent-text-luma-dark: 100%;
|
||||||
|
|
||||||
--background-luma: 90%;
|
--background-luma: 90%;
|
||||||
--background-luma-dark: 12%;
|
--background-luma-dark: 11%;
|
||||||
|
|
||||||
--subtle-luma: 95%;
|
--subtle-luma: 95%;
|
||||||
--subtle-luma-dark: 5%;
|
--subtle-luma-dark: 5%;
|
||||||
|
|||||||
Reference in New Issue
Block a user