add .inset-outline style for list toggle

This commit is contained in:
marlon-erler
2024-07-28 18:38:14 +02:00
parent d67b56f623
commit 89b3cb2080
4 changed files with 11 additions and 4 deletions
+2 -1
View File
@@ -4191,7 +4191,7 @@
), /* @__PURE__ */ createElement(
"button",
{
class: "ghost board-toggle-button",
class: "ghost board-toggle-button inset-outline",
"aria-label": translations.chatPage.task.toggleBoardButtonAudioLabel,
"on:click": boardViewModel.taskPageViewModel.toggleBoardList,
"toggle:selected": boardViewModel.taskPageViewModel.isShowingBoadList
@@ -4299,6 +4299,7 @@
/* @__PURE__ */ createElement("div", { class: "pane" }, /* @__PURE__ */ createElement("div", { class: "toolbar" }, /* @__PURE__ */ createElement("div", { class: "flex-row width-input" }, /* @__PURE__ */ createElement(
"input",
{
class: "no-outline",
"bind:value": taskPageViewModel.newBoardNameInput,
"on:enter": taskPageViewModel.createBoard,
placeholder: translations.chatPage.task.newBoardNamePlaceholder
+7 -2
View File
@@ -29,7 +29,7 @@ ANIMATION
}
.slide-up {
animation: slide-up var(--animation-duration)
animation: slide-up var(--animation-duration);
}
/*
@@ -383,7 +383,7 @@ hr {
input:not([type="checkbox"]):not([type="radio"]):not([type="range"]):focus:not(
label.tile *
),
):not(.no-outline),
label.tile:has(input:focus),
label.tile:has(textarea:focus),
textarea:focus:not(label.tile *),
@@ -391,6 +391,11 @@ textarea:focus:not(label.tile *),
outline: var(--outline-width) solid var(--primary);
}
.inset-outline[selected] {
outline: none;
box-shadow: var(--primary) 0 0 0 var(--outline-width) inset;
}
/* border-radius */
* {
border-radius: 0px;
+1 -1
View File
@@ -66,7 +66,7 @@ export function BoardPage(boardViewModel: BoardViewModel) {
<span class="icon">arrow_back</span>
</button>
<button
class="ghost board-toggle-button"
class="ghost board-toggle-button inset-outline"
aria-label={translations.chatPage.task.toggleBoardButtonAudioLabel}
on:click={boardViewModel.taskPageViewModel.toggleBoardList}
toggle:selected={boardViewModel.taskPageViewModel.isShowingBoadList}
+1
View File
@@ -55,6 +55,7 @@ export function TaskPage(taskPageViewModel: TaskPageViewModel) {
<div class="toolbar">
<div class="flex-row width-input">
<input
class="no-outline"
bind:value={taskPageViewModel.newBoardNameInput}
on:enter={taskPageViewModel.createBoard}
placeholder={translations.chatPage.task.newBoardNamePlaceholder}