|
import re |
|
import streamlit as st |
|
from bs4 import BeautifulSoup |
|
from copy import deepcopy |
|
|
|
def parse_variable_file(variable_content): |
|
"""Parses the SCSS variable content and returns a mapping of color names to their values.""" |
|
variables = {} |
|
|
|
|
|
st.write("Parsing variables file...") |
|
|
|
|
|
for line in variable_content.splitlines(): |
|
|
|
if not line.strip() or line.strip().startswith('//'): |
|
continue |
|
|
|
|
|
var_match = re.match(r'^\s*\$([\w-]+):\s*([^;]+)\s*(!default)?\s*;', line) |
|
|
|
if var_match: |
|
var_name = var_match.group(1) |
|
var_value = var_match.group(2).strip() |
|
|
|
|
|
if re.match(r'^(#[a-fA-F0-9]{3,6}|rgba?\([^)]+\))$', var_value): |
|
variables[var_value] = f"${var_name}" |
|
|
|
st.write(f"Found color variable: ${var_name} = {var_value}") |
|
|
|
st.write(f"Total variables found: {len(variables)}") |
|
return variables |
|
|
|
def convert_css_to_scss(css_content, variable_mapping): |
|
"""Converts CSS content to SCSS by replacing color values with variable names.""" |
|
|
|
st.write("Starting CSS to SCSS conversion...") |
|
st.write("Available variable mappings:", variable_mapping) |
|
|
|
result_lines = [] |
|
for line in css_content.splitlines(): |
|
original_line = line |
|
processed_line = line |
|
|
|
|
|
if '/*' in line and '*/' in line: |
|
|
|
parts = re.split(r'(/\*.*?\*/)', line) |
|
processed_parts = [] |
|
|
|
for part in parts: |
|
if part.startswith('/*'): |
|
processed_parts.append(part) |
|
else: |
|
|
|
processed_part = part |
|
for color, variable in variable_mapping.items(): |
|
if color in processed_part: |
|
processed_part = processed_part.replace(color, variable) |
|
st.write(f"Replaced {color} with {variable}") |
|
processed_parts.append(processed_part) |
|
|
|
processed_line = ''.join(processed_parts) |
|
else: |
|
|
|
for color, variable in variable_mapping.items(): |
|
if color in processed_line: |
|
processed_line = processed_line.replace(color, variable) |
|
st.write(f"Replaced {color} with {variable}") |
|
|
|
|
|
if original_line != processed_line: |
|
st.write(f"Changed line:\nFrom: {original_line}\nTo: {processed_line}") |
|
|
|
result_lines.append(processed_line) |
|
|
|
return '\n'.join(result_lines) |
|
|
|
|
|
st.title("SCSS Variable Converter with Debug Output") |
|
|
|
|
|
css_file = st.file_uploader("Upload CSS File", type=["css"]) |
|
variables_file = st.file_uploader("Upload SCSS Variables File", type=["scss"]) |
|
|
|
if css_file and variables_file: |
|
try: |
|
css_content = css_file.read().decode("utf-8") |
|
variables_content = variables_file.read().decode("utf-8") |
|
|
|
st.write("Processing files...") |
|
st.write("---") |
|
|
|
variable_mapping = parse_variable_file(variables_content) |
|
if variable_mapping: |
|
scss_content = convert_css_to_scss(css_content, variable_mapping) |
|
|
|
if scss_content: |
|
st.subheader("SCSS Output") |
|
st.code(scss_content, language="scss") |
|
st.download_button( |
|
"Download SCSS File", |
|
data=scss_content, |
|
file_name="converted.scss", |
|
mime="text/plain" |
|
) |
|
else: |
|
st.error("No valid color variables found in the variables file.") |
|
|
|
except Exception as e: |
|
st.error(f"An error occurred: {str(e)}") |
|
st.write("Error details:", str(e)) |