|
| 1 | +--- |
| 2 | +minimalist-ios-tapbar: |
| 3 | + # version 1.0.0 |
| 4 | + # By LRvdLinden |
| 5 | + # Journal |
| 6 | + state-icon-color: "rgb(var(--color-theme))" |
| 7 | + border-radius: "20px" |
| 8 | + error-color: "var(--google-red)" |
| 9 | + warning-color: "var(--google-yellow)" |
| 10 | + success-color: "var(--google-green)" |
| 11 | + info-color: "var(--google-blue)" |
| 12 | + divider-color: "rgba(var(--color-theme),.12)" |
| 13 | + accent-color: "var(--google-yellow)" |
| 14 | + card-mod-theme: "minimalist-ios-tapbar" |
| 15 | + header-height: "97px" |
| 16 | + |
| 17 | + card-mod-view-yaml: | |
| 18 | + "*:first-child$": | |
| 19 | + #columns .column > * { |
| 20 | + padding-left: 5px; |
| 21 | + padding-right: 5px; |
| 22 | + padding-bottom: 5px; |
| 23 | + } |
| 24 | +
|
| 25 | + # Move navbar |
| 26 | + card-mod-root-yaml: | |
| 27 | + ha-tabs$: | |
| 28 | + #tabsContent { |
| 29 | + width: 97%; |
| 30 | + } |
| 31 | + .: | |
| 32 | + @media (orientation: portrait) { |
| 33 | + a.menu-link[target="_blank"], ha-button-menu, ha-menu-button, [main-title] { |
| 34 | + display: none !important; |
| 35 | + } |
| 36 | + app-toolbar { |
| 37 | + padding-right: 0px; |
| 38 | + padding-left: 0px; |
| 39 | + } |
| 40 | + } |
| 41 | + ha-app-layout{ |
| 42 | + transform: initial; |
| 43 | + padding: 0 !important; |
| 44 | + margin: 0 !important; |
| 45 | + width: 100%; |
| 46 | + height: 100% !important; |
| 47 | + } |
| 48 | + app-header { |
| 49 | + top: auto; |
| 50 | + bottom: 0; |
| 51 | + box-shadow: var(--footer-shadow); |
| 52 | + position: fixed; |
| 53 | + height: var(--header-height) !important; |
| 54 | + } |
| 55 | + app-toolbar { |
| 56 | + height: 115px !important; |
| 57 | + padding-bottom: env(safe-area-inset-bottom) !important; |
| 58 | + } |
| 59 | + #view { |
| 60 | + margin-top: calc(-1 * var(--header-height)) !important; |
| 61 | + padding-bottom: var(--header-height) !important; |
| 62 | + } |
| 63 | + ha-tabs { |
| 64 | + --paper-tabs-selection-bar-color: var(--header-tab-indicator-color) !important; |
| 65 | + --mdc-icon-size: 26px; |
| 66 | + display: flex; |
| 67 | + justify-content: space-between; |
| 68 | + padding: 0 10px; |
| 69 | + height:50px !important; |
| 70 | + } |
| 71 | + paper-tab[aria-selected=true] { |
| 72 | + color: var(--header-active-tab-color); |
| 73 | + background-color: var(--header-active-tab-bg-color); |
| 74 | + } |
| 75 | + paper-tab { |
| 76 | + color: var(--header-all-tabs-color); |
| 77 | + border-radius: 25px; |
| 78 | + height:50px; |
| 79 | + /*width: calc(100% / 4); |
| 80 | + padding: 0;*/ |
| 81 | + padding-left: 20px; |
| 82 | + padding-right: 20px; |
| 83 | + } |
| 84 | +
|
| 85 | + # Color themes |
| 86 | + modes: |
| 87 | + light: |
| 88 | + # main interface colors |
| 89 | + primary-color: "#434343" |
| 90 | + google-red: "#F54436" |
| 91 | + google-green: "#01C852" |
| 92 | + google-yellow: "#FF9101" |
| 93 | + google-blue: "#3D5AFE" |
| 94 | + google-violet: "#661FFF" |
| 95 | + google-grey: "#BBBBBB" |
| 96 | + color-red: "245, 68, 54" |
| 97 | + color-green: "1, 200, 82" |
| 98 | + color-yellow: "255, 145, 1" |
| 99 | + color-blue: "61, 90, 254" |
| 100 | + color-purple: "102, 31, 255" |
| 101 | + color-grey: "187, 187, 187" |
| 102 | + color-pink: "233, 30, 99" |
| 103 | + color-theme: "51,51,51" |
| 104 | + color-background-yellow: "250, 250, 250" |
| 105 | + color-background-blue: "250, 250, 250" |
| 106 | + color-background-green: "250, 250, 250" |
| 107 | + color-background-red: "250, 250, 250" |
| 108 | + color-background-pink: "250, 250, 250" |
| 109 | + color-background-purple: "250, 250, 250" |
| 110 | + color-yellow-text: "var(--primary-text-color)" |
| 111 | + color-blue-text: "var(--primary-text-color)" |
| 112 | + color-green-text: "var(--primary-text-color)" |
| 113 | + color-red-text: "var(--primary-text-color)" |
| 114 | + color-pink-text: "var(--primary-text-color)" |
| 115 | + color-purple-text: "var(--primary-text-color)" |
| 116 | + opacity-bg: "1" |
| 117 | + # Header / Footer |
| 118 | + header-active-tab-color: "rgb(var(--color-blue))" |
| 119 | + header-active-tab-bg-color: "rgba(var(--color-blue), .3)" |
| 120 | + header-all-tabs-color: "var(--paper-item-icon-color)" |
| 121 | + header-tab-indicator-color: "rgba(0, 0, 0, 0)" |
| 122 | + app-header-text-color: "var(--primary-text-color)" |
| 123 | + app-header-background-color: "var( --ha-card-background, var(--card-background-color, white) )" |
| 124 | + paper-tabs-selection-bar-color: "var(--primary-text-color)" |
| 125 | + footer-shadow: "0px -1px 3px 0px rgba(0,0,0,0.12)" |
| 126 | + # background and sidebar |
| 127 | + card-background-color: "#FAFAFA" |
| 128 | + primary-background-color: "#EFEFEF" |
| 129 | + secondary-background-color: "#EFEFEF" |
| 130 | + # text |
| 131 | + primary-text-color: "#212121" |
| 132 | + # slider |
| 133 | + slider-color: "rgb(var(--google-blue))" |
| 134 | + slider-bar-color: "rgba(var(--google-blue),0.38)" |
| 135 | + # cards |
| 136 | + box-shadow: "0px 2px 4px 0px rgba(0,0,0,0.16)" |
| 137 | + ha-card-box-shadow: "var(--box-shadow)" |
| 138 | + # sidebar |
| 139 | + sidebar-selected-text-color: "rgb(var(--color-blue))" |
| 140 | + sidebar-selected-icon-color: "rgb(var(--color-blue))" |
| 141 | + sidebar-text-color: "#80868b" |
| 142 | + # switch |
| 143 | + switch-checked-color: "rgb(var(--color-blue))" |
| 144 | + # media player |
| 145 | + mini-media-player-accent-color: "rgb(var(--color-blue))" |
| 146 | + dark: |
| 147 | + # main interface colors |
| 148 | + primary-color: "#89B3F8" |
| 149 | + google-red: "#F18B82" |
| 150 | + google-green: "#80C994" |
| 151 | + google-yellow: "#FCD663" |
| 152 | + google-blue: "#89B3F8" |
| 153 | + google-violet: "#BB86FC" |
| 154 | + google-grey: "#BBBBBB" |
| 155 | + color-red: "241, 139, 130" |
| 156 | + color-green: "128, 201, 148" |
| 157 | + color-yellow: "252, 214, 99" |
| 158 | + color-blue: "137, 179, 248" |
| 159 | + color-theme: "221,221,221" |
| 160 | + color-purple: "102, 31, 255" |
| 161 | + color-grey: "187, 187, 187" |
| 162 | + color-pink: "233, 30, 99" |
| 163 | + color-amber: "255, 145, 1" |
| 164 | + color-background-yellow: "var(--color-yellow)" |
| 165 | + color-background-blue: "var(--color-blue)" |
| 166 | + color-background-green: "var(--color-green)" |
| 167 | + color-background-red: "var(--color-red)" |
| 168 | + color-background-pink: "var(--color-pink)" |
| 169 | + color-background-purple: "var(--color-purple)" |
| 170 | + color-yellow-text: "var(--color-yellow)" |
| 171 | + color-blue-text: "var(--color-blue)" |
| 172 | + color-green-text: "var(--color-green)" |
| 173 | + color-red-text: "var(--color-red)" |
| 174 | + color-pink-text: "var(--color-pink)" |
| 175 | + color-purple-text: "var(--color-purple)" |
| 176 | + opacity-bg: "0.1" |
| 177 | + # Header / Footer |
| 178 | + header-active-tab-color: "rgb(var(--color-amber))" |
| 179 | + header-active-tab-bg-color: "rgba(var(--color-amber), .3)" |
| 180 | + header-all-tabs-color: "var(--paper-item-icon-color)" |
| 181 | + header-tab-indicator-color: "rgba(0, 0, 0, 0)" |
| 182 | + app-header-text-color: "var(--primary-text-color)" |
| 183 | + app-header-background-color: "var( --ha-card-background, var(--card-background-color, rgb(29, 29, 29)) )" |
| 184 | + paper-tabs-selection-bar-color: "var(--primary-text-color)" |
| 185 | + footer-shadow: "0px -1px 3px 0px rgba(0,0,0,0.12)" |
| 186 | + # background and sidebar |
| 187 | + card-background-color: "#1D1D1D" |
| 188 | + primary-background-color: "#121212" |
| 189 | + secondary-background-color: "#121212" |
| 190 | + # text |
| 191 | + primary-text-color: "#DDDDDD" |
| 192 | + # floating button text color |
| 193 | + mdc-theme-on-secondary: "var(--card-background-color)" |
| 194 | + # Sidebar |
| 195 | + sidebar-selected-text-color: "rgb(var(--color-amber))" |
| 196 | + sidebar-selected-icon-color: "rgb(var(--color-amber))" |
| 197 | + # Slider |
| 198 | + slider-color: "rgb(var(--color-blue))" |
| 199 | + slider-bar-color: "rgba(var(--color-blue),0.38)" |
| 200 | + # card |
| 201 | + box-shadow: "none" |
| 202 | + # media player |
| 203 | + mini-media-player-accent-color: "var(--google-blue)" |
| 204 | + # Journal |
| 205 | + state-icon-color: "rgb(var(--color-theme))" |
0 commit comments