body text color, color presets

This commit is contained in:
Face
2025-07-30 15:21:59 +03:00
parent 02973f4439
commit 3788797688
4 changed files with 110 additions and 45 deletions

View File

@@ -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

View File

@@ -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

View File

@@ -46,7 +46,7 @@ var HTML_CONTENT = """<head>
<!-- Top Summary Cards -->
<div style="flex flex-row gap-4 justify-center flex-wrap">
<div style="card w-48 h-24 flex flex-col justify-center items-center">
<h2>Users</h2>
<h2 style="text-red-500">Users</h2>
<p>1,240</p>
</div>
<div style="card w-48 h-24 flex flex-col justify-center items-center">

View File

@@ -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")