feat: Changes to style and logic for ui parts

- Update hippie styles
- Move top element for new page to header macro
- Reassign ui and example collections

source/style/hippie-style

@@ -1 +1 @@
-Subproject commit a1a4bd408bedaa11f5e1aacca630d0b1bbbe7aa2
+Subproject commit 3eab0f095603236be4519081203e51bc2916801e

source/style/modules/ui/_drag_module.scss

@@ -1,18 +1,17 @@
 .body_drag {
-	height: 100vh;
-	// padding: $space_basic;
+	@extend .body_ui;
 
 	button {
-		@extend .io_button;
+		@extend .button_io;
 		position: fixed;
 		top: 8px;
 		right: 8px;
 		margin: 0;
 	}
-}
 
-#space {
-	position: relative;
-	height: 100%;
-	background-color: $color-dark;
+	#space {
+		position: relative;
+		height: 100%;
+		background-color: $color-dark;
+	}
 }

source/style/modules/ui/_form_module.scss

@@ -1,13 +1,8 @@
-.body_form {
-	margin: 0;
-	background-color: $color-dark;
-}
-
 #head {
 	// display: flex;
 
 	button {
-			@extend .io_button;
+			@extend .button_io;
 	}
 
 	h1 {

source/style/modules/ui/_settings_module.scss

@@ -1,9 +1,3 @@
-$module_top_height: 32px;
-
-.body_ui {
-	height: 100vh;
-}
-
 #frame {
 	position: relative;
 	height: 100%;

source/style/ui.scss

@@ -1,21 +1,11 @@
 @use "sass:map";
 
+$color_text_basic: white;
+$color_head_basic: white;
+
 @import "demo_config";
 @import "hippie-style/hippie";
 
-$z-indexes: (
-	"default": 0,
-	"content-bottom": 1,
-	"content-low": 2,
-	"content-med": 3,
-	"content-high": 4,
-	"content-top": 10,
-	"modal-low": 11,
-	"modal-med": 12,
-	"modal-high": 13,
-	"toast": 100
-);
-
 .op_show {
 	transition: $transition_show;
 }
@@ -34,6 +24,10 @@ $z-indexes: (
 	}
 }
 
+.body_ui {
+	height: 100vh;
+}
+
 .step {
 	@extend %full_parent;
 }