From 8abd8517ed0e51a822741c66ef43bea00e83d695 Mon Sep 17 00:00:00 2001
From: Ashley <iamashley@duck.com>
Date: Sat, 3 Dec 2022 11:37:44 +0000
Subject: [PATCH] variable

---
 css/poketube.css | 49 ++++++++++++++++++++++++++++--------------------
 1 file changed, 29 insertions(+), 20 deletions(-)

diff --git a/css/poketube.css b/css/poketube.css
index 1ade9947..293cf759 100644
--- a/css/poketube.css
+++ b/css/poketube.css
@@ -18,12 +18,26 @@
     along with this program. If not, see https://www.gnu.org/licenses/.
 
 */
-   :root {
+ :root {
+    /* text */
     --text-link: #0ab7f0;
     --text-link-visited: #00c0ff;
-    --text: #ffffff;
+    --text-color: #ffffff;
+    --text-font-primary:'PokeTube Flex';
+    --text-header-weight:1000;
+      
+    /* Divs */
+    --div-gradient: linear-gradient(
+    135deg,
+    #f97794 10%,
+    #623aa2 100%,
+    #8e6f7e 100%
+  );
+   --div-border-color:#7c44a0;
+   --div-prim-bg:#1c1c1c;
+   --div-second-bg:#1a1a1a;
+   --div-transparent-bg:#0009;
 }
-  
 
 
 a.class:hover {
@@ -46,7 +60,7 @@ a {
 }
 
 .video > .info > .title {
-  font-family: "PokeTube flex";
+  font-family: var(--text-font-primary);
   width: 10em;
 }
 
@@ -66,14 +80,14 @@ a {
   font-weight: 600;
   margin-top: 1em !important;
   border-radius: 21px;
-  background: #1c1c1c;
+  background: var(--div-prim-bg);
   padding: 10px;
   margin-bottom: 20px;
   font-stretch: expanded;
   justify-self: center;
   width: 39em;
-  font-family: "PokeTube Flex";
-  border: #7c44a0;
+  font-family: var(--text-font-primary);
+  border: var(--div-border-color);
   border-style: solid;
   margin-left: auto;
   margin-right: auto;
@@ -81,14 +95,14 @@ a {
 }
 
 .video-sub-info.description > .video-title {
-  font-family: "PokeTube Flex";
+  font-family: var(--text-font-primary);
   font-weight: 1000;
   font-stretch: extra-expanded;
   font-size: larger;
 }
 
 .recommended-list {
-  background-color: #1c1c1c;
+  background-color: var(--div-prim-bg);
   border-radius: 25px;
   margin: 10px;
   margin-top: 0px;
@@ -97,7 +111,7 @@ a {
   justify-self: center;
   margin-right: -1.5em;
   /* width: min-content;*/
-  border: #7c44a0;
+  border: var(--div-border-color);
   border-style: solid;
   max-width: 371px;
   width: max-content;
@@ -110,12 +124,7 @@ a {
 .video-info-panel.gradient {
   padding: 12px;
   border-radius: 11px;
-  background-image: linear-gradient(
-    135deg,
-    #f97794 10%,
-    #623aa2 100%,
-    #8e6f7e 100%
-  );
+  background-image: var(--div-gradient);
   display: block;
   margin: 0px 0 0px -3px;
   justify-self: left;
@@ -124,7 +133,7 @@ a {
 .video-info-pill-channelname {
   color: #fff;
   word-wrap: break-word;
-  font-family: "PokeTube Flex";
+  font-family: var(--text-font-primary);
   font-weight: 1000;
   font-stretch: ultra-expanded;
   overflow: hidden;
@@ -220,12 +229,12 @@ a {
 }
 
 .comments-class-or-something-i-cant-find-a-name-lol {
-  background: #1a1a1a;
+  background: var(--div-second-bg);
   border-radius: 30px;
   padding: 10px;
   padding-top: 0;
   margin: auto;
-  border: #7c44a0;
+  border: var(--div-border-color);
   border-style: solid;
 }
 
@@ -248,7 +257,7 @@ a {
   color: #fff;
   padding: 2px;
   border-radius: 3px;
-  font-family: PokeTube Flex;
+  font-family: var(--text-font-primary);
   font-stretch: 100%;
   font-weight: 600;
 }