Improved logged in members section

Author: ngeorger

.github/workflows/deploy-theme.yaml

@@ -1,10 +1,14 @@
 name: deploy-theme
 on:
   workflow_dispatch:
+  push:
+    branches:
+      - main
 permissions:
   contents: read 
 jobs: 
   deploy:
+    if: ${{ github.event_name == 'push' && github.actor == 'ngeorger' || github.event_name == 'workflow_dispatch' && github.actor == 'ngeorger' }}
     runs-on: ubuntu-latest
     steps:
       - 
@@ -22,5 +26,5 @@ jobs:
         with:
           api-url: ${{ secrets.GHOST_API_URL }}
           api-key: ${{ secrets.GHOST_ADMIN_API_KEY }}
-          exclude: "node_modules gulpfile.js yarn.lock .gitignore .github .git LICENSE README.md .pre-commit-config.yaml routes.yaml tailwind.config.js .nvmrc "
+          exclude: "node_modules gulpfile.js yarn.lock .gitignore .github .git LICENSE README.md .pre-commit-config.yaml routes.yaml tailwind.config.js"
 

.nvmrc

@@ -70,3 +70,23 @@ document.addEventListener('DOMContentLoaded', function () {
         wrapper.appendChild(table);
     });
 })();
+
+/* Open external links in new tab */
+const domain = window.location.host.replace(/^www\./i, '');
+const links = document.querySelectorAll('a[href]');
+
+links.forEach((link) => {
+    try {
+        const href = link.href.toLowerCase();
+        // Skip empty links or potentially malicious javascript: URLs
+        if (!href || /^javascript:/i.test(href)) return;
+        
+        // Check if link is external
+        if (!href.includes(domain) || href.includes(`ref=${domain}`)) {
+            link.setAttribute('target', '_blank');
+            link.setAttribute('rel', 'noopener');
+        }
+    } catch (error) {
+        console.warn('Error processing link:', error);
+    }
+});

assets/built/main.js

@@ -2,7 +2,7 @@
     "name": "sredevopsorg-ghost-theme",
     "description": "Ghost v5 Theme made for SREDevOps.org (https://sredevops.org) based on Tailwind CSS v3, responsive, dark color schema, SVG icons, sidebar + footer navgation, customized tags and recommendations pages.",
     "demo": "https://sredevops.org",
-    "version": "1.1.4",
+    "version": "1.1.5",
     "engines": {
         "ghost": ">=5.0.0"
     },

assets/built/prism.css

@@ -7,8 +7,15 @@
             };
             document.head.appendChild(script);
         }
+
+        // Add event listener for ESC key
+        document.addEventListener('keydown', function(event) {
+            if (event.key === 'Escape') {
+                closeModal();
+            }
+        });
     </script>
-    
+
 <div id="searchModal" class="modal">
     <div class="modal-content">
 

assets/built/screen.css

@@ -60,14 +60,29 @@
     </section>
     <section id="members" class="pb-4 text-light">
         {{#if @member}}
+            {{!-- Add CryptoJS library --}}
+            <script src="https://cdnjs.cloudflare.com/ajax/libs/crypto-js/4.1.1/crypto-js.min.js" crossorigin="anonymous" referrerpolicy="no-referrer"></script>
+            <script>
+                document.addEventListener('DOMContentLoaded', () => {
+                    // Step 1: Hash your email address using SHA-256.
+                    const hashedEmail = CryptoJS.SHA256('{{@member.email}}').toString();  // Add toString()
+                    // Step 2: Construct the Gravatar URL.
+                    const gravatarUrl = `https://www.gravatar.com/avatar/${hashedEmail}`;
+                    // Step 3: Set the image source to the Gravatar URL.
+                    document.getElementById('gravatar-image').src = gravatarUrl;
+                });
+            </script>
         <div class="flex items-center gap-2">
             <ul>
-                <li><a href="/#/portal/account/profile"><img src="{{@member.avatar}}" alt="{{@member.name}} Settings" aria-label="{{@member.name}} Settings" class="w-8 h-8 rounded-full"></a></li>
-                <li><a href="javascript:" data-members-signout>Sign out</a></li>
+                <li><img alt="{{@member.name}}" aria-label="Avatar" class="w-10 h-10 rounded-full" id="gravatar-image"></li>
+                <li><span class="text-xs text-light">Welcome, {{@member.name}}</span></li>
+                <li><a href="/#/portal/account/profile" data-portal="account/profile" class="text-xs text-light">Settings</a></li>
+                <li><a href="https://gravatar.com/profile" target="_blank" rel="noopener nofollow" class="text-xs text-light">Edit your avatar</a></li>
+                <li><a href="javascript:" data-members-signout class="text-xs text-light">Sign out</a></li>
             </ul> 
         </div>
         {{else}}
-        {{> "social-sso"}}
+            {{> "social-sso"}}
         {{/if}}
     </section>
 </aside>

assets/js/main.js

@@ -12,7 +12,7 @@
         </picture>
         {{#unless "post" }}
             {{#if feature_image_caption}}
-                <figcaption>{{feature_image_caption}}</figcaption>
+                <figcaption class="text-xs text-center text-light">{{feature_image_caption}}</figcaption>
             {{/if}}
         {{/unless}}
     </figure>