diff --git a/Scenes/main.tscn b/Scenes/main.tscn index 8808591..0ba8160 100644 --- a/Scenes/main.tscn +++ b/Scenes/main.tscn @@ -1,4 +1,4 @@ -[gd_scene load_steps=29 format=3 uid="uid://bytm7bt2s4ak8"] +[gd_scene load_steps=27 format=3 uid="uid://bytm7bt2s4ak8"] [ext_resource type="Script" uid="uid://bg5iqnwic1rio" path="res://Scripts/main.gd" id="1_8q3xr"] [ext_resource type="Texture2D" uid="uid://df1m4j7uxi63v" path="res://Assets/Icons/chevron-down.svg" id="2_6bp64"] @@ -11,8 +11,6 @@ [ext_resource type="Texture2D" uid="uid://cehbtwq6gq0cn" path="res://Assets/Icons/plus.svg" id="5_ynf5e"] [ext_resource type="Script" uid="uid://bgqglerkcylxx" path="res://addons/SmoothScroll/SmoothScrollContainer.gd" id="10_d1ilt"] [ext_resource type="Script" uid="uid://b7h0k2h2qwlqv" path="res://addons/SmoothScroll/scroll_damper/expo_scroll_damper.gd" id="11_6iyac"] -[ext_resource type="Script" uid="uid://2dcp833juv7b" path="res://addons/godot-flexbox/flex_container.gd" id="12_6iyac"] -[ext_resource type="PackedScene" uid="uid://bkj3x5y2m8qrl" path="res://Scenes/Tags/span.tscn" id="13_fdnlq"] [sub_resource type="StyleBoxEmpty" id="StyleBoxEmpty_344ge"] @@ -224,47 +222,6 @@ size_flags_horizontal = 3 size_flags_vertical = 3 theme_override_constants/separation = 22 -[node name="Control" type="Control" parent="VBoxContainer/SmoothScrollContainer/WebsiteContainer"] -layout_mode = 2 -mouse_filter = 1 - -[node name="FlexContainer" type="Container" parent="VBoxContainer/SmoothScrollContainer/WebsiteContainer/Control"] -custom_minimum_size = Vector2(40, 60) -layout_mode = 1 -anchors_preset = 15 -anchor_right = 1.0 -anchor_bottom = 1.0 -grow_horizontal = 2 -grow_vertical = 2 -script = ExtResource("12_6iyac") -flex_direction = 0 -justify_content = 1 -align_items = 2 -align_content = 2 -metadata/_custom_type_script = "uid://2dcp833juv7b" - -[node name="FlexContainer" type="Container" parent="VBoxContainer/SmoothScrollContainer/WebsiteContainer/Control/FlexContainer"] -custom_minimum_size = Vector2(40, 40) -layout_mode = 2 -script = ExtResource("12_6iyac") -metadata/_custom_type_script = "uid://2dcp833juv7b" -metadata/flex_metas = { -&"align_self": 0, -&"grow": 0.0 -} - -[node name="RichTextLabel" parent="VBoxContainer/SmoothScrollContainer/WebsiteContainer/Control/FlexContainer/FlexContainer" instance=ExtResource("13_fdnlq")] -layout_mode = 2 -mouse_filter = 1 - -[node name="RichTextLabel2" parent="VBoxContainer/SmoothScrollContainer/WebsiteContainer/Control/FlexContainer/FlexContainer" instance=ExtResource("13_fdnlq")] -layout_mode = 2 -mouse_filter = 1 - -[node name="RichTextLabel3" parent="VBoxContainer/SmoothScrollContainer/WebsiteContainer/Control/FlexContainer/FlexContainer" instance=ExtResource("13_fdnlq")] -layout_mode = 2 -mouse_filter = 1 - [node name="WebsiteBackground" type="Panel" parent="."] unique_name_in_owner = true z_index = -1 diff --git a/Scripts/B9/CSSParser.gd b/Scripts/B9/CSSParser.gd index 924e86d..c55645c 100644 --- a/Scripts/B9/CSSParser.gd +++ b/Scripts/B9/CSSParser.gd @@ -173,6 +173,14 @@ static func parse_utility_class_internal(rule: CSSRule, utility_name: String) -> var color_value = extract_bracket_content(utility_name, 5) # after 'text-' rule.properties["color"] = parse_color(color_value) return + + # Handle standard text color classes like text-white, text-black, etc. + if utility_name.begins_with("text-"): + var color_name = utility_name.substr(5) # after 'text-' + var color = get_color(color_name) + if color != null: + rule.properties["color"] = color + return # Handle background color classes like bg-[#ff0000] if utility_name.begins_with("bg-[") and utility_name.ends_with("]"): @@ -180,6 +188,14 @@ static func parse_utility_class_internal(rule: CSSRule, utility_name: String) -> var color = parse_color(color_value) rule.properties["background-color"] = color return + + # Handle standard background color classes like bg-white, bg-black, etc. + if utility_name.begins_with("bg-"): + var color_name = utility_name.substr(3) # after 'bg-' + var color = get_color(color_name) + if color != null: + rule.properties["background-color"] = color + return # e.g. max-w-[123px], w-[50%], h-[2rem] if utility_name.match("^max-w-\\[.*\\]$"): @@ -538,3 +554,83 @@ static func parse_inline_style(style_string: String) -> Dictionary: parse_utility_class_internal(rule, utility_name) return rule.properties + +static func get_color(color_name: String) -> Color: + # Common colors + match color_name: + "white": return Color.WHITE + "black": return Color.BLACK + "transparent": return Color.TRANSPARENT + + # Gray scale + "slate-50": return Color.from_string("#f8fafc", Color.WHITE) + "slate-100": return Color.from_string("#f1f5f9", Color.WHITE) + "slate-200": return Color.from_string("#e2e8f0", Color.WHITE) + "slate-300": return Color.from_string("#cbd5e1", Color.WHITE) + "slate-400": return Color.from_string("#94a3b8", Color.WHITE) + "slate-500": return Color.from_string("#64748b", Color.WHITE) + "slate-600": return Color.from_string("#475569", Color.WHITE) + "slate-700": return Color.from_string("#334155", Color.WHITE) + "slate-800": return Color.from_string("#1e293b", Color.WHITE) + "slate-900": return Color.from_string("#0f172a", Color.WHITE) + + "gray-50": return Color.from_string("#f9fafb", Color.WHITE) + "gray-100": return Color.from_string("#f3f4f6", Color.WHITE) + "gray-200": return Color.from_string("#e5e7eb", Color.WHITE) + "gray-300": return Color.from_string("#d1d5db", Color.WHITE) + "gray-400": return Color.from_string("#9ca3af", Color.WHITE) + "gray-500": return Color.from_string("#6b7280", Color.WHITE) + "gray-600": return Color.from_string("#4b5563", Color.WHITE) + "gray-700": return Color.from_string("#374151", Color.WHITE) + "gray-800": return Color.from_string("#1f2937", Color.WHITE) + "gray-900": return Color.from_string("#111827", Color.WHITE) + + # Red + "red-50": return Color.from_string("#fef2f2", Color.WHITE) + "red-100": return Color.from_string("#fee2e2", Color.WHITE) + "red-200": return Color.from_string("#fecaca", Color.WHITE) + "red-300": return Color.from_string("#fca5a5", Color.WHITE) + "red-400": return Color.from_string("#f87171", Color.WHITE) + "red-500": return Color.from_string("#ef4444", Color.WHITE) + "red-600": return Color.from_string("#dc2626", Color.WHITE) + "red-700": return Color.from_string("#b91c1c", Color.WHITE) + "red-800": return Color.from_string("#991b1b", Color.WHITE) + "red-900": return Color.from_string("#7f1d1d", Color.WHITE) + + # Green + "green-50": return Color.from_string("#f0fdf4", Color.WHITE) + "green-100": return Color.from_string("#dcfce7", Color.WHITE) + "green-200": return Color.from_string("#bbf7d0", Color.WHITE) + "green-300": return Color.from_string("#86efac", Color.WHITE) + "green-400": return Color.from_string("#4ade80", Color.WHITE) + "green-500": return Color.from_string("#22c55e", Color.WHITE) + "green-600": return Color.from_string("#16a34a", Color.WHITE) + "green-700": return Color.from_string("#15803d", Color.WHITE) + "green-800": return Color.from_string("#166534", Color.WHITE) + "green-900": return Color.from_string("#14532d", Color.WHITE) + + # Blue + "blue-50": return Color.from_string("#eff6ff", Color.WHITE) + "blue-100": return Color.from_string("#dbeafe", Color.WHITE) + "blue-200": return Color.from_string("#bfdbfe", Color.WHITE) + "blue-300": return Color.from_string("#93c5fd", Color.WHITE) + "blue-400": return Color.from_string("#60a5fa", Color.WHITE) + "blue-500": return Color.from_string("#3b82f6", Color.WHITE) + "blue-600": return Color.from_string("#2563eb", Color.WHITE) + "blue-700": return Color.from_string("#1d4ed8", Color.WHITE) + "blue-800": return Color.from_string("#1e40af", Color.WHITE) + "blue-900": return Color.from_string("#1e3a8a", Color.WHITE) + + # Yellow + "yellow-50": return Color.from_string("#fefce8", Color.WHITE) + "yellow-100": return Color.from_string("#fef9c3", Color.WHITE) + "yellow-200": return Color.from_string("#fef08a", Color.WHITE) + "yellow-300": return Color.from_string("#fde047", Color.WHITE) + "yellow-400": return Color.from_string("#facc15", Color.WHITE) + "yellow-500": return Color.from_string("#eab308", Color.WHITE) + "yellow-600": return Color.from_string("#ca8a04", Color.WHITE) + "yellow-700": return Color.from_string("#a16207", Color.WHITE) + "yellow-800": return Color.from_string("#854d0e", Color.WHITE) + "yellow-900": return Color.from_string("#713f12", Color.WHITE) + + _: return Color.BLACK diff --git a/Scripts/Constants.gd b/Scripts/Constants.gd index 156c25b..00628a7 100644 --- a/Scripts/Constants.gd +++ b/Scripts/Constants.gd @@ -46,7 +46,7 @@ var HTML_CONTENT = """
-

Users

+

Users

1,240

diff --git a/Scripts/StyleManager.gd b/Scripts/StyleManager.gd index ef6cb06..60ba616 100644 --- a/Scripts/StyleManager.gd +++ b/Scripts/StyleManager.gd @@ -1,6 +1,8 @@ class_name StyleManager extends RefCounted +static var body_text_color: Color = Color.BLACK + static func parse_size(val): if val == null: return null if typeof(val) == TYPE_INT or typeof(val) == TYPE_FLOAT: @@ -75,7 +77,13 @@ static func apply_styles_to_label(label: RichTextLabel, styles: Dictionary, elem var color_tag = "" if styles.has("color"): var color = styles["color"] as Color + + if color == Color.BLACK and StyleManager.body_text_color != Color.BLACK: + color = StyleManager.body_text_color color_tag = "[color=#%s]" % color.to_html(false) + else: + if StyleManager.body_text_color != Color.BLACK: + color_tag = "[color=#%s]" % StyleManager.body_text_color.to_html(false) # Apply bold var bold_open = "" var bold_close = "" @@ -125,6 +133,8 @@ static func apply_styles_to_label(label: RichTextLabel, styles: Dictionary, elem bold_close, "[/color]" if color_tag.length() > 0 else "", ] + + label.text = styled_text static func apply_flex_container_properties(node: FlexContainer, styles: Dictionary, element: HTMLParser.HTMLElement, parser: HTMLParser) -> void: # Flex direction - default to row if not specified @@ -370,6 +380,8 @@ static func apply_body_styles(body: HTMLParser.HTMLElement, parser: HTMLParser, style_box.bg_color = styles["background-color"] as Color website_background.add_theme_stylebox_override("panel", style_box) + if styles.has("color"): + StyleManager.body_text_color = styles["color"] # Apply padding var has_padding = styles.has("padding") or styles.has("padding-top") or styles.has("padding-right") or styles.has("padding-bottom") or styles.has("padding-left")