Fixed

Signed-off-by: Someshdiwan <[email protected]>

Author: Someshdiwan

site/_includes/nav.html

@@ -4,4 +4,4 @@
     <li><a href="{{ site.baseurl }}/content">All Contents</a></li>
     <li><a href="https://github.com/Someshdiwan/JavaEvolution-Learning-Growing-Mastering">GitHub Repo</a></li>
   </ul>
-</nav>
+</nav>

site/_layouts/default.html

@@ -11,12 +11,12 @@
     <link rel="apple-touch-icon" sizes="180x180" href="{{ '/assets/apple-touch-icon.png' | relative_url }}" />
     <meta name="apple-mobile-web-app-title" content="Java" />
 
-    <!-- Manifest (use only one, with correct GitHub Pages path) -->
+    <!-- Manifest (for GitHub Pages project path) -->
     <link rel="manifest" href="/JavaEvolution-Learning-Growing-Mastering/assets/site.webmanifest">
     <meta name="theme-color" content="#ffffff">
 
     <title>{{ page.title }}</title>
-    <link rel="stylesheet" href="{{ "/assets/style.css" | relative_url }}">
+    <link rel="stylesheet" href="{{ '/assets/style.css' | relative_url }}">
 
     <script>
         // Sidebar Toggle Function
@@ -36,13 +36,13 @@
           }
         }
 
-        // Dark Mode Toggle Function (now used inside time container)
+        // Dark Mode Toggle Function
         const toggleDarkMode = () => {
           document.body.classList.toggle('dark-mode');
           localStorage.setItem('dark-mode', document.body.classList.contains('dark-mode'));
         };
 
-        // Live Time Update Function with GMT Offset
+        // Live Time Update Function (with GMT offset)
         function updateLiveTime() {
           const now = new Date();
           let hours = now.getHours();
@@ -52,14 +52,14 @@
           hours = hours % 12 || 12;
           const timeString = `${hours}:${minutes}:${seconds} ${ampm}`;
 
-          // Calculate GMT offset (JS returns minutes behind UTC; we negate to show positive for IST)
+          // Calculate GMT offset (negate offset from getTimezoneOffset)
           const offset = -now.getTimezoneOffset();
           const offsetHours = Math.floor(Math.abs(offset) / 60);
           const offsetMinutes = Math.abs(offset) % 60;
           const offsetSign = offset >= 0 ? '+' : '-';
           const offsetString = `GMT${offsetSign}${offsetHours.toString().padStart(2, '0')}:${offsetMinutes.toString().padStart(2, '0')}`;
 
-          document.getElementById('live-time').textContent = `Time: ${timeString} ${offsetString}`;
+          document.getElementById('current-time').textContent = timeString + ' ' + offsetString;
         }
 
         // Service Worker Registration
@@ -71,21 +71,58 @@
 
         // Initialization on DOMContentLoaded
         window.addEventListener('DOMContentLoaded', () => {
+          // Restore dark mode preference
           if (localStorage.getItem('dark-mode') === 'true') {
             document.body.classList.add('dark-mode');
           }
+          // Attach listener for sidebar auto-hide
           document.addEventListener('click', hideSidebarIfClickedOutside);
+          // Start live time updates
           updateLiveTime();
           setInterval(updateLiveTime, 1000);
         });
     </script>
+
+    <!-- (Optional inline styles for the time container can also reside in your style.css) -->
+    <style>
+        /* Time Container (holds the live time and dark mode toggle) */
+        #time-container {
+          position: fixed;
+          top: 1rem;
+          right: 1rem;
+          z-index: 1100;
+          background: rgba(0, 0, 0, 0.6);
+          color: #00ffff;
+          border: 1px solid #00ffff;
+          box-shadow: 0 0 15px rgba(0, 255, 255, 0.3);
+          border-radius: 16px;
+          padding: 0.6rem 1rem;
+          display: flex;
+          align-items: center;
+          gap: 0.5rem;
+          font-weight: 600;
+          font-size: 1.05rem;
+        }
+        /* Dark mode overrides for the time container */
+        body.dark-mode #time-container {
+          background-color: #333;
+          color: #eee;
+        }
+        @media (max-width: 600px) {
+          #time-container {
+            flex-direction: column;
+            font-size: 0.95rem;
+            padding: 0.8rem;
+          }
+        }
+    </style>
 </head>
 <body>
-<!-- The combined Time Container with Dark Mode Toggle -->
+
+<!-- Time Container with Dark Mode Toggle Embedded -->
 <div id="time-container">
-    <div id="live-time">Time: Loading...</div>
-    <!-- Dark mode toggle button placed inside the time container -->
-    <button onclick="toggleDarkMode()" class="dark-toggle" style="padding: 0.5rem; font-size: 1.2rem;">🌓</button>
+    <span id="current-time">--:--</span>
+    <button class="dark-toggle" onclick="toggleDarkMode()">🌙</button>
 </div>
 
 <div class="wrapper">
@@ -96,7 +133,7 @@
 
     <!-- Content Area -->
     <div class="content">
-        <!-- Sidebar Toggle Button (if you want manual control; you may remove it later) -->
+        <!-- Optional: Manual Sidebar Toggle Button -->
         <button class="toggle-btn" onclick="toggleSidebar()">☰</button>
         <div class="fade-in">
             {{ content }}

site/assets/site.webmanifest

@@ -1,3 +1,31 @@
+{
+  "name": "Java Mastery",
+  "short_name": "Java",
+  "description": "Master Java step by step with visual learning, practical coding, and deep understanding.",
+  "start_url": "/JavaEvolution-Learning-Growing-Mastering/?source=pwa",
+  "scope": "/JavaEvolution-Learning-Growing-Mastering/",
+  "display": "standalone",
+  "orientation": "portrait",
+  "theme_color": "#0d1117",
+  "background_color": "#ffffff",
+  "icons": [
+    {
+      "src": "/JavaEvolution-Learning-Growing-Mastering/assets/web-app-manifest-192x192.png",
+      "sizes": "192x192",
+      "type": "image/png",
+      "purpose": "maskable"
+    },
+    {
+      "src": "/JavaEvolution-Learning-Growing-Mastering/assets/web-app-manifest-512x512.png",
+      "sizes": "512x512",
+      "type": "image/png",
+      "purpose": "maskable"
+    }
+  ]
+}
+
+
+/*
 {
   "name": "Java Mastery",
   "short_name": "Java",
@@ -21,3 +49,4 @@
   "background_color": "#ffffff",
   "display": "standalone"
 }
+ */

site/assets/style.css

@@ -102,28 +102,39 @@ body {
   to { opacity: 1; transform: translateY(0); }
 }
 
-/* Time Container */
 #time-container {
+  position: fixed;
+  top: 1rem;
+  right: 1rem; /* Stick to top-right */
   background: rgba(0, 0, 0, 0.6);
   color: #00ffff;
   border: 1px solid #00ffff;
   box-shadow: 0 0 15px rgba(0, 255, 255, 0.3);
   border-radius: 16px;
-  padding: 1.2rem;
-  margin: 1rem auto;
-  max-width: 320px;
-  display: flex;
-  align-items: center;
-  justify-content: space-between;
+  padding: 0.6rem 1rem;
   font-weight: 600;
   font-size: 1.05rem;
+  display: flex;
+  align-items: center;
+  gap: 0.5rem;
+  z-index: 1100;
 }
 
 body.dark-mode #time-container {
   background-color: #333;
   color: #eee;
 }
 
+@media (max-width: 600px) {
+  #time-container {
+    flex-direction: column;
+    align-items: flex-end;
+    font-size: 0.95rem;
+    padding: 0.8rem;
+  }
+}
+
+
 /* Image Row */
 .image-row {
   display: flex;

site/assets/sw.js

@@ -1,27 +1,28 @@
-const CACHE_NAME = "java-evolution-cache-v2";
+const CACHE_NAME = "java-evolution-cache-v3";
 const urlsToCache = [
   "/JavaEvolution-Learning-Growing-Mastering/",
   "/JavaEvolution-Learning-Growing-Mastering/index.html",
   "/JavaEvolution-Learning-Growing-Mastering/assets/style.css",
   "/JavaEvolution-Learning-Growing-Mastering/assets/script.js",
   "/JavaEvolution-Learning-Growing-Mastering/assets/favicon-96x96.png",
   "/JavaEvolution-Learning-Growing-Mastering/assets/apple-touch-icon.png",
-  // Add more assets like images, fonts, etc.
+  "/JavaEvolution-Learning-Growing-Mastering/assets/web-app-manifest-192x192.png",
+  "/JavaEvolution-Learning-Growing-Mastering/assets/web-app-manifest-512x512.png"
 ];
 
-// Install event: caching essential files
-self.addEventListener("install", (e) => {
-  e.waitUntil(
-    caches.open(CACHE_NAME).then((cache) => {
-      return cache.addAll(urlsToCache);
-    })
+// Install event
+self.addEventListener("install", (event) => {
+  console.log("[Service Worker] Installing and caching static assets");
+  self.skipWaiting();
+  event.waitUntil(
+    caches.open(CACHE_NAME).then((cache) => cache.addAll(urlsToCache))
   );
-  console.log("Service Worker Installed & Cached");
 });
 
-// Activate event: cleanup old caches
-self.addEventListener("activate", (e) => {
-  e.waitUntil(
+// Activate event
+self.addEventListener("activate", (event) => {
+  console.log("[Service Worker] Activated and cleaning old caches");
+  event.waitUntil(
     caches.keys().then((cacheNames) =>
       Promise.all(
         cacheNames
@@ -30,14 +31,38 @@ self.addEventListener("activate", (e) => {
       )
     )
   );
-  console.log("Old caches cleaned up");
+  self.clients.claim();
 });
 
-// Fetch event: serve cached files when offline
-self.addEventListener("fetch", (e) => {
-  e.respondWith(
-    caches.match(e.request).then((response) => {
-      return response || fetch(e.request);
+// Fetch event
+self.addEventListener("fetch", (event) => {
+  event.respondWith(
+    caches.match(event.request).then((cachedResponse) => {
+      // Return from cache if available
+      if (cachedResponse) {
+        return cachedResponse;
+      }
+
+      // Otherwise fetch from network
+      return fetch(event.request)
+        .then((networkResponse) => {
+          // Cache new fetched files (only GET and same-origin)
+          if (
+            event.request.method === "GET" &&
+            event.request.url.startsWith(self.location.origin)
+          ) {
+            return caches.open(CACHE_NAME).then((cache) => {
+              cache.put(event.request, networkResponse.clone());
+              return networkResponse;
+            });
+          } else {
+            return networkResponse;
+          }
+        })
+        .catch(() =>
+          // Offline fallback: serve homepage or a fallback page/image
+          caches.match("/JavaEvolution-Learning-Growing-Mastering/index.html")
+        );
     })
   );
-});
+});