From 792de69d9e3bcd81c96de7e7254e0bc5e23b1ade Mon Sep 17 00:00:00 2001 From: NdR91 Date: Tue, 1 Jun 2021 12:24:44 +0200 Subject: [PATCH] File spostato --- themes/floorplan/floorplan.yaml | 379 ++++++++++++++++++++++++++++++++ 1 file changed, 379 insertions(+) create mode 100755 themes/floorplan/floorplan.yaml diff --git a/themes/floorplan/floorplan.yaml b/themes/floorplan/floorplan.yaml new file mode 100755 index 0000000..3b89d6c --- /dev/null +++ b/themes/floorplan/floorplan.yaml @@ -0,0 +1,379 @@ + tablet: + # Main colors + primary-color: '#434b4d' + accent-color: '#b4b6b630' + dark-primary-color: '#e0e1e1' + light-primary-color: '#262b2c' + # Text colors + primary-text-color: '#e0e1e1' + text-primary-color: 'var(--primary-text-color)' + secondary-text-color: 'rgba(224, 225, 225, 0.3)' + disabled-text-color: '#777777' + label-badge-border-color: 'green' + # Sidebar + sidebar-icon-color: '#9e9e9e' + # Background colors + primary-background-color: '#222627' + secondary-background-color: '#434b4d' + divider-color: 'rgba(0, 0, 0, .12)' + table-row-background-color: '#292929' + table-row-alternative-background-color: '#292929' + # Nav Menu + paper-listbox-color: '#777777' + paper-listbox-background-color: '#222627' + paper-grey-50: 'var(--primary-text-color)' + paper-grey-200: '#222222' + # Paper card + paper-card-header-color: '#252b2d' + paper-card-background-color: '#222627' + paper-dialog-background-color: '#2d3538' + paper-item-icon-color: '#9da0a2' + paper-item-icon-active-color: '#3182b7' + paper-item-icon_-_color: 'green' + paper-item-selected_-_background-color: '#ff0000' + paper-tabs-selection-bar-color: 'green' + # Labels + label-badge-red: 'var(--primary-color)' + label-badge-text-color: 'var(--primary-text-color)' + label-badge-background-color: '#222222' + # Switches update + switch-checked-color: '#7a7d7f' + switch-unchecked-button-color: '#3b4041' + switch-unchecked-track-color: '#0c0d0d' + # paper-toggle-button-checked-bar-color: '#009FFF' + # Sliders + paper-slider-knob-color: '#a4abb1' + paper-slider-knob-start-color: '#a4abb1' + paper-slider-pin-color: '#626a6f' + paper-slider-active-color: '#626a6f' + paper-slider-container-color: '#202020' + paper-slider-secondary-color: 'var(--secondary-background-color)' + paper-slider-disabled-active-color: 'var(--disabled-text-color)' + paper-slider-disabled-secondary-color: 'var(--disabled-text-color)' + #paper-slider-height: '3px' + # Google colors + google-red-500: '#bf3838' + google-green-500: '#5b8d47' + # Changes to fix history/logbook menus + lumo-primary-text-color: '#2980b9' + lumo-secondary-text-color: '#2980b9' + lumo-primary-color: '#2980b9' + # Calendar day numbers + lumo-body-text-color: '#e0e1e1' + # Calendar/Date-Picker Background + lumo-base-color: '#222222' + # Month/Year header + lumo-header-text-color: 'var(--lumo-body-text-color)' + # DayOfWeek Header + lumo-tertiary-text-color: 'var(--lumo-body-text-color)' + lumo-shade: '#222222' + lumo-shade-90pct: 'rgba(34, 34, 34, .9)' + lumo-shade-80pct: 'rgba(34, 34, 34, .8)' + lumo-shade-70pct: 'rgba(34, 34, 34, .7)' + lumo-shade-60pct: 'rgba(34, 34, 34, .6)' + lumo-shade-50pct: 'rgba(34, 34, 34, .5)' + lumo-shade-40pct: 'rgba(34, 34, 34, .4)' + lumo-shade-30pct: 'rgba(34, 34, 34, .3)' + lumo-shade-20pct: 'rgba(34, 34, 34, .2)' + lumo-shade-10pct: 'rgba(34, 34, 34, .1)' + lumo-shade-5pct: 'rgba(34, 34, 34, .05)' + lumo-tint-5pct: '#222222' + # fix for device configuration screen + card-background-color: 'var(--paper-card-background-color)' + # mini-media-player + mini-media-player-base-color: '#d7d7d6' + mini-media-player-accent-color: '#d7d7d6' + mini-media-player-icon-color: '#9e9e9e' + mini-media-player-overlay-color: 'rgba(0,0,0,0)' + mini-media-player-overlay-color-stop: '100%' + mini-media-player-overlay-base-color: '#d7d7d6' + mini-media-player-overlay-accent-color: '#d7d7d6' + mini-media-player-media-cover-info-color: '#d7d7d6' + mini-media-player-background-opacity: '0' + mini-media-player-artwork-opacity: '1' + mini-media-player-progress-height: '5px' + mini-media-player-scale: '1.14' + # popup-backdrop-filter + iron-overlay-backdrop-filter: 'blur(15px)' + iron-overlay-backdrop-background-color: 'rgba(0,0,0,.6)' + iron-overlay-backdrop-opacity: '1' + # barcard + bar-card-border-radius: '0.3em' + + #################################################### + # # + # CARD MOD # + # # + #################################################### + + card-mod-theme: tablet + card-color: rgba(34,38,39,0.9) + card-header: rgba(48,52,52,0.8) + + card-mod-root: | + ha-app-layout { + background: url('/local/background.png') !important; + background-size: cover !important; + } + app-header { + display: none; + } + card-mod-card-yaml: | + "#root>hui-image": + $: | + #image { + pointer-events: none; + } + + "#root>hui-markdown-card,#key1": + $: | + ha-card>ha-markdown { + padding: 0 !important; + } + + "#root>hui-markdown-card,#key2": + $: + "ha-card>ha-markdown": + $: | + ha-markdown-element>font>ha-icon { + vertical-align: 3%; + opacity: 0.6; + } + + ha-markdown-element>p>span { + font-family: SF Text; + font-size: 5vw; + font-weight: 200; + margin-left: -0.3vw; + letter-spacing: -0.05vw; + } + + "#root>hui-state-label-element": + $: | + div { + padding: 0 !important; + } + + .: | + #root>hui-icon-element { + opacity: 0.1 !important; + transition: 0.4s; + } + + #root>hui-icon-element:hover { + opacity: 0.25 !important; + transition: none; + } + + #root>hui-icon-element:active { + opacity: 0.35 !important; + transition: none; + } + + #root>hui-icon-element:nth-child(10) { + {% if states('sensor.hass_version_installed') | regex_search('b') %} + {% if states('sensor.hass_version_installed') != states('sensor.hass_version_latest_beta') and + not is_state('sensor.hass_version_latest', 'unknown') or + not is_state('sensor.hacs', '0') and + not is_state('sensor.hacs', 'unknown') %} + color: rgb(35,78,106) !important; opacity: 1 !important; + {% endif %} + {% else %} + {% if states('sensor.hass_version_installed') != states('sensor.hass_version_latest') and + not is_state('sensor.hass_version_latest', 'unknown') or + not is_state('sensor.hacs', '0') and + not is_state('sensor.hacs', 'unknown') %} + color: rgb(35,78,106) !important; opacity: 1 !important; + {% endif %} + {% endif %} + } + + ha-card { + background: none; + box-shadow: none; + border-radius: 0; + } + + .card-header { + margin: -0.5em 0 1.1em 0.4em; + font-family: SF Text; + letter-spacing: 0.005em; + font-size: 1.5em; + } + + /* * * * * * * * * * * * * * * * * * + * * + * TYPES * + * * + * * * * * * * * * * * * * * * * * */ + + ha-card.type-entities { + background: none; + padding: 0.3em 1.25em 0.4em 0.5em; + } + + ha-card.type-custom-stack-in-card { + background: none; + } + + ha-card.type-history-graph { + margin: 0.8em -1.9em -1.5em -0.8em; + } + + ha-card.type-custom-hui-markdown-card { + font-family: SF Display; + line-height: 2.05vw; + letter-spacing: 0.06vw; + color: rgba(255, 255, 255, 0.9); + pointer-events: none; + } + + /* * * * * * * * * * * * * * * * * * + * * + * CLASSES * + * * + * * * * * * * * * * * * * * * * * */ + + ha-card.add_header { + background: linear-gradient(180deg, + var(--card-header) 0%, + var(--card-header) 4.6em, + var(--card-color) 4.6em, + var(--card-color) 100%); + border-radius: 1em; + } + + .map { + height: 24.9em; + border-top: 1px solid #FFFFFF !important; + filter: invert(1) contrast(80%) hue-rotate(250deg); + } + + .sidebar { + font-size: 1.5vw; + font-weight: 300; + opacity: 0.75; + width: 15.5vw; + height: 1px; + } + + .krisinformation { + background: #5a1f1f !important; + font-family: SF Display; + font-size: 1.3vw; + font-weight: 300; + letter-spacing: 0.06vw; + line-height: 1.7vw; + hyphens: auto; + border-radius: 0.7vw !important; + filter: drop-shadow(0 0 1vw #1e1e1e); + } + + .coronavirus { + font-size: 1.26vw; + color: #6a7377; + font-weight: 400; + opacity: 0.5; + width: 90vw; + height: 1px; + letter-spacing: 0.065vw; + --mdc-icon-size: 1.2vw; + } + + ha-card.information_network { + background: none; + margin-top: -0.7em; + z-index: 2; + padding: 1.4px; + width: 15em; + } + + /* * * * * * * * * * * * * * * * * * + * * + * BAR CARD * + * * + * * * * * * * * * * * * * * * * * */ + + .type-custom-bar-card bar-card-name { + padding-left: 0.25em; + } + + .type-custom-bar-card bar-card-iconbar { + padding-left: 0.23em; + } + + .type-custom-bar-card bar-card-value { + margin-right: auto; + color: #e0e1e1; + text-shadow: none; + font-size: 1em; + font-weight: 400; + letter-spacing: 0.01em; + } + + .type-custom-bar-card bar-card-backgroundbar { + background: none; + } + + .type-custom-bar-card bar-card-background { + background: radial-gradient(circle, rgba(52, 57, 58, 0.1) 0%, rgba(17,18,18,0.2) 75%); + box-shadow: inset 0 0 25px #00000045; + border-radius: 0.3em; + } + + /* * * * * * * * * * * * * * * * * * + * * + * CALENDAR CARD * + * * + * * * * * * * * * * * * * * * * * */ + + .type-custom-calendar-card { + margin: -1.5em 1.3em 0.55em 1.2em; + height: 20em; + } + + .type-custom-calendar-card>div { + margin-bottom: 0.4em; + } + + .type-custom-calendar-card>table>tbody>tr>td>div { + opacity: 0.5; + } + + .type-custom-calendar-card>table>tbody>tr>td { + cursor: default !important; + } + + .type-custom-calendar-card>table>tbody>tr>td.overview.no-pointer>div { + opacity: 1; + } + + # card-mod-glance: | + # :host { + # --paper-item-icon-color: {{ '#3182b7' if is_state(config.entity, 'home') else '#FFFFFF20' }}; + # } + + card-mod-more-info-yaml: | + .: | + app-toolbar { + background: var(--card-header) !important; + } + mwc-icon-button { + margin-top: -3px; + color: #9e9e9e; + } + .main-title { + margin-top: 5px; + font-family: SF Text; + letter-spacing: 0.005em; + } + + $: | + .mdc-dialog { + backdrop-filter: blur(20px) brightness(70%); + } + .mdc-dialog .mdc-dialog__container .mdc-dialog__surface { + background: var(--card-color); + box-shadow: none; + border-radius: 1em; + }