From 6c6dc7e0f88d44984cd2f05eb5d63d5c036bba2a Mon Sep 17 00:00:00 2001
From: Flummi <flummi@f0ck.space>
Date: Tue, 25 May 2021 14:42:28 +0200
Subject: [PATCH] css lul

---
 public/s/css/f0ck.css | 56 ++++++++++++++++++++++++++++++++++++++++++-
 public/s/css/v0ck.css |  5 ++--
 2 files changed, 57 insertions(+), 4 deletions(-)

diff --git a/public/s/css/f0ck.css b/public/s/css/f0ck.css
index ad7c5c1..eacc4ff 100644
--- a/public/s/css/f0ck.css
+++ b/public/s/css/f0ck.css
@@ -898,6 +898,11 @@ span#tags {
   padding-top: 1.5px;
   padding-bottom: 1.5px;
 }
+.badge-greentext {
+  color: #789922;
+  text-shadow: inherit !important;
+  background-color: #252525;
+}
 
 .about {
   padding: 10px;
@@ -1067,7 +1072,7 @@ body[type='login'] {
 /* visualizer */
 canvas {
   position: absolute;
-  top: 0;
+  top: 1px; /* This removes the ugly 1px line seen at the bottom when you hover over the audio element */
   left: 0;
   bottom: 0;
   right: 0;
@@ -1075,3 +1080,52 @@ canvas {
   width: 100%;
   pointer-events: none;
 }
+
+/* tags */
+span#tags {
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  flex-wrap: wrap;
+  line-height: 1.4;
+}
+
+span#tags > span {
+  display: inline-block;
+  margin-top: 2.5px;
+  margin-bottom: 2.5px;
+}
+
+span#tags > span > input {
+  padding: 0;
+  margin: 0;
+  border: none;
+  color: #fff;
+  background-color: var(--badge-tag);
+}
+
+/* toasts */
+div#flash {
+  position: fixed;
+  bottom: -28px;
+  z-index: 999;
+  left: 0;
+  width: 100%;
+  text-align: center;
+  font-weight: bold;
+}
+div#flash.error {
+  background-color: #fddfdf;
+  border-bottom: 2px solid #f1a899;
+  color: #5f3f3f;
+}
+div#flash.success {
+  background-color: #4caf50;
+  border-bottom: 2px solid #006018;
+  color: #001c07;
+}
+div#flash.warn {
+  background-color: #fffa90;
+  border-bottom: 2px solid #dad55e;
+  color: #777620;
+}
diff --git a/public/s/css/v0ck.css b/public/s/css/v0ck.css
index 77da1e8..37be399 100644
--- a/public/s/css/v0ck.css
+++ b/public/s/css/v0ck.css
@@ -111,7 +111,7 @@ svg {
   flex-basis: 100%;
   height: 5px;
   transition: height 0.4s;
-  background: rgba(0, 0, 0, 0.5);
+  background: rgb(23 23 23);
   cursor: pointer;
 }
 
@@ -185,8 +185,7 @@ svg {
 }
 
 @media (max-width: 900px) {
-  .v0ck_player_controls > input[type="range"][name="volume"],
-  .v0ck_player_button.v0ck_volume {
+  .v0ck_player_controls > input[type="range"][name="volume"] {
     display: none;
   }
 }