Color ButtonDropdown background in var(--bg-color) regardless of theme
This commit is contained in:
parent
caa052e37e
commit
d66d229d15
@ -3,8 +3,6 @@ Copyright: Ankitects Pty Ltd and contributors
|
|||||||
License: GNU AGPL, version 3 or later; http://www.gnu.org/licenses/agpl.html
|
License: GNU AGPL, version 3 or later; http://www.gnu.org/licenses/agpl.html
|
||||||
-->
|
-->
|
||||||
<script lang="typescript">
|
<script lang="typescript">
|
||||||
import { getContext } from "svelte";
|
|
||||||
import { nightModeKey } from "./contextKeys";
|
|
||||||
import type { ToolbarItem } from "./types";
|
import type { ToolbarItem } from "./types";
|
||||||
import ButtonGroup from "./ButtonGroup.svelte";
|
import ButtonGroup from "./ButtonGroup.svelte";
|
||||||
|
|
||||||
@ -12,18 +10,14 @@ License: GNU AGPL, version 3 or later; http://www.gnu.org/licenses/agpl.html
|
|||||||
export let className = "";
|
export let className = "";
|
||||||
|
|
||||||
function extendClassName(className: string): string {
|
function extendClassName(className: string): string {
|
||||||
return `dropdown-menu py-1 mb-0 ${
|
return `dropdown-menu btn-dropdown-menu py-1 mb-0 ${className}`;
|
||||||
nightMode ? "btn-dropdown-menu--night-mode " : ""
|
|
||||||
}${className}`;
|
|
||||||
}
|
}
|
||||||
|
|
||||||
export let buttons: ToolbarItem[];
|
export let buttons: ToolbarItem[];
|
||||||
|
|
||||||
const nightMode = getContext(nightModeKey);
|
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<style>
|
<style>
|
||||||
:global(.btn-dropdown-menu--night-mode) {
|
:global(.btn-dropdown-menu) {
|
||||||
background-color: var(--window-bg);
|
background-color: var(--window-bg);
|
||||||
border-color: var(--medium-border);
|
border-color: var(--medium-border);
|
||||||
}
|
}
|
||||||
|
@ -23,6 +23,10 @@ License: GNU AGPL, version 3 or later; http://www.gnu.org/licenses/agpl.html
|
|||||||
button {
|
button {
|
||||||
display: flex;
|
display: flex;
|
||||||
justify-content: space-between;
|
justify-content: space-between;
|
||||||
|
}
|
||||||
|
|
||||||
|
.btn-day {
|
||||||
|
color: black;
|
||||||
|
|
||||||
&:active {
|
&:active {
|
||||||
background-color: button.$focus-color;
|
background-color: button.$focus-color;
|
||||||
@ -30,10 +34,6 @@ License: GNU AGPL, version 3 or later; http://www.gnu.org/licenses/agpl.html
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
.btn-day {
|
|
||||||
color: black;
|
|
||||||
}
|
|
||||||
|
|
||||||
.btn-night {
|
.btn-night {
|
||||||
color: white;
|
color: white;
|
||||||
|
|
||||||
@ -41,6 +41,11 @@ License: GNU AGPL, version 3 or later; http://www.gnu.org/licenses/agpl.html
|
|||||||
&:focus {
|
&:focus {
|
||||||
@include button.btn-night-base;
|
@include button.btn-night-base;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
&:active {
|
||||||
|
background-color: button.$focus-color;
|
||||||
|
color: white;
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
span {
|
span {
|
||||||
|
Loading…
Reference in New Issue
Block a user