Make page not look shit

static/css/toast.sass

@@ -0,0 +1,89 @@
+@keyframes toastTimeout
+    0%
+        left: -100%
+    100%
+        left: 0%
+    
+.toast-container
+    margin: 0
+    padding: 0
+
+    width: 100%
+    height: auto
+    max-width: 400px
+
+    position: fixed
+    bottom: 0.5rem
+    left: 50%
+    transform: translateX(-50%)
+
+    display: flex
+    flex-direction: column
+    gap: 0.5rem
+
+    font-size: 1rem
+    font-weight: 500
+    line-height: 1
+    text-align: center
+
+    z-index: 9999
+
+.toast
+    margin: 0
+    padding: 0.5rem 1rem
+
+    min-height: 2.5rem
+
+    position: relative
+
+    display: flex
+    justify-content: center
+    align-items: center
+
+    transform: scaleY(0)
+
+    color: $white
+    background-color: $dark
+    border-radius: 2px
+
+    opacity: 0
+
+    transition: all 0.3s ease-in-out
+    overflow: hidden
+
+    &:hover
+        cursor: pointer
+
+.toast-show
+    opacity: 1
+    transform: scaleY(1)
+
+.toast-hide
+    opacity: 0
+    tansform: translateY(5rem)
+
+.toast-time
+    margin: 0
+    padding: 0
+
+    width: 100%
+    height: 2px
+
+    position: absolute
+    bottom: 0
+    left: 0%
+
+    background-color: $primary
+
+    animation: toastTimeout 5s linear forwards
+
+@media (max-width: 669px)
+    .toast-container
+        padding: 0.5rem
+
+        width: 100%
+        max-width: 100%
+
+        bottom: 0
+        left: 0
+        transform: none