improve UI

This commit is contained in:
marlon-erler
2024-07-23 03:05:14 +02:00
parent 4855fef050
commit 12947f8063
3 changed files with 23 additions and 1 deletions
+9
View File
@@ -121,6 +121,15 @@ main {
[color]:not([color=standard])[selected].fill-color { [color]:not([color=standard])[selected].fill-color {
color: var(--primary); color: var(--primary);
} }
[color]:not([color=standard]).background {
--luma: var(--subtle-luma);
background: hsl(var(--hue), 90%, var(--luma));
}
@media (prefers-color-scheme: dark) {
[color]:not([color=standard]).background {
--luma: var(--subtle-luma-dark);
}
}
[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), 30%, var(--luma));
+1 -1
View File
@@ -2019,7 +2019,7 @@
} }
} }
); );
return /* @__PURE__ */ createElement("div", { id: "task-page" }, /* @__PURE__ */ createElement("div", { class: "pane side" }, /* @__PURE__ */ createElement("div", { class: "toolbar" }, /* @__PURE__ */ createElement("div", { class: "flex-row width-input" }, /* @__PURE__ */ createElement( return /* @__PURE__ */ createElement("div", { id: "task-page" }, /* @__PURE__ */ createElement("div", { "set:color": taskPageViewModel.chatViewModel.displayedColor, class: "pane side background" }, /* @__PURE__ */ createElement("div", { class: "toolbar" }, /* @__PURE__ */ createElement("div", { class: "flex-row width-input" }, /* @__PURE__ */ createElement(
"input", "input",
{ {
"bind:value": taskPageViewModel.newBoardNameInput, "bind:value": taskPageViewModel.newBoardNameInput,
+13
View File
@@ -58,6 +58,18 @@
color: var(--primary); color: var(--primary);
} }
/* background */
[color]:not([color="standard"]).background {
--luma: var(--subtle-luma);
background: hsl(var(--hue), 90%, var(--luma));
}
@media (prefers-color-scheme: dark) {
[color]:not([color="standard"]).background {
--luma: var(--subtle-luma-dark);
}
}
/* subtle */ /* subtle */
[color]:not([color="standard"]).subtle-background { [color]:not([color="standard"]).subtle-background {
--luma: var(--subtle-luma); --luma: var(--subtle-luma);
@@ -145,6 +157,7 @@
--accent-text-luma: 100%; --accent-text-luma: 100%;
--accent-text-luma-dark: 100%; --accent-text-luma-dark: 100%;
--subtle-luma: 95%; --subtle-luma: 95%;
--subtle-luma-dark: 5%; --subtle-luma-dark: 5%;
} }