diff --git a/src/lib/components/dialog/RemoveCollectionDialog.svelte b/src/lib/components/dialog/RemoveCollectionDialog.svelte index e6f090f..d9e56d7 100644 --- a/src/lib/components/dialog/RemoveCollectionDialog.svelte +++ b/src/lib/components/dialog/RemoveCollectionDialog.svelte @@ -38,7 +38,7 @@ Are you sure you want to remove from your collection?
{#if existsInCollection} - {:else} @@ -139,6 +139,14 @@ background-color: var(--color-btn-primary-active); } + .remove { + background-color: var(--warning); + + &:hover { + background-color: var(--warning-hover); + } + } + .button-icon { display: grid; grid-template-columns: repeat(2, auto); diff --git a/src/styles/global.scss b/src/styles/global.scss index 0ccf65b..47e79a3 100644 --- a/src/styles/global.scss +++ b/src/styles/global.scss @@ -18,7 +18,7 @@ --clr-input-txt: hsl(177 100% 15%); --red: #990000; - --tomatoOrange: #e54b4b; + --tomatoOrange: hsla(0, 75%, 60%, 1); --redBrown: #633539; --blue: #336699; --black: #1f273a; @@ -318,6 +318,14 @@ input { cursor: not-allowed; } +.remove { + background-color: var(--warning); + + &:hover { + background-color: var(--warning-hover); + } +} + ul, ol { list-style: none; diff --git a/src/styles/theme.scss b/src/styles/theme.scss index 1436267..aec2fbe 100644 --- a/src/styles/theme.scss +++ b/src/styles/theme.scss @@ -61,6 +61,10 @@ html[data-theme='🌛 Night'] { /* Input Fields */ --input-bg: #181a1b; + + /* Button */ + --warning: hsla(0, 75%, 60%, 0.90); + --warning-hover: hsla(0, 75%, 60%, 1); } html[data-theme='☀️ Daylight'] { @@ -126,4 +130,8 @@ html[data-theme='☀️ Daylight'] { /* Input Fields */ --input-bg: #181a1b; + + /* Button */ + --warning: hsla(0, 75%, 60%, 0.90); + --warning-hover: hsla(0, 75%, 60%, 1); } \ No newline at end of file