From 7fdcdc6557d29678aedf936829f3169e006987b7 Mon Sep 17 00:00:00 2001
From: Syndamia <kamen.d.mladenov@protonmail.com>
Date: Wed, 9 Mar 2022 14:07:44 +0200
Subject: Added simple functionality

---
 src/styles.css | 11 ++++++-----
 1 file changed, 6 insertions(+), 5 deletions(-)

(limited to 'src/styles.css')

diff --git a/src/styles.css b/src/styles.css
index 6f464fc..8aa539d 100644
--- a/src/styles.css
+++ b/src/styles.css
@@ -62,6 +62,10 @@ img {
   image-rendering: pixelated;
 }
 
+.btn:hover {
+  cursor: pointer;
+}
+
 img, hr {
   border: 1px solid black;
 }
@@ -155,10 +159,11 @@ h2 + p img, h3 + p img, h4 + p img, h5 + p img, h6 + p img, .about-p img {
   background-color: var(--link-tab-bg-hover-color);
 }
 
-#changeThemeButton {
+#changeThemeBtn {
   vertical-align: middle;
   margin-top: -0.2em;
   border: none !important;
+  display: none;
 }
 
 /* Index page styling */
@@ -402,10 +407,6 @@ code span {
   display: none;
 }
 
-#scrollBtn:hover {
-  cursor: pointer;
-}
-
 /* OpenSans font */
 
 @font-face {
-- 
cgit v1.3.1-23-gd82d


From 4803350c7591e3d2b28b1643383b80f9e3a9d64a Mon Sep 17 00:00:00 2001
From: Syndamia <kamen.d.mladenov@protonmail.com>
Date: Wed, 9 Mar 2022 14:24:05 +0200
Subject: Reorganized styles css

---
 src/styles.css | 24 +++++++++++++-----------
 1 file changed, 13 insertions(+), 11 deletions(-)

(limited to 'src/styles.css')

diff --git a/src/styles.css b/src/styles.css
index 8aa539d..78bd8e8 100644
--- a/src/styles.css
+++ b/src/styles.css
@@ -62,10 +62,6 @@ img {
   image-rendering: pixelated;
 }
 
-.btn:hover {
-  cursor: pointer;
-}
-
 img, hr {
   border: 1px solid black;
 }
@@ -159,13 +155,6 @@ h2 + p img, h3 + p img, h4 + p img, h5 + p img, h6 + p img, .about-p img {
   background-color: var(--link-tab-bg-hover-color);
 }
 
-#changeThemeBtn {
-  vertical-align: middle;
-  margin-top: -0.2em;
-  border: none !important;
-  display: none;
-}
-
 /* Index page styling */
 
 #index-contents-img {
@@ -377,6 +366,10 @@ code span {
 
 /* Script specific styling */
 
+.btn:hover {
+  cursor: pointer;
+}
+
 .clicked-image {
   position: absolute;
   width: 100vw;
@@ -404,6 +397,15 @@ code span {
   border: 1px solid;
   transition-duration: 0.5s;
   padding: 0.3em;
+}
+
+#changeThemeBtn {
+  vertical-align: middle;
+  margin-top: -0.2em;
+  border: none !important;
+}
+
+#scrollBtn, #changeThemeBtn {
   display: none;
 }
 
-- 
cgit v1.3.1-23-gd82d


From 77038e06e7be96986a1e07d51bc1c43e2ba74bb5 Mon Sep 17 00:00:00 2001
From: Syndamia <kamen.d.mladenov@protonmail.com>
Date: Wed, 9 Mar 2022 15:41:20 +0200
Subject: Moved most coloring in light and dark theme to root variables

---
 src/darkmode.css |  87 +++++++++-------------------------------
 src/styles.css   | 118 ++++++++++++++++++++++++++++++++++++++++---------------
 2 files changed, 105 insertions(+), 100 deletions(-)

(limited to 'src/styles.css')

diff --git a/src/darkmode.css b/src/darkmode.css
index e1b0a72..8e6583a 100644
--- a/src/darkmode.css
+++ b/src/darkmode.css
@@ -1,41 +1,25 @@
 :root {
+  --fg-color: #ffeede;
+  --bg-color: #262626;
+  --fg-selection-color: #001121;
+  --bg-selection-color: #81949f;
+  --border-color: #777;
+  --blockquote-color: #919191;
+  --blockquote-border-color: #919191;
+  --header-color: #d49408;
+  --link-tab-fg-color: #ffeede;
   --link-tab-bg-color: #464646;
   --link-tab-bg-hover-color: #d47408;
-  --bold-color: #d49408;
-}
-
-
-::-moz-selection {
-  color: #001121;
-  background: #81949f;
-}
-
-::selection {
-  color: #001121;
-  background: #81949f;
-}
-
-*,
-hr,
-article > table tr,
-article > table td,
-article > table th {
-  color: #ffeede;
-  border-color: #777;
-  background-color: #262626;
-}
-
-blockquote {
-  border-color: #919191;
-}
-
-blockquote * {
-  color: #919191;
-}
-
-h1, h2, h3, h4, h5, h6, b {
-  color: var(--bold-color);
-  border-color: #777;
+  --strong-color: #c35b5b;
+  --a-color: #b47494;
+  --a-hover-color: #da8db3;
+  --code-bg-color: #414141;
+  --pre-bg-color: #414141;
+  --em-color: #999908;
+  --td-border-color: #777;
+  --tr-bg-color: #262626;
+  --tr-border-color: #777;
+  --alternating-row-color: #323232;
 }
 
   /* This selects the link images, next to headings */
@@ -43,36 +27,3 @@ h2 + p img, h3 + p img, h4 + p img, h5 + p img, h6 + p img, .about-p img {
   /* Refer to styles.css on why this is necessary */
   filter: none; 
 }
-
-strong {
-  color: #c35b5b;
-}
-
-body > :not(nav) a, a strong {
-  color: #b47494;
-  border-bottom: 1px dashed;
-}
-
-body > :not(nav) a:hover, a strong:hover {
-  color: #da8db3;
-}
-
-pre, code {
-  background-color: #414141 !important;
-}
-
-i, em {
-  color: #999908;
-}
-
-table * {
-  background-color: inherit;
-}
-
-article > table tr:nth-child(2n) td {
-  background-color: #323232;
-}
-
-.link-tab {
-  color: #ffeede;
-}
diff --git a/src/styles.css b/src/styles.css
index 78bd8e8..c5629ae 100644
--- a/src/styles.css
+++ b/src/styles.css
@@ -1,6 +1,25 @@
 :root {
+  --fg-color: black;
+  --bg-color: white;
+  --fg-selection-color: white;
+  --bg-selection-color: #338fff;
+  --border-color: black;
+  --blockquote-color: #6a737d;
+  --blockquote-border-color: #dfe2e5;
+  --header-color: black;
+  --link-tab-fg-color: white;
   --link-tab-bg-color: #303030;
   --link-tab-bg-hover-color: #004080;
+  --strong-color: black;
+  --a-color: #004080;
+  --a-hover-color: #004080;
+  --code-bg-color: #e2e4e6;
+  --pre-bg-color: #f6f8fa;
+  --em-color: black;
+  --td-border-color: #dfe2e5;
+  --tr-bg-color: #fff;
+  --tr-border-color: #c6cbd1;
+  --alternating-row-color: #f6f8fa;
 }
 
 /* Custom scrollbar style */
@@ -21,10 +40,25 @@
   background: #555;
 }
 
+/* Custom mouse text selection colors */
+
+::-moz-selection {
+  color: var(--fg-selection-color);
+  background: var(--bg-selection-color);
+}
+
+::selection {
+  color: var(--fg-selection-color);
+  background: var(--bg-selection-color);
+}
+
 /* Global */
 
 body {
   min-height: calc(100vh - 16px);
+  color: var(--fg-color);
+  background-color: var(--bg-color);
+  border-color: var(--border-color);
 }
 
 body, td, th {
@@ -32,6 +66,11 @@ body, td, th {
   line-height: 1.5em;
 }
 
+h1, h2, h3, h4, h5, h6, b {
+  color: var(--header-color);
+  border-color: var(--border-color);
+}
+
 h1 {
   font-size: 1.7em;
   line-height: 1.2em;
@@ -45,7 +84,7 @@ h1 ~ h1 {
 h2 {
   font-size: 1.35em;
   padding-bottom: 0.25em;
-  border-bottom: 2px solid black;
+  border-bottom: 2px solid var(--border-color);
 }
 
 h3 {
@@ -63,12 +102,32 @@ img {
 }
 
 img, hr {
-  border: 1px solid black;
+  border: 1px solid var(--border-color);
+}
+
+strong {
+  color: var(--strong-color);
 }
 
 a {
   text-decoration: none;
-  color: var(--link-tab-bg-hover-color);
+}
+
+a * {
+  color: var(--fg-color);
+}
+
+body > :not(nav) a, a strong {
+  color: var(--a-color);
+  border-bottom: 1px dashed;
+}
+
+body > :not(nav) a:hover, a strong:hover {
+  color: var(--a-hover-color);
+}
+
+i, em {
+  color: var(--em-color);
 }
 
 article {
@@ -147,7 +206,7 @@ h2 + p img, h3 + p img, h4 + p img, h5 + p img, h6 + p img, .about-p img {
 .link-tab {
   font-weight: normal;
   padding: 10px;
-  color: white;
+  color: var(--link-tab-fg-color);
   background-color: var(--link-tab-bg-color);
 }
 
@@ -165,7 +224,7 @@ h2 + p img, h3 + p img, h4 + p img, h5 + p img, h6 + p img, .about-p img {
   #index-contents {
     display: flex;
     align-items: center;
-    justify-content: center;	
+    justify-content: center;
   }
 
   #index-contents-text {
@@ -183,8 +242,7 @@ h2 + p img, h3 + p img, h4 + p img, h5 + p img, h6 + p img, .about-p img {
 
 /* The following CSS is a modified version of sindresorhus's github-markdown-css repo: https://github.com/sindresorhus/github-markdown-css */
 
-code,
-pre {
+code, pre {
   font-family: monospace;
   font-size: 1em;
 }
@@ -193,20 +251,10 @@ code {
   padding: .2em .4em;
   margin: 0;
   font-size: 85%;
-  background-color: rgba(40,46,52,.5);
+  background-color: var(--code-bg-color);
   border-radius: 3px;
 }
 
-pre > code {
-  padding: 0;
-  margin: 0;
-  font-size: 100%;
-  word-break: normal;
-  white-space: pre;
-  background: transparent;
-  border: 0;
-}
-
 pre code {
   display: inline;
   max-width: auto;
@@ -215,7 +263,17 @@ pre code {
   overflow: visible;
   line-height: inherit;
   word-wrap: normal;
-  background-color: initial;
+  background-color: var(--code-bg-color);
+  border: 0;
+}
+
+pre > code {
+  padding: 0;
+  margin: 0;
+  font-size: 100%;
+  word-break: normal;
+  white-space: pre;
+  background-color: inherit;
   border: 0;
 }
 
@@ -224,7 +282,7 @@ pre {
   overflow: auto;
   font-size: 85%;
   line-height: 1.45;
-  background-color: #f6f8fa;
+  background-color: var(--pre-bg-color);
   border-radius: 3px;
   margin: 0;
   word-break: normal;
@@ -262,16 +320,16 @@ article > table th {
 article > table td,
 article > table th {
   padding: 6px 13px;
-  border: 1px solid #dfe2e5;
+  border: 1px solid var(--td-border-color);
 }
 
 article > table tr {
-  background-color: #fff;
-  border-top: 1px solid #c6cbd1;
+  background-color: var(--tr-bg-color);
+  border-top: 1px solid var(--tr-border-color);
 }
 
 article > table tr:nth-child(2n) {
-  background-color: #f6f8fa;
+  background-color: var(--alternating-row-color);
 }
 
 blockquote {
@@ -279,8 +337,8 @@ blockquote {
   margin-top: 0;
   margin-bottom: 16px;
   padding: 0 1em;
-  color: #6a737d;
-  border-left: .25em solid #dfe2e5;
+  color: var(--blockquote-color);
+  border-left: .25em solid var(--blockquote-border-color);
 }
 
 blockquote > :first-child {
@@ -304,7 +362,7 @@ blockquote > :last-child {
 }
 
 .contact-card-title, .contact-card-content {
-  background-color: #343434;
+  background-color: var(--alternating-row-color);
   padding: 0.7rem;
   line-height: 1.5rem;
 }
@@ -317,7 +375,7 @@ blockquote > :last-child {
 .contact-card-title {
   font-size: 1.2em;
   margin: 0em 0.4em;
-  color: var(--bold-color);
+  color: var(--header-color);
 }
 
 .contact-card-content {
@@ -328,10 +386,6 @@ blockquote > :last-child {
 
 /* Syntax highlighting (colours are inspired from gruvbox) */
 
-code span {
-  background-color: inherit;
-}
-
 .cst, .chr { /* Constant, Chars */
   color: #d787af;
 }
-- 
cgit v1.3.1-23-gd82d


From 7a2ff20e6ac78371264934f8dd30a134e9658db9 Mon Sep 17 00:00:00 2001
From: Syndamia <kamen.d.mladenov@protonmail.com>
Date: Wed, 9 Mar 2022 16:05:08 +0200
Subject: Updated header margins

---
 src/styles.css | 6 +++++-
 1 file changed, 5 insertions(+), 1 deletion(-)

(limited to 'src/styles.css')

diff --git a/src/styles.css b/src/styles.css
index c5629ae..a996be2 100644
--- a/src/styles.css
+++ b/src/styles.css
@@ -149,10 +149,14 @@ table code {
 h2, h3, h4, h5, h6, .about-header {
   display: inline-block;
   margin-block-start: 0.4em;
-  margin-block-end: 0.5em; /* Account for it being an inline block, as opposed to a normal block */
+  margin-block-end: 0.16em;
   line-height: 1.25em;
 }
 
+.about-header:first-child {
+  margin-block-start: 0.83em;
+}
+
 h2 + p, h3 + p, h4 + p, h5 + p, h6 + p, .about-p {
   display: inline;
 }
-- 
cgit v1.3.1-23-gd82d


From 8597d2432efde50be6b9b60f6e1e68e52086e5b0 Mon Sep 17 00:00:00 2001
From: Syndamia <kamen.d.mladenov@protonmail.com>
Date: Wed, 9 Mar 2022 16:06:39 +0200
Subject: Fixed clicked image background color

---
 src/styles.css | 1 +
 1 file changed, 1 insertion(+)

(limited to 'src/styles.css')

diff --git a/src/styles.css b/src/styles.css
index a996be2..f8a7dcf 100644
--- a/src/styles.css
+++ b/src/styles.css
@@ -440,6 +440,7 @@ blockquote > :last-child {
   top: 0;
   padding: 1em;
   z-index: 2;
+  background-color: var(--bg-color);
 }
 
 .body-on-clicked-image {
-- 
cgit v1.3.1-23-gd82d