fix: settings sidebar text color on mobile and blue theme bar
- Use var(--weekly-bg) and var(--weekly-text) for sidebar background and text color so it matches the calendar in both light/dark mode - Add explicit label color rules for settings sidebar - Change manifest theme_color from blue (#0ea5e9) to white - Add responsive themeColor meta tags for light/dark preference v1.37.1
This commit is contained in:
parent
f9c7893341
commit
c28fa71e4d
@ -1,6 +1,6 @@
|
|||||||
{
|
{
|
||||||
"name": "my-weekly-todo-list",
|
"name": "my-weekly-todo-list",
|
||||||
"version": "1.37.0",
|
"version": "1.37.1",
|
||||||
"description": "A web-based weekly task management application that organizes to-dos and calendar events in a single, intuitive weekly view",
|
"description": "A web-based weekly task management application that organizes to-dos and calendar events in a single, intuitive weekly view",
|
||||||
"main": "index.js",
|
"main": "index.js",
|
||||||
"scripts": {
|
"scripts": {
|
||||||
|
|||||||
@ -3325,7 +3325,8 @@ h3 {
|
|||||||
width: 480px;
|
width: 480px;
|
||||||
max-width: 90vw;
|
max-width: 90vw;
|
||||||
height: 100vh;
|
height: 100vh;
|
||||||
background: white;
|
background: var(--weekly-bg, white);
|
||||||
|
color: var(--weekly-text, #000000);
|
||||||
box-shadow: -10px 0 30px rgba(0, 0, 0, 0.1);
|
box-shadow: -10px 0 30px rgba(0, 0, 0, 0.1);
|
||||||
display: flex;
|
display: flex;
|
||||||
flex-direction: column;
|
flex-direction: column;
|
||||||
@ -3341,9 +3342,9 @@ h3 {
|
|||||||
}
|
}
|
||||||
|
|
||||||
.dark-mode .weekly-settings-sidebar {
|
.dark-mode .weekly-settings-sidebar {
|
||||||
background: #111;
|
background: var(--weekly-bg, #111);
|
||||||
border-left: 1px solid #333;
|
border-left: 1px solid #333;
|
||||||
color: white;
|
color: var(--weekly-text, #f0f0f0);
|
||||||
}
|
}
|
||||||
|
|
||||||
.weekly-settings-sidebar .weekly-settings-header {
|
.weekly-settings-sidebar .weekly-settings-header {
|
||||||
@ -3516,6 +3517,14 @@ h3 {
|
|||||||
margin-bottom: 12px;
|
margin-bottom: 12px;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
/* Ensure settings sidebar labels are readable */
|
||||||
|
.weekly-settings-sidebar label {
|
||||||
|
color: var(--weekly-text, #000000);
|
||||||
|
}
|
||||||
|
.dark-mode .weekly-settings-sidebar label {
|
||||||
|
color: var(--weekly-text, #f0f0f0);
|
||||||
|
}
|
||||||
|
|
||||||
/* Form Elements in Settings */
|
/* Form Elements in Settings */
|
||||||
.weekly-input,
|
.weekly-input,
|
||||||
.weekly-settings-sidebar select,
|
.weekly-settings-sidebar select,
|
||||||
|
|||||||
@ -15,6 +15,10 @@ export const viewport: Viewport = {
|
|||||||
export const metadata: Metadata = {
|
export const metadata: Metadata = {
|
||||||
title: 'My Weekly To Do List',
|
title: 'My Weekly To Do List',
|
||||||
description: 'A simple, designy to-do app.',
|
description: 'A simple, designy to-do app.',
|
||||||
|
themeColor: [
|
||||||
|
{ media: '(prefers-color-scheme: light)', color: '#ffffff' },
|
||||||
|
{ media: '(prefers-color-scheme: dark)', color: '#111111' },
|
||||||
|
],
|
||||||
appleWebApp: {
|
appleWebApp: {
|
||||||
capable: true,
|
capable: true,
|
||||||
statusBarStyle: 'default',
|
statusBarStyle: 'default',
|
||||||
|
|||||||
@ -8,7 +8,7 @@ export default function manifest(): MetadataRoute.Manifest {
|
|||||||
start_url: '/tasks',
|
start_url: '/tasks',
|
||||||
display: 'standalone',
|
display: 'standalone',
|
||||||
background_color: '#ffffff',
|
background_color: '#ffffff',
|
||||||
theme_color: '#0ea5e9',
|
theme_color: '#ffffff',
|
||||||
icons: [
|
icons: [
|
||||||
{ src: '/icons/icon-192.png', sizes: '192x192', type: 'image/png' },
|
{ src: '/icons/icon-192.png', sizes: '192x192', type: 'image/png' },
|
||||||
{ src: '/icons/icon-512.png', sizes: '512x512', type: 'image/png' },
|
{ src: '/icons/icon-512.png', sizes: '512x512', type: 'image/png' },
|
||||||
|
|||||||
Loading…
Reference in New Issue
Block a user