diff --git a/Extension/themes/classic-light.css b/Extension/themes/classic-light.css index e8aa3bc..2f48fbb 100644 --- a/Extension/themes/classic-light.css +++ b/Extension/themes/classic-light.css @@ -6,7 +6,7 @@ /* === CORE COLORS === */ --wplace-primary: #E0E0E1; /* Quite white */ --wplace-secondary: #FBFBFB; /* Light white */ - --wplace-accent: #FBFBFB; /* Lighter white */ + --wplace-accent: #F3F3F3; /* Darker white */ --wplace-text: #203C5D; /* Dark blue text */ --wplace-highlight: #32C8FE; /* Cyan highlight */ --wplace-success: #28a745; /* Bootstrap green */ @@ -75,7 +75,7 @@ /* Main container with clean light styling */ .wplace-theme-classic-light #wplace-image-bot-container { - background: linear-gradient(135deg, #fff 0%, #f8f9fa 100%) !important; + background: linear-gradient(135deg, #E0E0E1 0%, #FBFBFB 100%) !important; color: var(--wplace-text) !important; border: 1px solid rgb(0 0 0 / 15%) !important; border-radius: 12px !important; @@ -87,7 +87,7 @@ /* Stats container with proper contrast */ .wplace-theme-classic-light #wplace-stats-container { - background: linear-gradient(135deg, #f8f9fa 0%, #e9ecef 100%) !important; + background: linear-gradient(135deg, #FBFBFB 0%, #F3F3F3 100%) !important; border: 1px solid rgb(0 0 0 / 20%) !important; border-radius: 12px !important; box-shadow: 0 8px 32px rgb(0 0 0 / 15%) !important; @@ -100,7 +100,7 @@ /* Headers with light gradient */ .wplace-theme-classic-light .wplace-header { - background: linear-gradient(135deg, #f8f9fa 0%, #e9ecef 100%) !important; + background: linear-gradient(135deg, #FBFBFB 0%, #F3F3F3 100%) !important; color: var(--wplace-highlight) !important; border-bottom: 1px solid rgb(0 0 0 / 15%) !important; text-shadow: none !important; @@ -108,7 +108,7 @@ /* Stats header styling */ .wplace-theme-classic-light #wplace-stats-container .wplace-header { - background: linear-gradient(135deg, #e9ecef 0%, #dee2e6 100%) !important; + background: linear-gradient(135deg, #F3F3F3 0%, #dee2e6 100%) !important; color: var(--wplace-text) !important; border-bottom: 1px solid rgb(0 0 0 / 20%) !important; text-shadow: none !important; @@ -134,7 +134,7 @@ /* Buttons with light styling */ .wplace-theme-classic-light .wplace-btn { - background: linear-gradient(135deg, #f8f9fa 0%, #e9ecef 100%) !important; + background: linear-gradient(135deg, #FBFBFB 0%, #F3F3F3 100%) !important; border: 1px solid rgb(0 0 0 / 20%) !important; border-radius: 12px !important; color: var(--wplace-text) !important; @@ -145,26 +145,26 @@ /* Data management section buttons */ .wplace-theme-classic-light .wplace-data-management .wplace-btn { - background: linear-gradient(135deg, #f8f9fa 0%, #e9ecef 100%) !important; + background: linear-gradient(135deg, #FBFBFB 0%, #F3F3F3 100%) !important; border: 1px solid rgb(0 0 0 / 20%) !important; color: #212529 !important; font-weight: 500 !important; } .wplace-theme-classic-light .wplace-btn:hover:not(:disabled) { - background: linear-gradient(135deg, #e9ecef 0%, #dee2e6 100%) !important; + background: linear-gradient(135deg, #F3F3F3 0%, #dee2e6 100%) !important; box-shadow: 0 4px 12px rgb(0 0 0 / 15%) !important; transform: translateY(-1px) !important; } .wplace-theme-classic-light .wplace-data-management .wplace-btn:hover:not(:disabled) { - background: linear-gradient(135deg, #e9ecef 0%, #dee2e6 100%) !important; + background: linear-gradient(135deg, #F3F3F3 0%, #dee2e6 100%) !important; box-shadow: 0 4px 12px rgb(0 0 0 / 15%) !important; } /* Settings dialog */ .wplace-theme-classic-light #wplace-settings-container { - background: linear-gradient(135deg, #fff 0%, #f8f9fa 100%) !important; + background: linear-gradient(135deg, #E0E0E1 0%, #FBFBFB 100%) !important; border: 1px solid rgb(0 0 0 / 15%) !important; border-radius: 12px !important; box-shadow: 0 16px 48px rgb(0 0 0 / 20%), 0 0 0 1px rgb(0 0 0 / 8%) !important; @@ -207,7 +207,7 @@ /* Resize dialog */ .wplace-theme-classic-light .resize-container { - background: linear-gradient(135deg, #fff 0%, #f8f9fa 100%) !important; + background: linear-gradient(135deg, #E0E0E1 0%, #FBFBFB 100%) !important; border: 1px solid rgb(0 0 0 / 15%) !important; border-radius: 12px !important; box-shadow: 0 16px 48px rgb(0 0 0 / 20%), 0 0 0 1px rgb(0 0 0 / 8%) !important; @@ -217,7 +217,7 @@ /* Settings header */ .wplace-theme-classic-light .wplace-settings-header { - background: linear-gradient(135deg, #f8f9fa 0%, #e9ecef 100%) !important; + background: linear-gradient(135deg, #FBFBFB 0%, #F3F3F3 100%) !important; border-bottom: 1px solid rgb(0 0 0 / 15%) !important; } @@ -352,7 +352,7 @@ /* Form controls with light styling */ .wplace-theme-classic-light .wplace-settings-select { - background: #fff !important; + background: #E0E0E1 !important; border: 1px solid rgb(0 0 0 / 20%) !important; border-radius: 8px !important; color: var(--wplace-text) !important; @@ -367,12 +367,12 @@ /* Dropdown menu options */ .wplace-theme-classic-light .wplace-settings-select option { - background: #fff !important; + background: #E0E0E1 !important; color: var(--wplace-text) !important; } .wplace-theme-classic-light .wplace-settings-option { - background: #fff !important; + background: #E0E0E1 !important; color: var(--wplace-text) !important; } @@ -530,7 +530,7 @@ } .wplace-theme-classic-light .wplace-number-input-compact { - background: #fff; + background: #E0E0E1; border: 1px solid rgb(0 0 0 / 20%); border-radius: 4px; color: var(--wplace-text); @@ -546,7 +546,7 @@ outline: none; border-color: #4facfe; box-shadow: 0 0 0 3px rgba(79, 172, 254, 0.3); - background: #f8f9fa; + background: #FBFBFB; } .wplace-theme-classic-light .wplace-input-label-compact { @@ -597,3 +597,4 @@ border: 1px solid rgb(0 0 0 / 10%) !important; } +