dialogue box UI update (#4330)

Author: Commanderk3

css/activities.css

@@ -29,11 +29,27 @@
 }
 
 .modal-content {
+  position: fixed;
+  top: 50%;
+  left: 50%;
+  transform: translate(-50%, -50%);
+  width: 400px;
+  padding: 24px;
   background-color: #fefefe;
-  margin: 15% auto;
-  padding: 20px;
-  border: 1px solid #888;
-  width: 50%;
+  box-shadow: rgba(0, 0, 0, 0.2) 0px 4px 8px;
+  border-radius: 8px;
+  z-index: 10000;
+  text-align: left;
+}
+
+#submitLilypond {
+  background-color: rgb(0, 102, 255);
+  border: none;
+  border-radius: 4px;
+  padding: 8px 16px;
+  font-weight: bold;
+  cursor: pointer;
+  margin-right: 16px;
 }
 
 .close {

css/darkmode.css

@@ -54,4 +54,11 @@
     color: #fff;
 }
 
+.dark-mode .modal-content {
+    background-color: #1c1c1c;
+    color: #fff;
+}
 
+.dark-mode #submitLilypond {
+    background-color: rgb(0, 102, 255);
+}