feat: Change styles and ui

- Change to hippie styles
- Remove unused styles and components
- Change colors for ui pages

source/style/hippie-style

@@ -1 +1 @@
-Subproject commit 2f63dbe2b65ddb320c0a7ea186f04a9c3698c9e7
+Subproject commit 35b55de55002b4a13d7f0530b326f5e2a569bbb1

source/style/modules/ui/_drag_module.scss

@@ -1,9 +1,4 @@
-.body_drag {
-	@extend .body_ui;
-
-	#space {
-		position: relative;
-		height: 100%;
-		background-color: $color-dark;
-	}
+#space {
+	position: relative;
+	height: 100%;
 }

source/style/modules/ui/_new_module.scss

@@ -1,11 +1,13 @@
 $module_top_height: 32px;
+$body_top_space: $module_top_height + $space_basic;
 
 .body_new {
-	height: 100vh;
-	padding: $module_top_height + $space_basic $space_basic $space_basic;
+	@extend .body_ui;
+	
+	padding: $body_top_space $space_basic $space_basic;
 }
 
-.container {
+#frame {
 	display: grid;
 	height: 100%;
 	// margin: $space_basic;

source/style/modules/ui/_settings_module.scss

@@ -7,7 +7,15 @@
 	}
 }
 
+.body_setting {
+	@extend .body_ui;
+
+	background-color: $color_back_basic;
+}
+
 #frame {
+	@extend %flex-column;
+
 	position: relative;
 	height: 100%;
 
@@ -22,23 +30,16 @@
 	}
 
 	main {
+		@extend %flex-row;
+
+		flex: 1;
+
 		aside {
 			background-color: $color_brighter;
 		}
-	}
-}
 
-.frame-flex {
-	display: flex;
-	flex-direction: column;
-	gap: $space_basic;
-
-	main {
-		flex: 1;
-
-		aside,
 		section {
-			height: 100%;
+			flex: 1;
 		}
 	}
 }

source/style/ui.scss

@@ -1,11 +1,10 @@
 @use "sass:map";
 
-$color_text_basic: white;
-$color_head_basic: white;
-
 @import "demo_config";
 @import "hippie-style/hippie";
 
+$color_gui_back: $color_dark;
+
 .op_show {
 	transition: $transition_show;
 }
@@ -20,12 +19,12 @@ $color_head_basic: white;
 	body {
 		position: relative;
 		min-height: 100%;
-		background-color: black;
 	}
 }
 
 .body_ui {
 	height: 100vh;
+	background-color: $color_gui_back;
 }
 
 .step {