Some minor style issues related to dark theme

config.toml

@@ -25,7 +25,7 @@ refLinksNotFoundURL = '#'
 pluralizeListTitles = false
 
 [[menu.main]]
-    name = "Documentation"
+    name = "Docs"
     identifier = "sldn"
     url = "/reference/softlayerapi"
 [[menu.main]]
@@ -36,10 +36,6 @@ pluralizeListTitles = false
     name = "Go"
     identifier = "go"
     url = "/go/"
-[[menu.main]]
-    name = "Perl"
-    identifier = "perl"
-    url = "/perl/"
 [[menu.main]]
     name = "Java"
     identifier = "java"

content/release_notes/2024/20240619.md

@@ -0,0 +1,12 @@
+---
+title: "Release notes: June 19, 2024"
+date: "2024-06-19"
+tags:
+    - "release notes"
+---
+
+
+#### SLDN
+
+Introducting Dark Mode for SLDN! If there are any issues with this theme please let me know by [opening a GitHub Issue](https://github.com/softlayer/githubio_source/issues/new).
+You can also switch to Light Mode by clicking the SUN Icon: <span><i class="fas fa-sun"></i></span> on the top right corner.

layouts/partials/navbar.html

@@ -10,7 +10,7 @@
                 <a class="navbar-brand" href="{{ .Site.BaseURL}}">{{ .Site.Title }}</a>
             </div>
 
-            <div class="navbar-header" style="width: calc(100% - 400px)">
+            <div class="navbar-header" style="width: calc(100% - 350px)">
                 <ul class="nav navbar-nav" style="width: 100%">
                     {{ range .Site.Menus.main }}
                         <li><a href="{{.URL}}">{{ .Name }}</a></li>
@@ -23,7 +23,7 @@
                 </ul>
             </div>
 
-            <div id="custom-search-input" class="pull-right" style="width: 250px">
+            <div id="custom-search-input" class="pull-right" style="width: 200px">
               <form class="navbar-form" role="search" method="get" action="https://www.bing.com/search">
                 <div class="input-group col-md-12">
                   <input type="text" class="form-control input-md" placeholder="Search" name="q" id="srch-term">

static/css/custom.css

@@ -41,6 +41,12 @@ div.release-note h3 {
 
 a {
     color: var(--Red);
+    font-weight: bold;
+}
+
+a:hover {
+    color: var(--Pink);
+    font-weight: bold;
 }
 
 div.release-note {
@@ -599,11 +605,34 @@ code {
 .navbar-nav li {
     display: table-cell;
     position: relative;
-    text-align: center;
+    text-align: left;
     vertical-align: middle;
-    width: 8%;
-    border: 0 0;
+    width: 10%;
     overflow: hidden;
 
 }
 
+.pagination > .disabled > a {
+    color: var(--Black);
+    background-color: var(--Dark03);
+}
+
+.pagination > .active > a {
+    color: var(--White);
+    background-color: var(--Pink);
+}
+
+.pagination > .active > a:hover {
+    color: var(--Pink);
+    background-color: var(--Light02);
+}
+
+.pagination > li > a:hover {
+    color: var(--Pink);
+    background-color: var(--Light02);
+}
+
+.pagination > li > a {
+    color: var(--GrayLight);
+    background-color: var(--Dark03);
+}

static/css/light.css

@@ -1,13 +1,13 @@
 :root {
   --Dark01: #FFFFFF;
   --Dark02: #fafafa;
-  --Dark03: #FFFFFF;
+  --Dark03: #c4c2c2;
   --GrayDarkest: #FFFFFF;
   --GrayDark: #FFFFFF;
   --GrayMid: #FFFFFF;
   --GrayLight: #FFFFFF;
   --Light01: #999999;
-  --Light02: #000000;
+  --Light02: #3d3c3c;
   --Red: #008cba;
   --Orange: #FFFFFF;
   --Yellow: #FFFFFF;
@@ -16,6 +16,6 @@
   --Blue: #FFFFFF;
   --Purple: #FFFFFF;
   --Pink: #c7254e;
-  --Black: #FFFFFF;
+  --Black: #000000;
   --White: #FFFFFF;
 }