Add lightmode, More rounded corners, Add settings header, Change GitHub icon

assets/config.yml

@@ -4,13 +4,28 @@ subtitle: "Walkx"
 logo: "logo.png"
 
 header: false
-footer: '<p>Theme made with <span class="has-text-danger">❤️</span> by Walkx</p>' # Set false if you want to hide it.
+footer: '<p>Theme made with <span class="has-text-danger">❤️</span> by <a href="https://github.com/WalkxCode">Walkx</a></p>' # Set false if you want to hide it.
 
 stylesheet:
   - "assets/custom.css"
 
-theme: dark
+columns: "3" # You can change this to any number that is a factor of 12: (1, 2, 3, 4, 6, 12)
+theme: default
 colors:
+  light:
+    highlight-primary: "#fff5f2"
+    highlight-secondary: "#fff5f2"
+    highlight-hover: "#bebebe"
+    background: "#12152B"
+    card-background: "#fff5f2"
+    text: "#ffffff"
+    text-header: "#fafafa"
+    text-title: "#000000"
+    text-subtitle: "#111111"
+    card-shadow: rgba(0, 0, 0, 0.5)
+    link: "#3273dc"
+    link-hover: "#c1c1c1"
+    background-image: "../assets/wallpaper-light.jpeg" # Change wallpaper.jpeg to the name of your own custom wallpaper!
   dark:
     highlight-primary: "#181C3A"
     highlight-secondary: "#181C3A"
@@ -22,22 +37,8 @@ colors:
     text-title: "#fafafa"
     text-subtitle: "#8B8D9C"
     card-shadow: rgba(0, 0, 0, 0.5)
-    link: "#3273dc"
+    link: "#c1c1c1"
-    link-hover: "#ffdd57"
+    link-hover: "#fafafa"
-    background-image: "../assets/wallpaper.jpeg"
-  light:
-    highlight-primary: "#181C3A"
-    highlight-secondary: "#181C3A"
-    highlight-hover: "#1F2347"
-    background: "#12152B"
-    card-background: "#181C3A"
-    text: "#eaeaea"
-    text-header: "#7C71DD"
-    text-title: "#fafafa"
-    text-subtitle: "#8B8D9C"
-    card-shadow: rgba(0, 0, 0, 0.5)
-    link: "#3273dc"
-    link-hover: "#ffdd57"
     background-image: "../assets/wallpaper.jpeg"
 
 services:
@@ -45,10 +46,10 @@ services:
     icon: "fas fa-github"
     items:
       - name: "Homer Theme"
-        logo: "assets/tools/github.png"
+        logo: "assets/tools/walkx.png" # Change github.png to the name of your own custom icon!
         subtitle: "The official Homer Theme github!"
         tag: "github"
-        tagstyle: "is-primary"
+        tagstyle: "is-primary" # This will display the is-primary color! Try changing it to; is-link, is-info, is-success, is-warning or is-danger!
         url: "https://github.com/WalkxCode/Homer-Theme"
         target: "_blank"
 

assets/custom.css

@@ -84,15 +84,27 @@ body #app .message {
   opacity: 80%;
 }
 
-/* Adds more border radius to the cards */
+ /*Adds more border radius to the cards */
 body .layout-vertical .column div:first-of-type .card {
-  border-radius: 0.5rem;
+  border-radius: 1rem;
 }
 body .layout-vertical .card {
-  border-radius: 0.5rem;
+  border-radius: 1rem;
+}
+.card {
+    border-radius: 1rem;
 }
 
-/* Removes the header */
+/* Changes Header Opacity */
-#bighead {
+body #bighead .navbar {
-  display: none;
+  background-color: rgba(0, 0, 0, 0);
 }
+
+body .search-bar input {
+    opacity: 20%;
+}
+
+body #bighead .navbar a:focus, body #bighead .navbar a:hover {
+   background-color: rgba(0, 0, 0, 0);
+   color: var(--link-hover);
+}