Merge branch 'development'

Author: leviarista

js/banner.js

@@ -12,7 +12,6 @@ const {
 } = getMainElements();
 
 function updateBanner(theme) {
-    console.table(theme);
     console.log('•ᴗ• Updating Banner ...');
     applyTheme(theme);
     if (!theme.ignoreSave) saveTheme(theme);
@@ -251,8 +250,9 @@ function updateUIOptions({
 }
 
 function getSavedThemeProp(prop) {
-    if (!prop) return '';
+    if (!prop) return null;
     const theme = JSON.parse(localStorage.getItem('theme'));
+    if(!theme) return null;
     return theme[prop];
 }
 

js/main.js

@@ -30,7 +30,7 @@ document.addEventListener("DOMContentLoaded", (event) => {
     if (theme)
         setPreset(JSON.parse(theme), true);
     else
-        setPreset(initialTheme, true);
+        setPreset(initialTheme);
 });
 
 // Demo reset after ended

partials/footer.html

@@ -1,13 +1,17 @@
 <footer class="footer">
     <div class="links">
-        <a href="https://github.com/leviarista/github-profile-header-generator/discussions" target="_blank"
+        <a href="https://github.com/leviarista/github-profile-header-generator/issues" target="_blank"
             rel="noopener noreferrer">
-            <b><u>Feedback</u></b>
+            <b><u>Contributing</u></b>
         </a>
         <a href="https://github.com/leviarista/github-profile-header-generator/issues" target="_blank"
             rel="noopener noreferrer">
             <b><u>Issues</u></b>
         </a>
+        <a href="https://github.com/leviarista/github-profile-header-generator/discussions" target="_blank"
+            rel="noopener noreferrer">
+            <b><u>Feedback</u></b>
+        </a>
     </div>
     <div class="icons">
         <a href="https://github.com/leviarista/github-profile-header-generator" target="_blank"
@@ -18,9 +22,10 @@
             <img src="./images/icons/product-hunt.svg" width="20" height="20" alt="Product Hunt logo" />
         </a> -->
         <a href="https://ko-fi.com/L3L1BO773" target="_blank" rel="noopener noreferrer">
-            <img src="https://storage.ko-fi.com/cdn/cup-border.png" alt="Buy Me a Coffee at ko-fi.com" style="width: 37px;" />
+            <img src="https://storage.ko-fi.com/cdn/cup-border.png" alt="Buy Me a Coffee at ko-fi.com"
+                style="width: 35px;" />
         </a>
-        <a href="#special-message-modal" >
+        <a href="#special-message-modal">
             <img src="./images/icons/heart-circle.svg" alt="info icon"
                 style="background-color: #FFF; border-radius: 50%;" />
         </a>

styles/main.scss

@@ -26,17 +26,19 @@ body {
     .toogle-dark-mode {
         position: absolute;
         float: right;
-        height: 30px;
+        height: 35px;
         padding: 0px;
         display: flex;
         align-items: center;
         justify-content: center;
         background-color: #949494;
-        border-radius: 15px;
+        border-radius: 17px;
+        user-select: none;
 
         >div {
-            width: 30px;
-            height: 30px;
+            width: 35px;
+            height: 35px;
+            padding: 7px;
             display: flex;
             align-items: center;
             justify-content: center;
@@ -53,7 +55,7 @@ body {
         }
 
         img {
-            width: 15px;
+            width: 100%;
             filter: brightness(0)
         }
 
@@ -296,7 +298,7 @@ button {
             align-items: center;
 
             img {
-                width: 30px;
+                width: 27px;
                 transition: all ease 500ms;
 
                 &:hover {

styles/tabs.scss

@@ -29,6 +29,7 @@
     transition: 0.3s;
     color: rgb(240, 240, 240);
     border-radius: 0 0 9px 9px;
+    font-weight: bold;
 }
 
 /* Change background color of buttons on hover */

styles/variables.scss

@@ -16,12 +16,23 @@
 }
 
 [data-theme="dark"] {
-    --background-color: linear-gradient(180deg, #2A2142 0%, #2F3E6F 50%, #1A2A54 100%);
-    --background-color: linear-gradient(180deg, #201932 0%, #222c50 50%, #131e3c 100%);
+    // --background-color: linear-gradient(180deg, #2A2142 0%, #2F3E6F 50%, #1A2A54 100%);
+    // --background-color: linear-gradient(180deg, #201932 0%, #222c50 50%, #131e3c 100%);
     // --background-color: linear-gradient(180deg, #1B1B2F 0%, #121224 60%, #0A0A1A 100%);
     // --background-color: linear-gradient(180deg, #111110 0%, #1A1A1A 40%, #2E2E3A 100%);
+    // --background-color: linear-gradient(180deg, #0d0a14 0%, #151b31 75%, #131e3c 100%);
+    // --background-color: linear-gradient(180deg, #3b2e5a 0%, #4b3b7a 40%, #1a1a1a 100%);
+    // --background-color: linear-gradient(180deg, #1e1436 0%, #2a1e4a 40%, #0a0a0a 100%);
+    // --background-color: linear-gradient(180deg, #1A1924 0%, #2A2D40 50%, #0F1017 100%);
+    // --background-color: linear-gradient(180deg, #121212 0%, #2F3E50 50%, #10192a 100%);
+    --background-color: linear-gradient(180deg, #111110 0%, #1e2732 50%, #111110 100%);
+
     // --text-color: white;
-    --text-color: #e4e4e4;
+    --text-color: #f5f5f5;
+
+    .tab {
+        background-color: #1b3050;
+    }
 }
 
 @media (max-width: 768px) {