tabs, search bar

Icons/arrow-left.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="#ffffff" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-arrow-left-icon lucide-arrow-left"><path d="m12 19-7-7 7-7"/><path d="M19 12H5"/></svg>

Icons/arrow-left.svg.import

@@ -0,0 +1,37 @@
+[remap]
+
+importer="texture"
+type="CompressedTexture2D"
+uid="uid://bp42ccs2nmbmw"
+path="res://.godot/imported/arrow-left.svg-6665bd65bdc7655f58ffd2c77101e033.ctex"
+metadata={
+"vram_texture": false
+}
+
+[deps]
+
+source_file="res://Icons/arrow-left.svg"
+dest_files=["res://.godot/imported/arrow-left.svg-6665bd65bdc7655f58ffd2c77101e033.ctex"]
+
+[params]
+
+compress/mode=0
+compress/high_quality=false
+compress/lossy_quality=0.7
+compress/hdr_compression=1
+compress/normal_map=0
+compress/channel_pack=0
+mipmaps/generate=false
+mipmaps/limit=-1
+roughness/mode=0
+roughness/src_normal=""
+process/fix_alpha_border=true
+process/premult_alpha=false
+process/normal_map_invert_y=false
+process/hdr_as_srgb=false
+process/hdr_clamp_exposure=false
+process/size_limit=0
+detect_3d/compress_to=1
+svg/scale=1.0
+editor/scale_with_editor_scale=false
+editor/convert_colors_with_editor_theme=false

Icons/arrow-right.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="#ffffff" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-arrow-right-icon lucide-arrow-right"><path d="M5 12h14"/><path d="m12 5 7 7-7 7"/></svg>

Icons/arrow-right.svg.import

@@ -0,0 +1,37 @@
+[remap]
+
+importer="texture"
+type="CompressedTexture2D"
+uid="uid://dyyylow47qd0k"
+path="res://.godot/imported/arrow-right.svg-952a316afcd4823b2076bf76a665b17d.ctex"
+metadata={
+"vram_texture": false
+}
+
+[deps]
+
+source_file="res://Icons/arrow-right.svg"
+dest_files=["res://.godot/imported/arrow-right.svg-952a316afcd4823b2076bf76a665b17d.ctex"]
+
+[params]
+
+compress/mode=0
+compress/high_quality=false
+compress/lossy_quality=0.7
+compress/hdr_compression=1
+compress/normal_map=0
+compress/channel_pack=0
+mipmaps/generate=false
+mipmaps/limit=-1
+roughness/mode=0
+roughness/src_normal=""
+process/fix_alpha_border=true
+process/premult_alpha=false
+process/normal_map_invert_y=false
+process/hdr_as_srgb=false
+process/hdr_clamp_exposure=false
+process/size_limit=0
+detect_3d/compress_to=1
+svg/scale=1.0
+editor/scale_with_editor_scale=false
+editor/convert_colors_with_editor_theme=false

Icons/rotate-cw.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="#ffffff" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-rotate-cw-icon lucide-rotate-cw"><path d="M21 12a9 9 0 1 1-9-9c2.52 0 4.93 1 6.74 2.74L21 8"/><path d="M21 3v5h-5"/></svg>

Icons/rotate-cw.svg.import

@@ -0,0 +1,37 @@
+[remap]
+
+importer="texture"
+type="CompressedTexture2D"
+uid="uid://cu4hjoba6etf"
+path="res://.godot/imported/rotate-cw.svg-868e19f6bcf83d62897eb2ac44a0b471.ctex"
+metadata={
+"vram_texture": false
+}
+
+[deps]
+
+source_file="res://Icons/rotate-cw.svg"
+dest_files=["res://.godot/imported/rotate-cw.svg-868e19f6bcf83d62897eb2ac44a0b471.ctex"]
+
+[params]
+
+compress/mode=0
+compress/high_quality=false
+compress/lossy_quality=0.7
+compress/hdr_compression=1
+compress/normal_map=0
+compress/channel_pack=0
+mipmaps/generate=false
+mipmaps/limit=-1
+roughness/mode=0
+roughness/src_normal=""
+process/fix_alpha_border=true
+process/premult_alpha=false
+process/normal_map_invert_y=false
+process/hdr_as_srgb=false
+process/hdr_clamp_exposure=false
+process/size_limit=0
+detect_3d/compress_to=1
+svg/scale=1.0
+editor/scale_with_editor_scale=false
+editor/convert_colors_with_editor_theme=false

Icons/search.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="#ffffff" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-search-icon lucide-search"><path d="m21 21-4.34-4.34"/><circle cx="11" cy="11" r="8"/></svg>

Icons/search.svg.import

@@ -0,0 +1,37 @@
+[remap]
+
+importer="texture"
+type="CompressedTexture2D"
+uid="uid://bf0vx7qwo28k6"
+path="res://.godot/imported/search.svg-597dbc74e85ee7dfea046ab610b3d4ad.ctex"
+metadata={
+"vram_texture": false
+}
+
+[deps]
+
+source_file="res://Icons/search.svg"
+dest_files=["res://.godot/imported/search.svg-597dbc74e85ee7dfea046ab610b3d4ad.ctex"]
+
+[params]
+
+compress/mode=0
+compress/high_quality=false
+compress/lossy_quality=0.7
+compress/hdr_compression=1
+compress/normal_map=0
+compress/channel_pack=0
+mipmaps/generate=false
+mipmaps/limit=-1
+roughness/mode=0
+roughness/src_normal=""
+process/fix_alpha_border=true
+process/premult_alpha=false
+process/normal_map_invert_y=false
+process/hdr_as_srgb=false
+process/hdr_clamp_exposure=false
+process/size_limit=0
+detect_3d/compress_to=1
+svg/scale=1.0
+editor/scale_with_editor_scale=false
+editor/convert_colors_with_editor_theme=false

Scenes/main.tscn

@@ -1,6 +1,24 @@
-[gd_scene load_steps=2 format=3 uid="uid://bytm7bt2s4ak8"]
+[gd_scene load_steps=10 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://dioe63fr47oq7" path="res://Scripts/youtube.png" id="2_bo1nx"]
+[ext_resource type="Texture2D" uid="uid://bf0vx7qwo28k6" path="res://Icons/search.svg" id="3_8gbba"]
+[ext_resource type="Texture2D" uid="uid://bp42ccs2nmbmw" path="res://Icons/arrow-left.svg" id="3_21xkr"]
+[ext_resource type="Texture2D" uid="uid://dyyylow47qd0k" path="res://Icons/arrow-right.svg" id="4_6bp64"]
+[ext_resource type="Texture2D" uid="uid://cu4hjoba6etf" path="res://Icons/rotate-cw.svg" id="5_344ge"]
+
+[sub_resource type="StyleBoxEmpty" id="StyleBoxEmpty_8gbba"]
+
+[sub_resource type="StyleBoxFlat" id="StyleBoxFlat_8gbba"]
+corner_radius_top_left = 9
+corner_radius_top_right = 9
+corner_radius_bottom_right = 9
+corner_radius_bottom_left = 9
+expand_margin_left = 35.0
+
+[sub_resource type="Theme" id="Theme_jjvhh"]
+LineEdit/styles/focus = SubResource("StyleBoxEmpty_8gbba")
+LineEdit/styles/normal = SubResource("StyleBoxFlat_8gbba")
 
 [node name="Control" type="Control"]
 layout_mode = 3
@@ -12,6 +30,7 @@ grow_vertical = 2
 script = ExtResource("1_8q3xr")
 
 [node name="ColorRect" type="ColorRect" parent="."]
+visible = false
 layout_mode = 1
 anchors_preset = 15
 anchor_right = 1.0
@@ -35,9 +54,15 @@ grow_vertical = 2
 layout_mode = 2
 
 [node name="Button" type="Button" parent="VBoxContainer/HFlowContainer"]
-custom_minimum_size = Vector2(50, 40)
+custom_minimum_size = Vector2(250, 40)
 layout_mode = 2
-text = "hello world"
+theme_override_colors/font_color = Color(1, 1, 1, 1)
+theme_override_constants/h_separation = 8
+text = "(2) YouTube - Home Page testing"
+icon = ExtResource("2_bo1nx")
+alignment = 0
+text_overrun_behavior = 3
+expand_icon = true
 
 [node name="Button2" type="Button" parent="VBoxContainer/HFlowContainer"]
 custom_minimum_size = Vector2(50, 40)
@@ -53,3 +78,41 @@ text = "hello world"
 custom_minimum_size = Vector2(50, 40)
 layout_mode = 2
 text = "hello world"
+
+[node name="HSeparator" type="HSeparator" parent="VBoxContainer"]
+layout_mode = 2
+
+[node name="HBoxContainer" type="HBoxContainer" parent="VBoxContainer"]
+layout_mode = 2
+
+[node name="BackButton" type="Button" parent="VBoxContainer/HBoxContainer"]
+layout_mode = 2
+icon = ExtResource("3_21xkr")
+
+[node name="ForwardButton" type="Button" parent="VBoxContainer/HBoxContainer"]
+layout_mode = 2
+icon = ExtResource("4_6bp64")
+
+[node name="ReloadButton" type="Button" parent="VBoxContainer/HBoxContainer"]
+layout_mode = 2
+icon = ExtResource("5_344ge")
+
+[node name="Control" type="Control" parent="VBoxContainer/HBoxContainer"]
+custom_minimum_size = Vector2(32, 0)
+layout_mode = 2
+
+[node name="LineEdit" type="LineEdit" parent="VBoxContainer/HBoxContainer"]
+layout_mode = 2
+size_flags_horizontal = 3
+theme = SubResource("Theme_jjvhh")
+placeholder_text = "Search or enter web address"
+caret_blink = true
+
+[node name="TextureRect" type="TextureRect" parent="VBoxContainer/HBoxContainer/LineEdit"]
+layout_mode = 2
+offset_left = -27.0
+offset_right = -3.0
+offset_bottom = 37.0
+scale = Vector2(0.85, 0.85)
+texture = ExtResource("3_8gbba")
+stretch_mode = 5

Scripts/youtube.png.import

@@ -0,0 +1,34 @@
+[remap]
+
+importer="texture"
+type="CompressedTexture2D"
+uid="uid://dioe63fr47oq7"
+path="res://.godot/imported/youtube.png-5feacc6342e9a438cbbd6a63702ea1ce.ctex"
+metadata={
+"vram_texture": false
+}
+
+[deps]
+
+source_file="res://Scripts/youtube.png"
+dest_files=["res://.godot/imported/youtube.png-5feacc6342e9a438cbbd6a63702ea1ce.ctex"]
+
+[params]
+
+compress/mode=0
+compress/high_quality=false
+compress/lossy_quality=0.7
+compress/hdr_compression=1
+compress/normal_map=0
+compress/channel_pack=0
+mipmaps/generate=false
+mipmaps/limit=-1
+roughness/mode=0
+roughness/src_normal=""
+process/fix_alpha_border=true
+process/premult_alpha=false
+process/normal_map_invert_y=false
+process/hdr_as_srgb=false
+process/hdr_clamp_exposure=false
+process/size_limit=0
+detect_3d/compress_to=1