Fix colour system

This commit is contained in:
2025-05-27 14:36:40 +02:00
parent 60582d4520
commit 0c745e7544
13 changed files with 120 additions and 100 deletions

View File

@@ -356,9 +356,15 @@ def init_routes(main_bp):
flash('Only administrators can update settings.', 'error')
return redirect(url_for('main.dashboard'))
logger.debug(f"Form data: {request.form}")
logger.debug(f"CSRF token: {request.form.get('csrf_token')}")
primary_color = request.form.get('primary_color')
secondary_color = request.form.get('secondary_color')
logger.debug(f"Primary color: {primary_color}")
logger.debug(f"Secondary color: {secondary_color}")
if not primary_color or not secondary_color:
flash('Both primary and secondary colors are required.', 'error')
return redirect(url_for('main.settings'))
@@ -369,8 +375,10 @@ def init_routes(main_bp):
try:
db.session.commit()
logger.debug("Colors updated successfully in database")
flash('Color settings updated successfully!', 'success')
except Exception as e:
logger.error(f"Error updating colors: {str(e)}")
db.session.rollback()
flash('An error occurred while updating color settings.', 'error')
@@ -447,9 +455,17 @@ def init_routes(main_bp):
@main_bp.route('/dynamic-colors.css')
def dynamic_colors():
site_settings = SiteSettings.get_settings()
"""Generate dynamic CSS variables based on site settings"""
logger.info(f"[Dynamic Colors] Request from: {request.referrer}")
# Calculate derived colors
# Get colors from settings
site_settings = SiteSettings.get_settings()
primary_color = site_settings.primary_color
secondary_color = site_settings.secondary_color
logger.info(f"[Dynamic Colors] Current colors - Primary: {primary_color}, Secondary: {secondary_color}")
# Convert hex to RGB for opacity calculations
def hex_to_rgb(hex_color):
hex_color = hex_color.lstrip('#')
return tuple(int(hex_color[i:i+2], 16) for i in (0, 2, 4))
@@ -457,60 +473,49 @@ def init_routes(main_bp):
def rgb_to_hex(rgb):
return '#{:02x}{:02x}{:02x}'.format(rgb[0], rgb[1], rgb[2])
def lighten_color(hex_color, amount):
def lighten_color(hex_color, amount=0.2):
rgb = hex_to_rgb(hex_color)
return rgb_to_hex(tuple(min(255, int(c + (255 - c) * amount)) for c in rgb))
rgb = tuple(min(255, int(c + (255 - c) * amount)) for c in rgb)
return rgb_to_hex(rgb)
# Calculate all color variants
primary_light = lighten_color(site_settings.primary_color, 0.15)
primary_bg_light = lighten_color(site_settings.primary_color, 0.9)
primary_opacity_15 = site_settings.primary_color + '26'
# Calculate derived colors
primary_rgb = hex_to_rgb(primary_color)
secondary_rgb = hex_to_rgb(secondary_color)
secondary_light = lighten_color(site_settings.secondary_color, 0.15)
secondary_bg_light = lighten_color(site_settings.secondary_color, 0.9)
secondary_opacity_15 = site_settings.secondary_color + '26'
# Calculate chart colors
primary_chart_light = lighten_color(site_settings.primary_color, 0.2)
primary_chart_lighter = lighten_color(site_settings.primary_color, 0.4)
primary_chart_lightest = lighten_color(site_settings.primary_color, 0.6)
primary_chart_pale = lighten_color(site_settings.primary_color, 0.8)
secondary_chart_light = lighten_color(site_settings.secondary_color, 0.2)
secondary_chart_lighter = lighten_color(site_settings.secondary_color, 0.4)
secondary_chart_lightest = lighten_color(site_settings.secondary_color, 0.6)
secondary_chart_pale = lighten_color(site_settings.secondary_color, 0.8)
# Lighten colors for hover states
primary_light = lighten_color(primary_color, 0.2)
secondary_light = lighten_color(secondary_color, 0.2)
# Generate CSS with opacity variables
css = f"""
:root {{
/* Primary Colors */
--primary-color: {site_settings.primary_color};
--primary-color: {primary_color};
--primary-light: {primary_light};
--primary-bg-light: {primary_bg_light};
--primary-opacity-15: {primary_opacity_15};
--primary-rgb: {primary_rgb[0]}, {primary_rgb[1]}, {primary_rgb[2]};
--primary-opacity-8: rgba({primary_rgb[0]}, {primary_rgb[1]}, {primary_rgb[2]}, 0.08);
--primary-opacity-15: rgba({primary_rgb[0]}, {primary_rgb[1]}, {primary_rgb[2]}, 0.15);
--primary-opacity-25: rgba({primary_rgb[0]}, {primary_rgb[1]}, {primary_rgb[2]}, 0.25);
--primary-opacity-50: rgba({primary_rgb[0]}, {primary_rgb[1]}, {primary_rgb[2]}, 0.5);
/* Secondary Colors */
--secondary-color: {site_settings.secondary_color};
--secondary-color: {secondary_color};
--secondary-light: {secondary_light};
--secondary-bg-light: {secondary_bg_light};
--secondary-opacity-15: {secondary_opacity_15};
--secondary-rgb: {secondary_rgb[0]}, {secondary_rgb[1]}, {secondary_rgb[2]};
--secondary-opacity-8: rgba({secondary_rgb[0]}, {secondary_rgb[1]}, {secondary_rgb[2]}, 0.08);
--secondary-opacity-15: rgba({secondary_rgb[0]}, {secondary_rgb[1]}, {secondary_rgb[2]}, 0.15);
--secondary-opacity-25: rgba({secondary_rgb[0]}, {secondary_rgb[1]}, {secondary_rgb[2]}, 0.25);
--secondary-opacity-50: rgba({secondary_rgb[0]}, {secondary_rgb[1]}, {secondary_rgb[2]}, 0.5);
/* Chart Colors */
--chart-primary: {site_settings.primary_color};
--chart-secondary: {site_settings.secondary_color};
--chart-warning: #ffd700;
/* Primary Chart Colors */
--chart-primary-light: {primary_chart_light};
--chart-primary-lighter: {primary_chart_lighter};
--chart-primary-lightest: {primary_chart_lightest};
--chart-primary-pale: {primary_chart_pale};
/* Secondary Chart Colors */
--chart-secondary-light: {secondary_chart_light};
--chart-secondary-lighter: {secondary_chart_lighter};
--chart-secondary-lightest: {secondary_chart_lightest};
--chart-secondary-pale: {secondary_chart_pale};
--chart-color-1: {primary_color};
--chart-color-2: {secondary_color};
--chart-color-3: {lighten_color(primary_color, 0.4)};
--chart-color-4: {lighten_color(secondary_color, 0.4)};
}}
"""
logger.info(f"[Dynamic Colors] Generated CSS with primary color: {primary_color}")
logger.info(f"[Dynamic Colors] Cache version: {site_settings.updated_at.timestamp()}")
return Response(css, mimetype='text/css')