Button structure was redesigned

git-user-cpp · Jul 8, 2023 · ec7702d · ec7702d
1 parent c2e7791
commit ec7702d
Show file tree

Hide file tree

Showing 2 changed files with 35 additions and 23 deletions.
diff --git a/src/desktop/main_menu.rs b/src/desktop/main_menu.rs
@@ -30,24 +30,30 @@ use crate::desktop::impl_options::products::insert_product;
 
 fn main_options(cx: Scope) -> Element {
 	cx.render(rsx! {
-		ul {
-			Link {
-				to: "/insert_information", "Insert information"
+		div {
+			button {
+				Link {
+					id: "option",
+					to: "/insert_information", "Insert information"
+				}
 			}
-		}
-		ul {
-			Link {
-				to: "/show_list", "Show information"
+			button {
+				Link {
+					id: "option",
+					to: "/show_list", "Show information"
+				}
 			}
-		}
-		ul {
-			Link {
-				to: "/show_calculations", "Show calculations"
+			button {
+				Link {
+					id: "option",
+					to: "/show_calculations", "Show calculations"
+				}
 			}
-		}
-		ul {
-			Link {
-				to: "/information", "Information"
+			button {
+				Link {
+					id: "option",
+					to: "/information", "Information"
+				}
 			}
 		}
     })

diff --git a/src/desktop/style/dark_theme.css b/src/desktop/style/dark_theme.css
@@ -20,25 +20,31 @@ div {
     font-weight: bold;
     margin-top: 10px;
     margin-bottom: 10px;
-    display: grid;
-    align-items: center;
-    justify-content: center;
 }
 
-ul {
+#option {
+    margin: auto;
+    padding: auto;
+    text-decoration: none;
+}
+
+button {
+    display: inline;
     border: 0;
-    width: 300px;
+    height: 30px;
+    width: 180px;
     line-height: 2.5;
-    margin-right: 10px;
-    padding: 0 20px;
+    margin-right: 5px;
+    margin-left: 5px;
     font-size: 1rem;
     font-weight: bold;
     text-align: center;
+    align-items: center;
     border-radius: 10px;
     background: #87CEFA;
     box-shadow: inset 2px 2px 3px rgba(255, 255, 255, 0.6), inset -2px -2px 3px rgba(0, 0, 0, 0.6);
 }
 
-ul:active {
+button:active {
     box-shadow: inset -2px -2px 3px rgba(255, 255, 255, 0.6), inset 2px 2px 3px rgba(0, 0, 0, 0.6);
 }