mirror of
https://github.com/Mathijs0/home_assistant_thema_mrl.git
synced 2024-11-22 16:20:16 +01:00
Toegevoegd eerste thema
This commit is contained in:
parent
01a7073a01
commit
518f7e85e1
1 changed files with 310 additions and 0 deletions
310
themes/mrl.yaml
Normal file
310
themes/mrl.yaml
Normal file
|
|
@ -0,0 +1,310 @@
|
|||
####################### LATTE #######################
|
||||
MRL light:
|
||||
# Colors
|
||||
text: "#4c4f69"
|
||||
|
||||
subtext1: "#5c5f77"
|
||||
subtext0: "#6c6f85"
|
||||
|
||||
overlay2: "#7c7f93"
|
||||
overlay1: "#8c8fa1"
|
||||
overlay0: "#9ca0b0"
|
||||
|
||||
surface2: "#acb0be"
|
||||
surface1: "#bcc0cc"
|
||||
surface0: "#ccd0da"
|
||||
|
||||
base: "#eff1f5"
|
||||
mantle: "#e6e9ef"
|
||||
crust: "#dce0e8"
|
||||
|
||||
rosewater: "#dc8a78"
|
||||
flamingo: "#dd7878"
|
||||
pink: "#ea76cb"
|
||||
mauve: "#8839ef"
|
||||
red: "#d20f39"
|
||||
maroon: "#e64553"
|
||||
peach: "#fe640b"
|
||||
yellow: "#df8e1d"
|
||||
green: "#40a02b"
|
||||
teal: "#179299"
|
||||
sky: "#04a5e5"
|
||||
sapphire: "#209fb5"
|
||||
blue: "#1e66f5"
|
||||
lavender: "#7287fd"
|
||||
|
||||
###########################
|
||||
|
||||
# Header
|
||||
app-header-background-color: var(--mantle)
|
||||
app-header-text-color: var(--text)
|
||||
|
||||
# Main Interface colors
|
||||
primary-color: var(--blue)
|
||||
light-primary-color: var(--primary-color)
|
||||
|
||||
primary-background-color: var(--mantle)
|
||||
secondary-background-color: var(--mantle)
|
||||
accent-color: var(--yellow)
|
||||
|
||||
# Text
|
||||
primary-text-color: var(--text)
|
||||
secondary-text-color: var(--subtext1)
|
||||
text-primary-color: var(--text)
|
||||
divider-color: var(--base)
|
||||
disabled-text-color: var(--overlay0)
|
||||
text-accent-color: var(--text)
|
||||
|
||||
# Sidebar
|
||||
sidebar-background-color: var(--crust)
|
||||
sidebar-selected-background-color: var(--primary-background-color)
|
||||
|
||||
sidebar-icon-color: var(--subtext0)
|
||||
sidebar-text-color: var(--subtext0)
|
||||
sidebar-selected-icon-color: var(--mauve)
|
||||
sidebar-selected-text-color: var(--mauve)
|
||||
|
||||
# Buttons
|
||||
paper-item-icon-color: var(--subtext0)
|
||||
paper-item-icon-active-color: var(--primary-color)
|
||||
|
||||
# States and Badges
|
||||
state-icon-color: var(--lavender)
|
||||
state-icon-active-color: var(--primary-color)
|
||||
|
||||
state-icon-unavailable-color: var(--disabled-text-color)
|
||||
|
||||
# Sliders
|
||||
paper-slider-knob-color: var(--blue)
|
||||
paper-slider-knob-start-color: var(--paper-slider-knob-color)
|
||||
paper-slider-pin-color: var(--paper-slider-knob-color)
|
||||
paper-slider-active-color: var(--paper-slider-knob-color)
|
||||
paper-slider-secondary-color: var(--blue)
|
||||
|
||||
# Labels
|
||||
label-badge-background-color: var(--surface0)
|
||||
label-badge-text-color: var(--text)
|
||||
label-badge-red: var(--red)
|
||||
label-badge-green: var(--green)
|
||||
label-badge-blue: var(--blue)
|
||||
label-badge-yellow: var(--yellow)
|
||||
label-badge-gray: var(--overlay0)
|
||||
|
||||
# Cards
|
||||
card-background-color: var(--base)
|
||||
ha-card-background: var(--card-background-color)
|
||||
|
||||
ha-card-border-radius: "15px"
|
||||
ha-card-box-shadow: none
|
||||
paper-dialog-background-color: var(--overlay0)
|
||||
paper-listbox-background-color: var(--overlay0)
|
||||
paper-card-background-color: var(--card-background-color)
|
||||
|
||||
# Switches
|
||||
switch-checked-button-color: var(--green)
|
||||
switch-checked-track-color: var(--surface0)
|
||||
switch-unchecked-button-color: rgb(--overlay0)
|
||||
switch-unchecked-track-color: rgb(--surface0)
|
||||
# Toggles
|
||||
paper-toggle-button-checked-button-color: var(--switch-checked-button-color)
|
||||
paper-toggle-button-checked-bar-color: var(--switch-checked-track-color)
|
||||
paper-toggle-button-unchecked-button-color: var(--switch-unchecked-button-color)
|
||||
paper-toggle-button-unchecked-bar-color: var(--switch-unchecked-track-color)
|
||||
|
||||
# Table
|
||||
table-row-background-color: var(--primary-background-color)
|
||||
table-row-alternative-background-color: var(--secondary-background-color)
|
||||
data-table-background-color: var(--primary-background-color)
|
||||
mdc-checkbox-unchecked-color: var(--overlay0)
|
||||
|
||||
# Dropdowns
|
||||
material-background-color: var(--primary-background-color)
|
||||
material-secondary-background-color: var(--primary-background-color)
|
||||
mdc-theme-surface: var(--primary-background-color)
|
||||
|
||||
# Pre/Code
|
||||
markdown-code-background-color: var(--surface0)
|
||||
|
||||
# Checkboxes
|
||||
mdc-select-fill-color: var(--surface0)
|
||||
mdc-select-ink-color: var(--primary-text-color)
|
||||
mdc-select-label-ink-color: var(--subtext1)
|
||||
mdc-select-idle-line-color: var(--primary-text-color)
|
||||
mdc-select-dropdown-icon-color: var(--secondary-text-color)
|
||||
mdc-select-hover-line-color: var(--accent-color)
|
||||
|
||||
# Input
|
||||
input-fill-color: var(--secondary-background-color)
|
||||
input-dropdown-icon-color: var(--secondary-text-color)
|
||||
input-ink-color: var(--primary-text-color)
|
||||
input-label-ink-color: var(--secondary-text-color)
|
||||
input-idle-line-color: var(--primary-text-color)
|
||||
input-hover-line-color: var(--accent-color)
|
||||
|
||||
# Toast
|
||||
paper-toast-background-color: var(--overlay0)
|
||||
|
||||
# Colors
|
||||
error-color: var(--red)
|
||||
warning-color: var(--yellow)
|
||||
success-color: var(--green)
|
||||
info-color: var(--blue)
|
||||
|
||||
state-on-color: var(--green)
|
||||
state-off-color: var(--red)
|
||||
|
||||
####################### MRL dark ######################
|
||||
|
||||
MRL dark:
|
||||
# Colors
|
||||
text: "#c6d0f5"
|
||||
subtext1: "#b5bfe2"
|
||||
subtext0: "#a5adce"
|
||||
|
||||
overlay2: "#949cbb"
|
||||
overlay1: "#838ba7"
|
||||
overlay0: "#737994"
|
||||
|
||||
surface2: "#626880"
|
||||
surface1: "#51576d"
|
||||
surface0: "#414559"
|
||||
|
||||
base: "#303446"
|
||||
mantle: "#292c3c"
|
||||
crust: "#232634"
|
||||
|
||||
rosewater: "#f2d5cf"
|
||||
flamingo: "#eebebe"
|
||||
pink: "#f4b8e4"
|
||||
mauve: "#ca9ee6"
|
||||
red: "#e78284"
|
||||
maroon: "#ea999c"
|
||||
peach: "#ef9f76"
|
||||
yellow: "#e5c890"
|
||||
green: "#a6d189"
|
||||
teal: "#81c8be"
|
||||
sky: "#99d1db"
|
||||
sapphire: "#85c1dc"
|
||||
blue: "#8caaee"
|
||||
lavender: "#babbf1"
|
||||
|
||||
###########################
|
||||
|
||||
# Header
|
||||
app-header-background-color: var(--mantle)
|
||||
app-header-text-color: var(--text)
|
||||
|
||||
# Main Interface colors
|
||||
primary-color: var(--blue)
|
||||
light-primary-color: var(--primary-color)
|
||||
accent-color: var(--yellow)
|
||||
|
||||
primary-background-color: var(--base)
|
||||
secondary-background-color: var(--base)
|
||||
|
||||
# Text
|
||||
primary-text-color: var(--text)
|
||||
secondary-text-color: var(--subtext1)
|
||||
text-primary-color: var(--text)
|
||||
divider-color: var(--base)
|
||||
disabled-text-color: var(--overlay0)
|
||||
text-accent-color: var(--base)
|
||||
|
||||
# Sidebar
|
||||
sidebar-background-color: var(--crust)
|
||||
sidebar-selected-background-color: var(--primary-background-color)
|
||||
|
||||
sidebar-icon-color: var(--subtext0)
|
||||
sidebar-text-color: var(--subtext0)
|
||||
sidebar-selected-icon-color: var(--mauve)
|
||||
sidebar-selected-text-color: var(--mauve)
|
||||
|
||||
# Buttons
|
||||
paper-item-icon-color: var(--subtext0)
|
||||
paper-item-icon-active-color: var(--primary-color)
|
||||
|
||||
# States and Badges
|
||||
state-icon-color: var(--lavender)
|
||||
state-icon-active-color: var(--primary-color)
|
||||
|
||||
state-icon-unavailable-color: var(--disabled-text-color)
|
||||
|
||||
# Sliders
|
||||
paper-slider-knob-color: var(--blue)
|
||||
paper-slider-knob-start-color: var(--paper-slider-knob-color)
|
||||
paper-slider-pin-color: var(--paper-slider-knob-color)
|
||||
paper-slider-active-color: var(--paper-slider-knob-color)
|
||||
paper-slider-secondary-color: var(--blue)
|
||||
|
||||
# Labels
|
||||
label-badge-background-color: var(--surface0)
|
||||
label-badge-text-color: var(--text)
|
||||
label-badge-red: var(--red)
|
||||
label-badge-green: var(--green)
|
||||
label-badge-blue: var(--blue)
|
||||
label-badge-yellow: var(--yellow)
|
||||
label-badge-gray: var(--overlay0)
|
||||
|
||||
# Cards
|
||||
card-background-color: var(--surface0)
|
||||
ha-card-background: var(--card-background-color)
|
||||
|
||||
ha-card-border-radius: "15px"
|
||||
ha-card-box-shadow: none
|
||||
paper-dialog-background-color: var(--overlay0)
|
||||
paper-listbox-background-color: var(--overlay0)
|
||||
paper-card-background-color: var(--card-background-color)
|
||||
|
||||
# Switches
|
||||
switch-checked-button-color: var(--green)
|
||||
switch-checked-track-color: var(--surface2)
|
||||
switch-unchecked-button-color: rgb(--overlay0)
|
||||
switch-unchecked-track-color: rgb(--surface0)
|
||||
|
||||
# Toggles
|
||||
paper-toggle-button-checked-button-color: var(--switch-checked-button-color)
|
||||
paper-toggle-button-checked-bar-color: var(--switch-checked-track-color)
|
||||
paper-toggle-button-unchecked-button-color: var(--switch-unchecked-button-color)
|
||||
paper-toggle-button-unchecked-bar-color: var(--switch-unchecked-track-color)
|
||||
|
||||
# Table
|
||||
table-row-background-color: var(--primary-background-color)
|
||||
table-row-alternative-background-color: var(--secondary-background-color)
|
||||
data-table-background-color: var(--primary-background-color)
|
||||
mdc-checkbox-unchecked-color: var(--overlay0)
|
||||
|
||||
# Dropdowns
|
||||
material-background-color: var(--primary-background-color)
|
||||
material-secondary-background-color: var(--primary-background-color)
|
||||
mdc-theme-surface: var(--primary-background-color)
|
||||
|
||||
# Pre/Code
|
||||
markdown-code-background-color: var(--surface0)
|
||||
|
||||
# Checkboxes
|
||||
mdc-select-fill-color: var(--surface0)
|
||||
mdc-select-ink-color: var(--primary-text-color)
|
||||
mdc-select-label-ink-color: var(--subtext1)
|
||||
mdc-select-idle-line-color: var(--primary-text-color)
|
||||
mdc-select-dropdown-icon-color: var(--secondary-text-color)
|
||||
mdc-select-hover-line-color: var(--accent-color)
|
||||
|
||||
# Input
|
||||
input-fill-color: var(--secondary-background-color)
|
||||
input-dropdown-icon-color: var(--secondary-text-color)
|
||||
input-ink-color: var(--primary-text-color)
|
||||
input-label-ink-color: var(--secondary-text-color)
|
||||
input-idle-line-color: var(--primary-text-color)
|
||||
input-hover-line-color: var(--accent-color)
|
||||
|
||||
# Toast
|
||||
paper-toast-background-color: var(--overlay0)
|
||||
|
||||
# Colors
|
||||
error-color: var(--red)
|
||||
warning-color: var(--yellow)
|
||||
success-color: var(--green)
|
||||
info-color: var(--blue)
|
||||
|
||||
state-on-color: var(--green)
|
||||
state-off-color: var(--red)
|
||||
Loading…
Reference in a new issue