More styles

_config.yml

@@ -2,4 +2,8 @@ remote_theme: pages-themes/[email protected]
 plugins:
 - jekyll-remote-theme # add this line to the plugins list if you already have one
 title: Learn To Theme
-description: A step-by-step guide to creating Discord themes, from beginner to advanced.
+description: A step-by-step guide to creating Discord themes, from beginner to advanced.
+
+github:
+  owner_url: https://github.com/Saltssaumure
+  owner_name: Saltssaumure

_includes/navigation.html

@@ -1,4 +1,4 @@
-<nav>
+<nav class="navbar">
     <a href="{{ '/step/1.html' | relative_url }}" class="btn">Step 1</a>
     <a href="{{ '/step/2.html' | relative_url }}" class="btn">Step 2</a>
     <a href="{{ '/step/3.html' | relative_url }}" class="btn">Step 3</a>

_layouts/default.html

@@ -18,10 +18,9 @@
     <header class="page-header" role="banner">
       <h1 class="project-name">{{ page.title | default: site.title | default: site.github.repository_name }}</h1>
       <h2 class="project-tagline">{{ page.description | default: site.description | default: site.github.project_tagline }}</h2>
+      {% include navigation.html %}
     </header>
 
-    {% include navigation.html %}
-
     <main id="content" class="main-content" role="main">
       {{ content }}
 

assets/css/style.scss

@@ -1,6 +1,18 @@
 ---
 ---
+$header-bg-color: #6f15b8;
+$header-bg-color-secondary: #4e2802;
 
 @import "{{ site.theme }}";
 
-// other stuff
+body {
+    background: invert($body-text-color);
+}
+
+// Step navigation
+.navbar {
+    display: flex;
+    justify-content: center;
+    position: sticky;
+    top: 0;
+}