diff --git a/src/AdvancedCalculator.Browser/wwwroot/app.css b/src/AdvancedCalculator.Browser/wwwroot/app.css index 1d6f754..8b2a7e7 100644 --- a/src/AdvancedCalculator.Browser/wwwroot/app.css +++ b/src/AdvancedCalculator.Browser/wwwroot/app.css @@ -3,7 +3,7 @@ position: absolute; height: 100%; width: 100%; - background: white; + background: white; /* light fallback */ font-family: 'Outfit', sans-serif; justify-content: center; align-items: center; @@ -13,31 +13,15 @@ /* Light theme styles */ @media (prefers-color-scheme: light) { - .avalonia-splash { - background: white; - } - - .avalonia-splash h2 { - color: #1b2a4e; - } - - .avalonia-splash a { - color: #0D6EFD; - } + .avalonia-splash { background: #FFFFFF; } + .avalonia-splash h2 { color: #223544; } /* --c-primary-2 */ + .avalonia-splash a { color: #5AC3D6; } /* --c-primary-1 */ } @media (prefers-color-scheme: dark) { - .avalonia-splash { - background: #1b2a4e; - } - - .avalonia-splash h2 { - color: white; - } - - .avalonia-splash a { - color: white; - } + .avalonia-splash { background: #223544; } /* --c-primary-2 */ + .avalonia-splash h2 { color: #FFFFFF; } + .avalonia-splash a { color: #5AC3D6; } /* --c-primary-1 */ } .avalonia-splash h2 { diff --git a/src/AdvancedCalculator/App.axaml b/src/AdvancedCalculator/App.axaml index e00805e..965ceb1 100644 --- a/src/AdvancedCalculator/App.axaml +++ b/src/AdvancedCalculator/App.axaml @@ -6,6 +6,7 @@ + diff --git a/src/AdvancedCalculator/Styles/Colors.axaml b/src/AdvancedCalculator/Styles/Colors.axaml new file mode 100644 index 0000000..d1b561f --- /dev/null +++ b/src/AdvancedCalculator/Styles/Colors.axaml @@ -0,0 +1,89 @@ + + + + #FF5AC3D6 + #FF223544 + #FF4E6D84 + #FFF5A623 + #FFD94E87 + #FF49C46D + + + + + + + + + + + #F0F4F7 + + #FF0F1A21 + #FFFFFFFF + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +