Skip to content

williamahartman/noctis-solarized

 
 

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

38 Commits
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

Noctis-Solarized

The Noctis theme for Home Assistant, adapted to use the Solarized Dark color scheme.

Screenshot

Installation

Manual Installation

  1. copy the themes folder into your home-assistant folder
  2. add this to your configuration.yaml
frontend:
  themes: !include_dir_merge_named themes
  1. restart home-assistant
  2. select the theme in your user's profile (bottom left)

HACS

  1. Go to the Community Store.
  2. Search for Noctis-Solarized.
  3. Navigate to Noctis-Solarized.
  4. Press Install.

Fonts

If you want to use the custom fonts:

  • Make sure "Advanced Mode" is enabled in your user settings
  • Go to "Settings" -> "Lovelace Dashboards" -> "Resources"
  • Add a new resource with type "Stylesheet" and this URL: https://fonts.googleapis.com/css?family=Raleway

Blur

If you want the blur effect on your popup cards you need to have card-mod installed and uncomment the following lines in noctis-solarized.yaml

card-mod-theme: noctis-solarized

  card-mod-more-info-yaml: |
    $: |
      .mdc-dialog .mdc-dialog__scrim {
        backdrop-filter: blur(15px);
        -webkit-backdrop-filter: blur(15px);
        background: rgba(0,0,0,.6);
      }
      .mdc-dialog .mdc-dialog__container .mdc-dialog__surface {
        box-shadow: none !important;
        border-radius: var(--ha-card-border-radius);
      }
    .: |
      :host {
        --ha-card-box-shadow: none;
      }

(Don't know if necessary anymore) Additionally if you are using Firefox you need to go into about:config and set both gfx.webrender.all and layout.css.backdrop-filter.enabled to true. You may need to restart Firefox fo it to take effect.

Packages

No packages published

Languages

  • JavaScript 100.0%