diff --git a/flumi/Scenes/Tags/input.tscn b/flumi/Scenes/Tags/input.tscn index ad59e42..ca7eccc 100644 --- a/flumi/Scenes/Tags/input.tscn +++ b/flumi/Scenes/Tags/input.tscn @@ -119,7 +119,7 @@ visible = false layout_mode = 2 [node name="FileButton" type="Button" parent="FileContainer"] -custom_minimum_size = Vector2(100, 0) +custom_minimum_size = Vector2(100, 32) layout_mode = 2 theme = ExtResource("2_theme") text = "Choose File" diff --git a/flumi/Scripts/B9/CSSParser.gd b/flumi/Scripts/B9/CSSParser.gd index de10ffd..8755f6a 100644 --- a/flumi/Scripts/B9/CSSParser.gd +++ b/flumi/Scripts/B9/CSSParser.gd @@ -362,11 +362,24 @@ func parse_rule(rule_data: Dictionary) -> CSSRule: var properties_text = rule_data.properties var utility_classes = properties_text.split(" ") + + var base_utilities = [] + var pseudo_utilities = [] + for utility_name in utility_classes: utility_name = utility_name.strip_edges() if utility_name.is_empty(): continue + if utility_name.begins_with("hover:") or utility_name.begins_with("active:"): + pseudo_utilities.append(utility_name) + else: + base_utilities.append(utility_name) + + for utility_name in base_utilities: + parse_utility_class_internal(rule, utility_name) + + for utility_name in pseudo_utilities: parse_utility_class(rule, utility_name) return rule @@ -382,11 +395,14 @@ func parse_utility_class(rule: CSSRule, utility_name: String) -> void: pseudo_rule.selector = rule.selector pseudo_rule.event_prefix = pseudo - pseudo_rule.selector_type = "simple" - pseudo_rule.selector_parts = [rule.selector] + pseudo_rule.selector_type = rule.selector_type + pseudo_rule.selector_parts = rule.selector_parts.duplicate() pseudo_rule.calculate_specificity() pseudo_rule.specificity += 100 + for property in rule.properties: + pseudo_rule.properties[property] = rule.properties[property] + parse_utility_class_internal(pseudo_rule, actual_utility) stylesheet.add_rule(pseudo_rule) return diff --git a/flumi/Scripts/Constants.gd b/flumi/Scripts/Constants.gd index ba0134c..fde9ec0 100644 --- a/flumi/Scripts/Constants.gd +++ b/flumi/Scripts/Constants.gd @@ -24,11 +24,14 @@ pre { text-xl font-mono } button { text-[16px] bg-[#1b1b1b] rounded-md text-white hover:bg-[#2a2a2a] active:bg-[#101010] px-3 py-1.5 } button[disabled] { bg-[#666666] text-[#999999] cursor-not-allowed } -input { text-[#000000] border border-[#000000] rounded-[3px] bg-transparent px-3 py-1.5 } -input:active { border-[3px] border-[#000000] } - select { text-[#000000] border border-[#000000] rounded-[3px] bg-transparent px-3 py-1.5 } select:active { text-[#000000] border-[3px] border-[#000000] } + +input[type="color"] { w-32 } +input[type="range"] { w-32 } +input[type="text"] { w-64 } +input[type="number"] { w-32 text-[16px] bg-transparent border border-[#000000] rounded-[3px] text-[#000000] hover:border-[3px] hover:border-[#000000] px-3 py-1.5 } +input[type="date"] { w-28 text-[16px] bg-[#1b1b1b] rounded-md text-white hover:bg-[#2a2a2a] active:bg-[#101010] px-3 py-1.5 } """ var HTML_CONTENT = """ diff --git a/flumi/Scripts/StyleManager.gd b/flumi/Scripts/StyleManager.gd index 37a547f..c12811e 100644 --- a/flumi/Scripts/StyleManager.gd +++ b/flumi/Scripts/StyleManager.gd @@ -774,7 +774,7 @@ static func apply_flexcontainer_centering(node: Control, styles: Dictionary) -> if not node is FlexContainer: return - var should_center_h = styles.has("mx-auto") or styles.has("justify-self-center") or (styles.has("text-align") and styles["text-align"] == "center") + var should_center_h = styles.has("mx-auto") or styles.has("justify-self-center") var should_center_v = styles.has("my-auto") or styles.has("align-self-center") if should_center_h and not node.has_meta("size_flags_horizontal_set"): @@ -787,7 +787,7 @@ static func apply_flexcontainer_centering(node: Control, styles: Dictionary) -> node.set_meta("size_flags_set_by_style_manager", true) static func apply_element_centering(node: Control, styles: Dictionary) -> void: - var should_center_h = styles.has("mx-auto") or styles.has("justify-self-center") or (styles.has("text-align") and styles["text-align"] == "center") + var should_center_h = styles.has("mx-auto") or styles.has("justify-self-center") var should_center_v = styles.has("my-auto") or styles.has("align-self-center") # For FlexContainers, use the existing logic with metadata checks diff --git a/flumi/Scripts/Tags/input.gd b/flumi/Scripts/Tags/input.gd index 17b824d..a936ecf 100644 --- a/flumi/Scripts/Tags/input.gd +++ b/flumi/Scripts/Tags/input.gd @@ -603,9 +603,40 @@ func apply_stylebox_to_input(control: Control, styles: Dictionary) -> void: if not has_bottom_padding: style_box.content_margin_bottom = 2.0 + var hover_styles = _parser.get_element_styles_with_inheritance(_element, "hover", []) + var active_styles = _parser.get_element_styles_with_inheritance(_element, "active", []) + var hover_style_box = null + var active_style_box = null + + if not hover_styles.is_empty(): + hover_style_box = BackgroundUtils.create_stylebox_from_styles(hover_styles) + if not hover_styles.has("padding") and not hover_styles.has("padding-left"): + hover_style_box.content_margin_left = 5.0 + if not hover_styles.has("padding") and not hover_styles.has("padding-right"): + hover_style_box.content_margin_right = 5.0 + if not hover_styles.has("padding") and not hover_styles.has("padding-top"): + hover_style_box.content_margin_top = 2.0 + if not hover_styles.has("padding") and not hover_styles.has("padding-bottom"): + hover_style_box.content_margin_bottom = 2.0 + + if not active_styles.is_empty(): + active_style_box = BackgroundUtils.create_stylebox_from_styles(active_styles) + if not active_styles.has("padding") and not active_styles.has("padding-left"): + active_style_box.content_margin_left = 5.0 + if not active_styles.has("padding") and not active_styles.has("padding-right"): + active_style_box.content_margin_right = 5.0 + if not active_styles.has("padding") and not active_styles.has("padding-top"): + active_style_box.content_margin_top = 2.0 + if not active_styles.has("padding") and not active_styles.has("padding-bottom"): + active_style_box.content_margin_bottom = 2.0 + if control is LineEdit: control.add_theme_stylebox_override("normal", style_box) control.add_theme_stylebox_override("focus", style_box) + if hover_style_box: + control.add_theme_stylebox_override("hover", hover_style_box) + if active_style_box: + control.add_theme_stylebox_override("pressed", active_style_box) elif control is SpinBox: # NOTE: currently broken, it goes over the buttons, dont have time to fix #style_box.expand_margin_right += 32.0 # More space for stepper buttons @@ -614,6 +645,14 @@ func apply_stylebox_to_input(control: Control, styles: Dictionary) -> void: if line_edit: line_edit.add_theme_stylebox_override("normal", style_box) line_edit.add_theme_stylebox_override("focus", style_box) + if hover_style_box: + line_edit.add_theme_stylebox_override("hover", hover_style_box) + if active_style_box: + line_edit.add_theme_stylebox_override("pressed", active_style_box) elif control is Button: control.add_theme_stylebox_override("normal", style_box) + if hover_style_box: + control.add_theme_stylebox_override("hover", hover_style_box) + if active_style_box: + control.add_theme_stylebox_override("pressed", active_style_box) diff --git a/flumi/Scripts/Utils/Lua/ThreadedVM.gd b/flumi/Scripts/Utils/Lua/ThreadedVM.gd index c207581..d70996a 100644 --- a/flumi/Scripts/Utils/Lua/ThreadedVM.gd +++ b/flumi/Scripts/Utils/Lua/ThreadedVM.gd @@ -293,17 +293,18 @@ func _setup_threaded_gurt_api(): lua_vm.lua_pushcallable(_gurt_create_handler, "gurt.create") lua_vm.lua_setfield(-2, "create") - lua_vm.lua_pushcallable(_set_timeout_handler, "gurt.setTimeout") - lua_vm.lua_setfield(-2, "setTimeout") + # Add timer functions as global functions + lua_vm.lua_pushcallable(_set_timeout_handler, "setTimeout") + lua_vm.lua_setglobal("setTimeout") - lua_vm.lua_pushcallable(lua_api._gurt_clear_timeout_handler, "gurt.clearTimeout") - lua_vm.lua_setfield(-2, "clearTimeout") + lua_vm.lua_pushcallable(lua_api._gurt_clear_timeout_handler, "clearTimeout") + lua_vm.lua_setglobal("clearTimeout") - lua_vm.lua_pushcallable(_set_interval_handler, "gurt.setInterval") - lua_vm.lua_setfield(-2, "setInterval") + lua_vm.lua_pushcallable(_set_interval_handler, "setInterval") + lua_vm.lua_setglobal("setInterval") - lua_vm.lua_pushcallable(lua_api._gurt_clear_interval_handler, "gurt.clearInterval") - lua_vm.lua_setfield(-2, "clearInterval") + lua_vm.lua_pushcallable(lua_api._gurt_clear_interval_handler, "clearInterval") + lua_vm.lua_setglobal("clearInterval") lua_vm.lua_newtable() lua_vm.lua_pushcallable(lua_api._gurt_location_reload_handler, "gurt.location.reload") diff --git a/flumi/addons/DatePicker/DateButton.tscn b/flumi/addons/DatePicker/DateButton.tscn index c955e0f..f8fdbcc 100644 --- a/flumi/addons/DatePicker/DateButton.tscn +++ b/flumi/addons/DatePicker/DateButton.tscn @@ -1,32 +1,14 @@ -[gd_scene load_steps=6 format=3 uid="uid://b6c1twaog7hui"] +[gd_scene load_steps=4 format=3 uid="uid://b6c1twaog7hui"] [ext_resource type="Texture2D" uid="uid://mol3s1ujp0k2" path="res://Assets/Icons/calendar_16x16.svg" id="1_ef33s"] [ext_resource type="Script" uid="uid://do548vwv7m0rq" path="res://addons/DatePicker/DateButton.gd" id="1_sskq5"] [sub_resource type="StyleBoxEmpty" id="StyleBoxEmpty_ef33s"] -[sub_resource type="StyleBoxFlat" id="StyleBoxFlat_ufs0o"] -content_margin_left = 4.0 -bg_color = Color(0.105882, 0.105882, 0.105882, 1) -corner_radius_top_left = 4 -corner_radius_top_right = 4 -corner_radius_bottom_right = 4 -corner_radius_bottom_left = 4 - -[sub_resource type="StyleBoxFlat" id="StyleBoxFlat_pnupr"] -content_margin_left = 4.0 -bg_color = Color(0.105882, 0.105882, 0.105882, 1) -corner_radius_top_left = 4 -corner_radius_top_right = 4 -corner_radius_bottom_right = 4 -corner_radius_bottom_left = 4 - [node name="DateButton" type="Button"] offset_right = 115.0 offset_bottom = 34.0 theme_override_styles/focus = SubResource("StyleBoxEmpty_ef33s") -theme_override_styles/hover = SubResource("StyleBoxFlat_ufs0o") -theme_override_styles/normal = SubResource("StyleBoxFlat_pnupr") action_mode = 0 text = "3/13/2025" icon = ExtResource("1_ef33s") diff --git a/flumi/addons/DatePicker/YearView.gd b/flumi/addons/DatePicker/YearView.gd index 647aa59..646b4eb 100644 --- a/flumi/addons/DatePicker/YearView.gd +++ b/flumi/addons/DatePicker/YearView.gd @@ -28,7 +28,7 @@ func init(): func scroll_to_current_year(): var year_container: VBoxContainer = %YearContainer - var scroll_container: ScrollContainer = $SmoothScrollContainer + var scroll_container: ScrollContainer = $ScrollContainer var current_year = calendar.date_time.year var target_button: Button = year_container.get_node_or_null("Year" + str(current_year)) diff --git a/tests/attribute.html b/tests/attribute.html index 5ef7792..b59ba0c 100644 --- a/tests/attribute.html +++ b/tests/attribute.html @@ -123,7 +123,7 @@ if not disabled then targetButton:setAttribute('style', 'target-button ' .. randomColor .. ' text-white px-6 py-3 rounded-lg font-semibold hover:opacity-75') - gurt.setTimeout(function() + setTimeout(function() targetButton:setAttribute('style', 'target-button bg-[#3b82f6] text-white px-6 py-3 rounded-lg font-semibold hover:bg-[#2563eb]') end, 1000) end @@ -137,7 +137,7 @@ targetButton:setAttribute('data-value', 'initial') -- Update status after setting initial attributes - gurt.setTimeout(function() + setTimeout(function() updateStatus() end, 100) diff --git a/tests/audio.html b/tests/audio.html index 01d4f80..0fb781c 100644 --- a/tests/audio.html +++ b/tests/audio.html @@ -33,7 +33,7 @@ controlledAudio.volume = 0.3 end) - local test = gurt.setTimeout(function() + local test = setTimeout(function() print('removed') programmaticAudio:play() end, 3000) diff --git a/tests/crumbs.html b/tests/crumbs.html index e9e2b43..76dec8a 100644 --- a/tests/crumbs.html +++ b/tests/crumbs.html @@ -155,7 +155,7 @@ end) -- Test: Auto-refresh every 2 seconds to show expiry - gurt.setInterval(function() + setInterval(function() refresh_crumbs_display() end, 2000) diff --git a/tests/index.html b/tests/index.html index 305ab3a..06a35fd 100644 --- a/tests/index.html +++ b/tests/index.html @@ -1,18 +1,23 @@ My cool web - + - - + + - + - - @@ -22,24 +27,24 @@

Header 4

Header 5
Header 6
- + - +

Normal font

Mono font

Sans font

Custom font - Roboto

- -

Hey there! this is a test

+ +

Hey there! this is a test

This is bold This is italic actually, and it's pretty cool This is underline this is small this is marked this is code THIS IS A SPAN AND SHOULDNT BE ANY DIFFERENT - +

- Hello gang + Hello gang 

@@ -49,9 +54,9 @@ font, and it preserves
 both      spaces and
 line breaks
- +

- So + So

@@ -66,7 +71,7 @@ line breaks

🧪 CSS Properties Test

-
+

Opacity 75% with cursor pointer and z-index 10 - Text should show pointer cursor, not I-beam

@@ -89,9 +94,9 @@ line breaks

Cursor not-allowed - Text should show forbidden cursor

- + - +

🖱️ Cursor Inheritance Test

@@ -129,125 +134,126 @@ line breaks
border-blue-400
border-yellow-300
- + - - +