Simplify UI

web/index.css

@@ -9,6 +9,7 @@
     align-items: center;
     justify-content: space-around;
     flex-direction: column;
+    gap: 0.5rem;
     flex: 25%;
     overflow: scroll;
 }
@@ -17,23 +18,47 @@
     flex: 75%;
 }
 
+:root {
+    --collage-ap: 110 / 85;
+}
+
 .image-surface {
     overflow: hidden;
     margin: auto;
     border: 1px solid;
     height: 100%;
     width: auto;
-    --collage-ap: 110 / 85;
     aspect-ratio: var(--collage-ap);
 }
-.showbuton {
-    font-size: 2rem;
+
+.main-controls {
+    display: flex;
+    gap: 0.5rem;
+}
+
+.main-controls button {
+    font-size: 1.2rem;
+}
+
+#notice_dialog {
+    z-index: 10;
+    width: 50%;
+    background-color: lightblue;
+}
+
+#notice_dialog form {
+    display: flex;
+}
+
+#notice_dialog button {
+    font-size: 1.2rem;
+    margin-left: auto;
 }
 
 .templates {
     display: flex;
     flex-wrap: wrap;
-    gap: 1rem;
+    gap: 0.5rem;
     width: 80%;
 }
 
@@ -44,11 +69,12 @@
 }
 
 #page_size_selector {
-    width: 100%;
+    font-size: 1.2rem;
+    width: 80%;
 }
 
 .template {
-height: 100%;
+    aspect-ratio: var(--collage-ap);
 }
 
 .template-selected {