refactor: patient frontend UI overhaul
- Reworked design system (variables, global styles, component CSS) - Updated TabBar with icon-based navigation - Redesigned HomePage, HealthHub, ServicesHub layouts - Improved Exercise/Diet, Medication, Profile pages styling - Simplified constants (removed emoji icons, streamlined data) - Fixed launch.json cwd paths for frontend projects
This commit is contained in:
@@ -1,30 +1,39 @@
|
||||
:root {
|
||||
/* Primary - Rich Medical Blue */
|
||||
--color-primary: #2563EB;
|
||||
--color-primary-light: #3B82F6;
|
||||
--color-primary-dark: #1D4ED8;
|
||||
--color-primary-bg: #EFF6FF;
|
||||
--color-primary-gradient: linear-gradient(135deg, #2563EB, #4F8AF8);
|
||||
/* Primary - Modern Indigo Blue */
|
||||
--color-primary: #4F6EF7;
|
||||
--color-primary-light: #6C8CFF;
|
||||
--color-primary-dark: #3D56D4;
|
||||
--color-primary-bg: #EEF1FE;
|
||||
--color-primary-gradient: linear-gradient(135deg, #4F6EF7, #6C8CFF);
|
||||
|
||||
/* Accent */
|
||||
--color-accent-red: #FF6B6B;
|
||||
--color-accent-orange: #FFA94D;
|
||||
--color-accent-green: #20C997;
|
||||
--color-accent-purple: #845EF7;
|
||||
--color-accent-sky: #339AF0;
|
||||
--color-accent-pink: #F06595;
|
||||
|
||||
/* Status */
|
||||
--color-success: #10B981;
|
||||
--color-success-bg: #ECFDF5;
|
||||
--color-success: #20C997;
|
||||
--color-success-bg: #E6F9F2;
|
||||
--color-warning: #F59E0B;
|
||||
--color-warning-bg: #FFFBEB;
|
||||
--color-danger: #EF4444;
|
||||
--color-danger-bg: #FEF2F2;
|
||||
--color-warning-bg: #FFF4E5;
|
||||
--color-danger: #FF6B6B;
|
||||
--color-danger-bg: #FEE9E9;
|
||||
|
||||
/* Neutral */
|
||||
--color-white: #FFFFFF;
|
||||
--color-bg: #F4F6FA;
|
||||
--color-bg-secondary: #EBEEF3;
|
||||
--color-border: #E4E7EC;
|
||||
--color-border-light: #F0F1F4;
|
||||
--color-bg: #F0F4F8;
|
||||
--color-bg-secondary: #E8ECF2;
|
||||
--color-border: #E4E8EE;
|
||||
--color-border-light: #EEF1F6;
|
||||
--color-divider: #EDF0F5;
|
||||
|
||||
/* Text */
|
||||
--color-text-primary: #1A1E2B;
|
||||
--color-text-secondary: #6B7280;
|
||||
--color-text-tertiary: #9CA3AF;
|
||||
--color-text-primary: #1A1D28;
|
||||
--color-text-secondary: #5A5F72;
|
||||
--color-text-tertiary: #9BA0B4;
|
||||
--color-text-inverse: #FFFFFF;
|
||||
|
||||
/* Spacing */
|
||||
@@ -37,21 +46,21 @@
|
||||
--spacing-3xl: 32px;
|
||||
|
||||
/* Border radius */
|
||||
--radius-sm: 8px;
|
||||
--radius-md: 12px;
|
||||
--radius-sm: 10px;
|
||||
--radius-md: 14px;
|
||||
--radius-lg: 16px;
|
||||
--radius-xl: 20px;
|
||||
--radius-2xl: 24px;
|
||||
--radius-full: 9999px;
|
||||
|
||||
/* Shadows */
|
||||
--shadow-xs: 0 1px 2px rgba(0,0,0,0.04);
|
||||
--shadow-sm: 0 2px 8px rgba(0,0,0,0.05);
|
||||
--shadow-md: 0 4px 16px rgba(0,0,0,0.07);
|
||||
--shadow-lg: 0 8px 32px rgba(0,0,0,0.09);
|
||||
--shadow-xs: 0 1px 3px rgba(0,0,0,0.03);
|
||||
--shadow-sm: 0 2px 12px rgba(0,0,0,0.04);
|
||||
--shadow-md: 0 4px 20px rgba(0,0,0,0.06);
|
||||
--shadow-lg: 0 8px 30px rgba(0,0,0,0.08);
|
||||
|
||||
/* Font */
|
||||
--font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', 'PingFang SC', 'Hiragino Sans GB', 'Microsoft YaHei', sans-serif;
|
||||
--font-family: -apple-system, BlinkMacSystemFont, 'PingFang SC', 'Hiragino Sans GB', 'Microsoft YaHei', sans-serif;
|
||||
--font-size-xs: 11px;
|
||||
--font-size-sm: 12px;
|
||||
--font-size-base: 14px;
|
||||
@@ -62,8 +71,8 @@
|
||||
--font-size-3xl: 32px;
|
||||
|
||||
/* Layout */
|
||||
--tab-bar-height: 56px;
|
||||
--header-height: 48px;
|
||||
--tab-bar-height: 64px;
|
||||
--header-height: 50px;
|
||||
--max-content-width: 414px;
|
||||
|
||||
/* Z-index */
|
||||
|
||||
Reference in New Issue
Block a user