From 09a2001a00dd7da068ecc06a5792d9b153975923 Mon Sep 17 00:00:00 2001 From: Paul Bottein Date: Wed, 31 Jan 2024 10:20:31 +0100 Subject: [PATCH] Use tile style as default style for mushroom card --- src/shared/state-info.ts | 6 ++++-- src/utils/colors.ts | 8 +++++--- src/utils/theme.ts | 16 ++++++++++------ 3 files changed, 19 insertions(+), 11 deletions(-) diff --git a/src/shared/state-info.ts b/src/shared/state-info.ts index a5b71deb3..330fc8ac4 100644 --- a/src/shared/state-info.ts +++ b/src/shared/state-info.ts @@ -35,7 +35,8 @@ export class StateItem extends LitElement { font-weight: var(--card-primary-font-weight); font-size: var(--card-primary-font-size); line-height: var(--card-primary-line-height); - color: var(--primary-text-color); + color: var(--card-primary-color); + letter-spacing: var(--card-primary-letter-spacing); text-overflow: ellipsis; overflow: hidden; white-space: nowrap; @@ -44,7 +45,8 @@ export class StateItem extends LitElement { font-weight: var(--card-secondary-font-weight); font-size: var(--card-secondary-font-size); line-height: var(--card-secondary-line-height); - color: var(--secondary-text-color); + color: var(--card-secondary-color); + letter-spacing: var(--card-secondary-letter-spacing); text-overflow: ellipsis; overflow: hidden; white-space: nowrap; diff --git a/src/utils/colors.ts b/src/utils/colors.ts index 2eca8bb40..a96fd79fc 100644 --- a/src/utils/colors.ts +++ b/src/utils/colors.ts @@ -58,8 +58,8 @@ function capitalizeFirstLetter(string) { export const defaultColorCss = css` --default-red: 244, 67, 54; --default-pink: 233, 30, 99; - --default-purple: 156, 39, 176; - --default-deep-purple: 103, 58, 183; + --default-purple: 106, 107, 201; + --default-deep-purple: 111, 66, 193; --default-indigo: 63, 81, 181; --default-blue: 33, 150, 243; --default-light-blue: 3, 169, 244; @@ -71,9 +71,11 @@ export const defaultColorCss = css` --default-yellow: 255, 235, 59; --default-amber: 255, 193, 7; --default-orange: 255, 152, 0; - --default-deep-orange: 255, 87, 34; + --default-deep-orange: 255, 111, 0; --default-brown: 121, 85, 72; + --default-light-grey: 189, 189, 189; --default-grey: 158, 158, 158; + --default-dark-grey: 96, 96, 96; --default-blue-grey: 96, 125, 139; --default-black: 0, 0, 0; --default-white: 255, 255, 255; diff --git a/src/utils/theme.ts b/src/utils/theme.ts index 37fdf0974..7347e2d3d 100644 --- a/src/utils/theme.ts +++ b/src/utils/theme.ts @@ -16,10 +16,14 @@ export const themeVariables = css` /* Card */ --card-primary-font-size: var(--mush-card-primary-font-size, 14px); --card-secondary-font-size: var(--mush-card-secondary-font-size, 12px); - --card-primary-font-weight: var(--mush-card-primary-font-weight, bold); - --card-secondary-font-weight: var(--mush-card-secondary-font-weight, bolder); - --card-primary-line-height: var(--mush-card-primary-line-height, 1.5); - --card-secondary-line-height: var(--mush-card-secondary-line-height, 1.5); + --card-primary-font-weight: var(--mush-card-primary-font-weight, 500); + --card-secondary-font-weight: var(--mush-card-secondary-font-weight, 400); + --card-primary-line-height: var(--mush-card-primary-line-height, 20px); + --card-secondary-line-height: var(--mush-card-secondary-line-height, 16px); + --card-primary-color: var(--mush-card-primary-color, var(--primary-text-color)); + --card-secondary-color: var(--mush-card-secondary-color, var(--primary-text-color)); + --card-primary-letter-spacing: var(--mush-card-secondary-color, 0.1px); + --card-secondary-letter-spacing: var(--mush-card-secondary-color, 0.4px); /* Chips */ --chip-spacing: var(--mush-chip-spacing, 8px); @@ -63,8 +67,8 @@ export const themeVariables = css` /* Icon */ --icon-border-radius: var(--mush-icon-border-radius, 50%); - --icon-size: var(--mush-icon-size, 42px); - --icon-symbol-size: var(--mush-icon-symbol-size, 0.5em); + --icon-size: var(--mush-icon-size, 40px); + --icon-symbol-size: var(--mush-icon-symbol-size, 0.6em); `; export const themeColorCss = css`