mirror of https://github.com/Budibase/budibase.git
nocodelowcodelow-codedockerdocker-composeinternal-projectinternal-toolinternal-toolslow-code-developmentlow-code-development-platformopensourceselfhostedweb-devweb-developmentweb-development-toolswebdevwebdevelopmentworkflow-automationautomationdeveloper-tools
You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
78 lines
2.2 KiB
78 lines
2.2 KiB
<script>
|
|
import { themeStore } from "stores"
|
|
</script>
|
|
|
|
<div style={$themeStore.customThemeCss}>
|
|
<slot />
|
|
</div>
|
|
|
|
<style>
|
|
div {
|
|
display: contents;
|
|
}
|
|
|
|
/* Themes */
|
|
div {
|
|
/* Buttons */
|
|
--spectrum-semantic-cta-color-background-default: var(--primaryColor);
|
|
--spectrum-semantic-cta-color-background-hover: var(--primaryColorHover);
|
|
|
|
/* Loading spinners */
|
|
--spectrum-progresscircle-medium-track-fill-color: var(--primaryColor);
|
|
|
|
/* Form fields */
|
|
--spectrum-alias-border-color-mouse-focus: var(--primaryColor);
|
|
--spectrum-alias-border-color-focus: var(--primaryColor);
|
|
--spectrum-radio-m-emphasized-circle-border-color-selected: var(
|
|
--primaryColor
|
|
);
|
|
--spectrum-radio-m-emphasized-circle-border-color-selected-hover: var(
|
|
--primaryColorHover
|
|
);
|
|
--spectrum-checkbox-m-emphasized-box-border-color-selected: var(
|
|
--primaryColor
|
|
);
|
|
--spectrum-checkbox-m-emphasized-box-border-color-selected-hover: var(
|
|
--primaryColorHover
|
|
);
|
|
|
|
/* Icons */
|
|
--spectrum-alias-icon-color-selected: var(--primaryColor);
|
|
--spectrum-alias-icon-color-selected-hover: var(--primaryColorHover);
|
|
|
|
/* Links */
|
|
--spectrum-link-primary-m-text-color: var(--primaryColor);
|
|
--spectrum-link-primary-m-text-color-hover: var(--primaryColorHover);
|
|
}
|
|
|
|
/* Theme flatpickr */
|
|
:global(.flatpickr-day.selected) {
|
|
background: var(--primaryColor);
|
|
border-color: var(--primaryColor);
|
|
}
|
|
:global(.flatpickr-day.selected:hover) {
|
|
background: var(--primaryColorHover);
|
|
border-color: var(--primaryColorHover);
|
|
}
|
|
|
|
/* Custom scrollbars */
|
|
:global(::-webkit-scrollbar) {
|
|
width: 8px;
|
|
height: 8px;
|
|
}
|
|
:global(::-webkit-scrollbar-track) {
|
|
background: var(--spectrum-alias-background-color-default);
|
|
}
|
|
:global(::-webkit-scrollbar-thumb) {
|
|
background-color: var(--spectrum-global-color-gray-400);
|
|
border-radius: 4px;
|
|
}
|
|
:global(::-webkit-scrollbar-corner) {
|
|
background: var(--spectrum-alias-background-color-default);
|
|
}
|
|
:global(*) {
|
|
scrollbar-width: thin;
|
|
scrollbar-color: var(--spectrum-global-color-gray-400)
|
|
var(--spectrum-alias-background-color-default);
|
|
}
|
|
</style>
|
|
|