177 lines
5.0 KiB
CSS
177 lines
5.0 KiB
CSS
:root {
|
|
--primary: #667eea;
|
|
--secondary: #7257b3;
|
|
--accent: #cbd5e1;
|
|
--header-bg: linear-gradient(135deg, var(--primary) 0%, var(--secondary) 100%);
|
|
--button-bg: #fff;
|
|
--button-active-bg: var(--secondary);
|
|
--button-hover-bg: #e6eaff;
|
|
--button-text: var(--primary);
|
|
--button-active-text: #fff;
|
|
--app-version: var(--accent);
|
|
|
|
/* Add these: */
|
|
--btn-primary: #667eea;
|
|
--btn-primary-hover: #5a67d8;
|
|
--btn-secondary: #f3f3f3;
|
|
--btn-secondary-hover: #e2e8f0;
|
|
--btn-secondary-text: #666;
|
|
--btn-danger: #ef4444;
|
|
--btn-danger-hover: #dc2626;
|
|
--btn-green: #22c55e;
|
|
--btn-green-hover: #16a34a;
|
|
|
|
--error: #e53e3e;
|
|
--error-bg: rgba(255, 107, 107, 0.1);
|
|
|
|
--form-bg: #fff;
|
|
--form-shadow: #667eea22;
|
|
--form-heading: #667eea;
|
|
--form-label: #444;
|
|
--form-input-bg: #f8fafc;
|
|
--form-input-border: #cbd5e1;
|
|
--form-loading: #666;
|
|
|
|
--list-bg: #fff5;
|
|
--list-item-bg: #f8fafc;
|
|
--list-item-border-good: #38c172;
|
|
--list-item-border-bad: #e53e3e;
|
|
--list-item-bg-good: #f0fff4;
|
|
--list-item-bg-bad: #fff5f5;
|
|
--list-image-bg: #eee;
|
|
--delete-btn-hover-bg: #ffeaea;
|
|
--delete-btn-hover-shadow: #ef444422;
|
|
--checkbox-accent: #667eea;
|
|
--list-loading-color: #888;
|
|
|
|
--modal-bg: #fff;
|
|
--modal-text: #222;
|
|
--modal-shadow: 0 12px 40px rgba(0, 0, 0, 0.2);
|
|
--dialog-message: #444;
|
|
--dialog-child-name: #667eea;
|
|
--info-image-bg: #eee;
|
|
--info-points: #667eea;
|
|
--loading-color: #fff;
|
|
|
|
/* ChildrenListView styles */
|
|
--card-bg: #fff;
|
|
--card-title: #333;
|
|
--card-shadow: 0 10px 30px rgba(0, 0, 0, 0.2);
|
|
--kebab-icon-color: #666;
|
|
--kebab-menu-bg: #f7fafc;
|
|
--kebab-menu-border: #bcc1c9;
|
|
--kebab-menu-shadow: 0 8px 24px rgba(0, 0, 0, 0.18), 0 1.5px 6px rgba(102, 126, 234, 0.08);
|
|
--kebab-menu-blur: 11px;
|
|
--menu-item-color: #333;
|
|
--menu-item-hover-bg: rgba(0, 0, 0, 0.04);
|
|
--menu-item-danger: #ff4d4f;
|
|
--modal-bg: #fff;
|
|
--modal-text: #222;
|
|
--modal-shadow: 0 12px 40px rgba(0, 0, 0, 0.2);
|
|
--fab-bg: #667eea;
|
|
--fab-hover-bg: #5a67d8;
|
|
--fab-active-bg: #4c51bf;
|
|
--no-children-color: #fdfdfd;
|
|
--sub-message-color: #b5ccff;
|
|
--sign-in-btn-bg: #fff;
|
|
--sign-in-btn-color: #2563eb;
|
|
--sign-in-btn-border: #2563eb;
|
|
--sign-in-btn-hover-bg: #2563eb;
|
|
--sign-in-btn-hover-color: #fff;
|
|
--child-image-bg: #fff;
|
|
--age-color: #666;
|
|
--points-color: #444;
|
|
|
|
/* Image Picker styles */
|
|
--icon-btn-bg: #f3f3f3;
|
|
--icon-btn-color: #667eea;
|
|
--icon-btn-shadow: 0 2px 8px rgba(102, 126, 234, 0.07);
|
|
--selectable-image-border: #e6e6e6;
|
|
--selectable-image-bg: #fafbff;
|
|
--selectable-image-selected: #667eea;
|
|
--loading-text: #888;
|
|
--modal-bg: #fff;
|
|
--modal-shadow: 0 12px 40px rgba(0, 0, 0, 0.2);
|
|
|
|
/* ChildDetailCard color variables */
|
|
--detail-card-bg: #fff;
|
|
--detail-card-shadow: 0 8px 32px rgba(0, 0, 0, 0.13);
|
|
|
|
--child-name-color: #333;
|
|
--child-age-color: #666;
|
|
|
|
--points-label-color: #888;
|
|
--points-value-color: #667eea;
|
|
|
|
/* ChildEditView styles */
|
|
--form-label-color: #333;
|
|
--form-input-bg: #fafbff;
|
|
--form-input-border: #e6e6e6;
|
|
--form-input-color: #222;
|
|
--form-input-focus: #667eea;
|
|
|
|
/*Reward/Task Assignment styles*/
|
|
--assign-heading-color: #ffffff;
|
|
--assign-no-items-color: #fdfdfd;
|
|
--assign-sub-message-color: #b5ccff;
|
|
--assign-create-btn-bg: #fff;
|
|
--assign-create-btn-color: #2563eb;
|
|
--assign-create-btn-border: #2563eb;
|
|
--assign-create-btn-hover-bg: #2563eb;
|
|
--assign-create-btn-hover-color: #fff;
|
|
|
|
--notification-reward-name: #ef4444;
|
|
|
|
/* ChildLists styles */
|
|
--child-list-bg: rgba(255, 255, 255, 0.1);
|
|
--child-list-title-color: #fff;
|
|
--child-list-loading-color: #fff;
|
|
--child-list-scrollbar-track: rgba(255, 255, 255, 0.05);
|
|
--child-list-scrollbar-thumb: linear-gradient(
|
|
180deg,
|
|
rgba(102, 126, 234, 0.8),
|
|
rgba(118, 75, 162, 0.8)
|
|
);
|
|
--child-list-scrollbar-thumb-hover: linear-gradient(
|
|
180deg,
|
|
rgba(102, 126, 234, 1),
|
|
rgba(118, 75, 162, 1)
|
|
);
|
|
--child-list-scrollbar-thumb-border: 2px solid rgba(255, 255, 255, 0.08);
|
|
|
|
--item-card-bg: rgba(255, 255, 255, 0.12);
|
|
--item-card-border: 1px solid rgba(255, 255, 255, 0.08);
|
|
--item-card-good-border: rgba(46, 204, 113, 0.9);
|
|
--item-card-good-bg: rgba(46, 204, 113, 0.06);
|
|
--item-card-bad-border: rgba(255, 99, 71, 0.95);
|
|
--item-card-bad-bg: rgba(255, 99, 71, 0.03);
|
|
--item-card-ready-shadow: 0 0 0 3px #667eea88, 0 0 12px #667eea44;
|
|
--item-card-ready-border: #667eea;
|
|
--item-card-hover-shadow: 0 8px 20px rgba(0, 0, 0, 0.12);
|
|
|
|
--item-name-color: #fff;
|
|
|
|
--item-points-color: #ffd166;
|
|
--item-points-shadow:
|
|
-1px -1px 0 #1a3d1f, 1px -1px 0 #1a3d1f, -1px 1px 0 #1a3d1f, 1px 1px 0 #1a3d1f;
|
|
--item-points-ready-color: #38c172;
|
|
|
|
--pending-block-bg: #222b;
|
|
--pending-block-color: #62ff7a;
|
|
|
|
/* TaskEditView styles */
|
|
--toggle-btn-bg: #f3f3f3;
|
|
--toggle-btn-color: #444;
|
|
--toggle-btn-border: #cbd5e1;
|
|
|
|
--toggle-btn-good-bg: #38c172;
|
|
--toggle-btn-good-color: #fff;
|
|
--toggle-btn-good-shadow: #38c17233;
|
|
--toggle-btn-good-border: #38c172;
|
|
|
|
--toggle-btn-bad-bg: #e53e3e;
|
|
--toggle-btn-bad-color: #fff;
|
|
--toggle-btn-bad-shadow: #e53e3e33;
|
|
--toggle-btn-bad-border: #e53e3e;
|
|
}
|