Merge pull request #81 from MercuryWorkshop/workstore

Seamless Ui

src/Launcher.css

@@ -9,15 +9,18 @@
 }
 
 #launcher-button {
-    background-color: gray;
-    opacity: 0.5;
+    background: rgba(255, 255, 255, 0.1);
+
     border-radius: 50%;
-    height: 38px;
-    width: 38px;
+    height: 42px;
+    width: 42px;
 }
 
 #launcher-button img {
     border-radius: 50%;
+    height: 15px;
+    width: 15px;
+    opacity: 100;
 }
 .hw-screen {
     height: 100%;

src/Launcher.tsx

@@ -5,10 +5,10 @@ class Launcher {
             width: min(70%, 35em);
             height: min(60%, 30em);
             background-color: rgba(22, 22, 22, 0.8);
+            border: 1px solid rgba(0, 0, 0, 0.3);
 
-            border: 2px solid rgba(22, 22, 22, 0.6);
             border-radius: 1em;
-            bottom: 5.25em;
+            bottom: 4.25em;
             backdrop-filter: blur(5px);
             display: flex;
             flex-direction: column;

src/Notifications.css

@@ -9,17 +9,19 @@
 .notif {
     position: relative;
     font-family: "Roboto";
-    background-color: rgba(28, 28, 28, 0.85);
+    background-color: rgba(22, 22, 22, 0.8);
     border-radius: 7px;
     color: white;
     min-height: 115px;
     width: 400px;
     cursor: pointer;
     margin: 10px;
-    left: 500px;
+    left: 525px;
     animation: slideIn 0.5s ease-in-out forwards;
     opacity: 1;
     transition: 350ms ease-in-out;
+    border: 1px solid rgba(0, 0, 0, 1);
+    box-shadow: inset 0 0 0 1px #3e3e3e;
 }
 
 @keyframes slideIn {
@@ -55,12 +57,13 @@
     padding-top: 10px;
     padding-left: 10px;
     padding-bottom: 10px;
-    font-size: 18px;
+    font-size: 16px;
 }
 .notif-title {
-    font-size: 24px;
+    font-size: 18px;
     padding-left: 10px;
     padding-top: 10px;
+    font-weight: bold;
 }
 .notif-close-indicator {
     position: absolute;

src/Taskbar.css

@@ -47,15 +47,15 @@
     background-color: rgba(255, 255, 255, 0.15);
     aspect-ratio: 1/1;
     padding: 0.1em;
-    padding-left: 1em;
+    padding-left: 1.5em;
 
-    padding-right: 1em;
+    padding-right: 1.5em;
     /* width: 5em; */
-    right: 1em;
+    right: 0.3em;
     top: 50%;
     transform: translateY(-50%);
 
-    border-radius: 1em;
+    border-radius: 25px;
     display: flex;
     align-items: center;
     justify-content: center;

src/anura.css

@@ -40,8 +40,10 @@ footer {
     width: 100%;
     border-top-left-radius: 25px;
     border-top-right-radius: 25px;
+    /* background-color: rgba(0, 0, 0, 0.55); */
     background-color: rgba(22, 22, 22, 0.8);
-    border: 2px solid rgba(22, 22, 22, 0.6);
+    border: 1px solid rgba(0, 0, 0, 0.3);
+    box-shadow: inset 0 0 0 1px #3e3e3e;
     border-bottom: none;
     backdrop-filter: blur(5px);
 }