Dark is basically complete

content/about.md

@@ -1,7 +1,7 @@
 ---
 title: Who the Hell I am?
 url: "/about"
-showtoc: false
+showtoc: true
 noreadtime: true
 nocomment: true
 noshare: true

content/posts/_index.md

@@ -2,9 +2,9 @@
 cascade:
     image: 'images/typewriter.jpg'
     author: "Palash Bauri"
-    title: "Yet another post"
+    title: "Posts"
     date: "2021-01-01"
-    description: "A ARTICLE WITH SHARES PALASH BAURI'S IDEA, OPINION AND RESEARCH"
+    description: "Article(s) written by Palash Bauri"
     images:
         - post-cover.png
     tags:

content/posts/internet-with-my-eyes.md

@@ -4,8 +4,10 @@ description = "Journey to the internet; Internet is broken, but I think the inte
 images = ["post-cover.png"]
 kws = ["World", "Technology", "internet", "world-wide-web", "social media"]
 lastmod = 2022-03-08T13:12:06Z
+showtoc = true
 nocomment = false
 noshare = false
+showbread = true
 noshowlastmod = false
 tags = ["internet", "tech"]
 title = "Internet with my eyes!"
@@ -37,6 +39,8 @@ The situation is worst than people anticipate! If I tell people that I have a we
 
 Look, I understand, everyone doesn't know these things, but what about the teens who are always sticking their face to their screen? They doesn't even know (or want to know) that there are things other than social media on web.
 
+### Final Thoughts
+
 Internet was supposed to expand the horizon; but social-media made it shrank even more. Social media is a part of the Web, but it is silently replacing the web.
 
 Everywhere I look, I just see monopolies; is this what modern imperialism looks like? 

static/js/main.js

@@ -1,62 +0,0 @@
-const mastodon_button_id = "masto_share";
-
-const masto_button = document.getElementById(mastodon_button_id);
-
-function is_valid_url(string) {
-  let url;
-  
-  try {
-    url = new URL(string);
-  } catch (_) {
-    return false;  
-  }
-
-  return url.protocol === "http:" || url.protocol === "https:";
-}
-
-if (masto_button){
-masto_button.onclick = function(){ 
-    
-    let masto_instance = prompt("Mastodon instance url?" , "https://");
-
-    if (masto_instance){
-        masto_instance = masto_instance.trim();
-        if (masto_instance.startsWith("https://") || masto_instance.startsWith("http://")){
-            if (is_valid_url(masto_instance)){
-                share_toot(masto_instance);
-            }
-            else{
-                alert("Invalid instance url");
-            }
-        }else{
-            const mi_temp = "https://" + masto_instance;
-            if (is_valid_url(mi_temp)){
-                share_toot(mi_temp);
-            }
-            else{
-                alert("Invalid instance url");
-            }
-        }
-
-    }
-    
-
-}
-}
-
-function share_toot(instance){
-    console.log(instance);
-}
-
-
-const theme_switch_id = "theme_switch";
-
-const theme_switch_button = document.getElementById(theme_switch_id);
-
-theme_switch_button.onclick = function(){
-    
-   document.body.classList.toggle("dark_theme");
-//document.documentElement.setAttribute("data-theme", "dark");
-    console.log('working');
-
-}

themes/x/assets/css/style.css

@@ -50,6 +50,9 @@
     --tag-bg: #413F42;
     --tag-col: white;
     --nav-hover-col: black;
+    --hljs-bg: black;
+    --code-bg: var(--tag-bg);
+    --border:white;
 }
 
 
@@ -59,7 +62,6 @@
     background: var(--bg-color);
 }
 
-
 *,
 ::after,
 ::before {
@@ -196,7 +198,7 @@ img {
 }
 
 ::-webkit-scrollbar-thumb:hover {
-    background: var(--secondary);
+    background: var(--secondary-color);
 }
 
 .not-found {
@@ -285,7 +287,7 @@ img {
 
 .footer a {
     color: inherit;
-    border-bottom: 1px solid var(--secondary);
+    border-bottom: 1px solid var(--secondary-color);
 }
 
 .footer a:hover {
@@ -474,7 +476,7 @@ nav.navigation a {
 
 .page_header_subtitle {
     font-weight: 700;
-    color: var(--border);
+    color: var(--text-color);
 }
 
 .page_header_avatar {
@@ -536,7 +538,7 @@ nav.navigation a {
 .entry-cover,
 .entry-isdraft {
     font-size: 14px;
-    color: var(--secondary);
+    color: var(--secondary-color);
 }
 
 .entry-cover {
@@ -552,7 +554,7 @@ nav.navigation a {
 }
 
 .entry-cover a {
-    color: var(--secondary);
+    color: var(--secondary-color);
     box-shadow: 0 1px 0 var(--primary);
 }
 
@@ -597,7 +599,7 @@ nav.navigation a {
     display: inline-flex;
     list-style: none;
     margin: auto 3px;
-    box-shadow: 0 1px 0 var(--secondary);
+    box-shadow: 0 1px 0 var(--secondary-color);
 }
 
 .breadcrumbs a {
@@ -645,7 +647,7 @@ nav.navigation a {
 .toc a:hover {
     box-shadow: 0 1px 0;
     font-weight: bold;
-    color: var(--p);
+    color: var(--accent-light);
 }
 
 .post-content a code {
@@ -835,7 +837,7 @@ nav.navigation a {
 }
 
 .post-content figure>figcaption>p {
-    color: var(--secondary);
+    color: var(--secondary-color);
     font-size: 14px;
     font-weight: normal;
 }
@@ -952,7 +954,7 @@ h4:hover .anchor,
 h5:hover .anchor,
 h6:hover .anchor {
     display: inline-flex;
-    color: var(--secondary);
+    color: var(--secondary-color);
     margin-inline-start: 8px;
     font-weight: 500;
 }
@@ -1197,7 +1199,8 @@ color: red;
   color: var(--link-color);
 
 }
-
+/*
 button#theme_switch{
     border: 2px solid red;
 }
+*/

themes/x/assets/js/main.js

@@ -0,0 +1,83 @@
+const mdid = "masto_share"; //mastodon button id
+const ldb = localStorage; //local storage shortcut
+const dtc = "dark_theme" //dark theme class name
+const tsid = "theme_switch"; //theme switch button id
+const lbn =  "[🔆]" //light theme button text
+const dbn = "[🌜]" //dark theme button text
+const inv = "Invalid mastodon instance url"
+
+document.addEventListener('DOMContentLoaded', function(_e) {
+   if (ldb.getItem("dark") == "true"){
+        document.body.classList.add(dtc);
+        document.getElementById(tsid).innerHTML = lbn;
+    }
+})
+
+const masto_button = document.getElementById(mdid);
+
+function is_valid_url(string) {
+  let url;
+  
+  try {
+    url = new URL(string);
+  } catch (_) {
+    return false;  
+  }
+
+  return url.protocol === "http:" || url.protocol === "https:";
+}
+
+if (masto_button){
+masto_button.onclick = function(){ 
+    
+    let masto_instance = prompt("Mastodon instance url?" , "https://");
+
+    if (masto_instance){
+        masto_instance = masto_instance.trim();
+        if (masto_instance.startsWith("https://") || masto_instance.startsWith("http://")){
+            if (is_valid_url(masto_instance)){
+                share_toot(masto_instance);
+            }
+            else{
+                alert(inv);
+            }
+        }else{
+            const mi_temp = "https://" + masto_instance;
+            if (is_valid_url(mi_temp)){
+                share_toot(mi_temp);
+            }
+            else{
+                alert(inv);
+            }
+        }
+
+    }
+    
+
+}
+}
+
+function share_toot(instance){
+    window.open( instance + "/share?text={{ .Title }} \n {{.Permalink}}" , "_blank");
+}
+
+
+
+const theme_switch_button = document.getElementById(tsid);
+
+theme_switch_button.onclick = function(){
+    
+    if (ldb.getItem("dark") == "true"){
+        document.body.classList.remove(dtc);
+document.getElementById(tsid).innerHTML = dbn;
+
+        ldb.removeItem("dark");
+    }else{
+        document.body.classList.add(dtc);
+
+        ldb.setItem("dark", true);
+document.getElementById(tsid).innerHTML = lbn;
+    }
+
+
+}

themes/x/layouts/_default/baseof.html

@@ -12,7 +12,9 @@
     </main>
     {{ partialCached "footer.html" . .Layout .Kind (.Param "hideFooter") (.Param "ShowCodeCopyButtons") }}
 </body>
-
-     <script src="/js/main.js"></script> 
+    {{ $js_path := "js/main.js" }}
+    {{ $mainjs_source := resources.Get $js_path }}
+    {{ $mainjs := $mainjs_source | resources.ExecuteAsTemplate $js_path . }}
+     <script>{{ $mainjs.Content | safeJS }}</script> 
 
 </html>

themes/x/layouts/partials/breadcrumbs.html

@@ -1,4 +1,4 @@
-{{- if (.Param "ShowBreadCrumbs") -}}
+{{- if (.Param "showbread") -}}
 <div class="breadcrumbs">
     {{- $url := replace .Parent.Permalink (printf "%s" .Site.BaseURL) "" }}
     {{- $lang_url := strings.TrimPrefix (printf "%s/" .Lang) $url -}}

themes/x/layouts/partials/header.html

@@ -7,6 +7,7 @@
         <a href="{{ "/archives" | relURL }}"> 🗃️ {{ i18n "archive" }}</a>
         <!-- <a href="{{ "/tags" | relURL }}"> 🔖 {{ i18n "tags" }}</a> -->
         <a href="{{ "/about" | relURL }}"> 🙋 {{ i18n "about" }}</a>
+        <button id="theme_switch">[🌜]</button>
     
     
     </nav>

themes/x/layouts/partials/social.html

@@ -1,5 +1,5 @@
 <div>
-<button id="theme_switch">[dark]</button>
+
 </div>
 <div id="social">
     <a class="symbol" href="https://twitter.com/{{.Site.Params.twitter}}" rel="noreferrer" target="_blank">