UI update

css/main.css

@@ -15,7 +15,7 @@ html, body {
 }
 
 body {
-  --accent-color: #2353FF;
+  --accent-color: #304FFE;
   --light-shade: rgba(var(--text-color), 0.06);
   --text-color: 17, 17, 17;
   --text-color-light: 100, 100, 100;
@@ -28,7 +28,6 @@ body {
 }
 
 body[data-theme=dark] {
-  --accent-color: #2353FF;
   --green: #13ff5a;
   --text-color: 240, 240, 240;
   --text-color-light: 170, 170, 170;
@@ -464,7 +463,14 @@ ul {
   width: 2rem;
 }
 
+#torrent_tags {
+  font-size: 0.85rem;
+  margin-bottom: 0.3rem;
+  color: rgba(var(--text-color), 0.8);
+}
+
 #torrent_name {
+  font-size: 1.5rem;
   margin-bottom: 1rem;
 }
 
@@ -479,7 +485,7 @@ ul {
   background-color: var(--accent-color);
   width: 100%;
   justify-content: center;
-  padding: 1rem;
+  padding: 0.7rem;
 }
 #torrent_download_button .icon {
   fill: white;
@@ -515,6 +521,10 @@ ul {
   .torrent-card__download-button {
     margin-top: 1rem;
   }
+
+  #torrent_tags {
+    font-size: 0.7rem;
+  }
 }
 @media only screen and (min-width: 640px) {
   .popup__header {

css/main.scss

@@ -12,7 +12,7 @@ html, body{
     scroll-behavior: smooth;
 }
 body {
-    --accent-color: #2353FF;
+    --accent-color: #304FFE;
     --light-shade: rgba(var(--text-color), 0.06);
     --text-color: 17, 17, 17;
     --text-color-light: 100, 100, 100;
@@ -24,7 +24,7 @@ body {
     background: var(--background-color);
 }
 body[data-theme='dark']{
-    --accent-color: #2353FF;
+    // --accent-color: #2353FF;
     --green: #13ff5a;
     --text-color: 240, 240, 240;
     --text-color-light: 170, 170, 170;
@@ -406,7 +406,13 @@ ul{
         width: 2rem;
     }
 }
+#torrent_tags{
+    font-size: 0.85rem;
+    margin-bottom: 0.3rem;
+    color: rgba(var(--text-color), 0.8);
+}
 #torrent_name{
+    font-size: 1.5rem;
     margin-bottom: 1rem;
 }
 #torrent__description{
@@ -419,7 +425,7 @@ ul{
     background-color: var(--accent-color);
     width: 100%;
     justify-content: center;
-    padding: 1rem;
+    padding: 0.7rem;
     .icon{
         fill: white;
     }
@@ -452,6 +458,9 @@ ul{
             margin-top: 1rem;
         }
     }
+    #torrent_tags{
+        font-size: 0.7rem;
+    }
 }
 @media only screen and (min-width: 640px) {
     .popup__header{

index.html

@@ -6,7 +6,7 @@
     <meta http-equiv="X-UA-Compatible" content="IE=edge">
     <meta name="viewport" content="width=device-width, initial-scale=1.0">
     <title>FLO Torrent</title>
-    <link rel="stylesheet" href="css/main.css">
+    <link rel="stylesheet" href="css/main.min.css">
     <link rel="preconnect" href="https://fonts.gstatic.com">
     <link href="https://fonts.googleapis.com/css2?family=Inter:wght@400..900&display=swap" rel="stylesheet">
 </head>