61 changed files with 2523 additions and 642 deletions
@ -1,7 +1,7 @@ |
|||||
module.exports = { |
module.exports = { |
||||
extends: '@meshtastic/eslint-config', |
extends: "@meshtastic/eslint-config", |
||||
parserOptions: { |
parserOptions: { |
||||
tsconfigRootDir: __dirname, |
tsconfigRootDir: __dirname, |
||||
project: ['./tsconfig.json'], |
project: ["./tsconfig.json"] |
||||
}, |
} |
||||
}; |
}; |
||||
|
|||||
File diff suppressed because it is too large
|
After Width: | Height: | Size: 1.0 KiB |
@ -0,0 +1,3 @@ |
|||||
|
export const Blur = (): JSX.Element => { |
||||
|
return <div className="fixed inset-0 backdrop-blur-md" aria-hidden="true" />; |
||||
|
}; |
||||
@ -0,0 +1,18 @@ |
|||||
|
import { useAppStore } from "@app/core/stores/appStore.js"; |
||||
|
import type React from "react"; |
||||
|
|
||||
|
export interface ThemeControllerProps { |
||||
|
children: React.ReactNode; |
||||
|
} |
||||
|
|
||||
|
export const ThemeController = ({ |
||||
|
children |
||||
|
}: ThemeControllerProps): JSX.Element => { |
||||
|
const { darkMode, accent } = useAppStore(); |
||||
|
|
||||
|
return ( |
||||
|
<div data-theme={darkMode ? "dark" : "light"} data-accent={accent}> |
||||
|
{children} |
||||
|
</div> |
||||
|
); |
||||
|
}; |
||||
@ -1,3 +1,87 @@ |
|||||
@tailwind base; |
@tailwind base; |
||||
@tailwind components; |
@tailwind components; |
||||
@tailwind utilities; |
@tailwind utilities; |
||||
|
|
||||
|
:root { |
||||
|
--backgroundPrimary: #f5f5f6; |
||||
|
--backgroundSecondary: #e6e9ed; |
||||
|
--accent: #70afea; |
||||
|
--button: #cfd5dd; |
||||
|
--textPrimary: #111132; |
||||
|
--textSecondary: #64748b; |
||||
|
--link: #0b69bf; |
||||
|
|
||||
|
--brighnessHover: "0.95"; |
||||
|
--brightnessPress: "1.05"; |
||||
|
--brightnessDisabled: "0.75"; |
||||
|
} |
||||
|
|
||||
|
[data-theme="dark"] { |
||||
|
--backgroundPrimary: #2d2d30; |
||||
|
--backgroundSecondary: #363638; |
||||
|
--accent: #2093fe; |
||||
|
--button: #595959; |
||||
|
--textPrimary: #ebebeb; |
||||
|
--textSecondary: #bdbdbd; |
||||
|
--link: #8ec9ff; |
||||
|
|
||||
|
--brighnessHover: 1.1; |
||||
|
--brightnessPress: 0.9; |
||||
|
--brightnessDisabled: 0.75; |
||||
|
} |
||||
|
|
||||
|
[data-accent="red"] { |
||||
|
--accent: #f28585; |
||||
|
} |
||||
|
|
||||
|
[data-accent="red"][data-theme="dark"] { |
||||
|
--accent: #f25555; |
||||
|
} |
||||
|
|
||||
|
[data-accent="orange"] { |
||||
|
--accent: #edb17a; |
||||
|
} |
||||
|
|
||||
|
[data-accent="orange"][data-theme="dark"] { |
||||
|
--accent: #e1720b; |
||||
|
} |
||||
|
|
||||
|
[data-accent="yellow"] { |
||||
|
--accent: #e0cc87; |
||||
|
} |
||||
|
|
||||
|
[data-accent="yellow"][data-theme="dark"] { |
||||
|
--accent: #ac8c1a; |
||||
|
} |
||||
|
|
||||
|
[data-accent="green"] { |
||||
|
--accent: #8bc9c5; |
||||
|
} |
||||
|
|
||||
|
[data-accent="green"][data-theme="dark"] { |
||||
|
--accent: #27a341; |
||||
|
} |
||||
|
|
||||
|
[data-accent="blue"] { |
||||
|
--accent: #70afea; |
||||
|
} |
||||
|
|
||||
|
[data-accent="blue"][data-theme="dark"] { |
||||
|
--accent: #2093fe; |
||||
|
} |
||||
|
|
||||
|
[data-accent="purple"] { |
||||
|
--accent: #a09eef; |
||||
|
} |
||||
|
|
||||
|
[data-accent="purple"][data-theme="dark"] { |
||||
|
--accent: #926bff; |
||||
|
} |
||||
|
|
||||
|
[data-accent="pink"] { |
||||
|
--accent: #dba0c7; |
||||
|
} |
||||
|
|
||||
|
[data-accent="pink"][data-theme="dark"] { |
||||
|
--accent: #e454c4; |
||||
|
} |
||||
Loading…
Reference in new issue