bilingual-jekyll-resume-theme 0.5.2 → 0.7.0

checksums.yaml

@@ -1,7 +1,7 @@
 ---
 SHA256:
-  metadata.gz: 7a160407a794060fef19ecf9df069af68dd152f04903fca2df9be92e6739a0e1
-  data.tar.gz: 6d8df24a03c4031c201789dafd68785e83841e15c61c096ded7981e431957008
+  metadata.gz: f2f374813b4f778e031ea8979e3f995f8fd800e511c65418a88fc524ca8db793
+  data.tar.gz: dddb715d231b8795b4dad38fe31c5ee066400460913768bd602440e4a7c5e0ad
 SHA512:
-  metadata.gz: fd7ac5fa5738962bf6a1a2f52b0d76809b7d7ceb195b8e16b6d06ea6767b3e8230520f940654cfb33c09d8b56cfca1dfe552fd7707cde23ce46a6ea97f14abd6
-  data.tar.gz: e9acabde4734416d1350a24a0aab3356da47bec4f6f37c56752760a667a3387d2eaa2aab57605f35d352a9ef9e25b2a249a7366050b1beacd998f5d5a086a0d8
+  metadata.gz: b8551515a7d57937c754ec17ec2f5dbc1d44eb2645aa1a449210f4004a17bc3f6a4595abd5a186a483a3e5399a3786cf4c8594ad9260bb4f7084051bcb265dba
+  data.tar.gz: 368308d395c16d9cab00ccfe36a1e2c8c18118d2727b0a7d8d668ed659b3d71a001f1c0da8ec41c83b3cb8701dc19f282275c3f1248949653f67043b003d02db

data/403.html

@@ -0,0 +1,6 @@
+---
+layout: error
+code: "403"
+title: "403 - Access Forbidden / الوصول محظور"
+permalink: /403.html
+---

data/404.html

@@ -0,0 +1,6 @@
+---
+layout: error
+code: "404"
+title: "404 - Page Not Found / الصفحة غير موجودة"
+permalink: /404.html
+---

data/500.html

@@ -0,0 +1,6 @@
+---
+layout: error
+code: "500"
+title: "500 - Internal Server Error / خطأ داخلي في الخادم"
+permalink: /500.html
+---

data/CHANGELOG.md

@@ -4,6 +4,57 @@ All notable changes to this project will be documented in this file.
 
 The format is based on [Keep a Changelog](https://keepachangelog.com/en/1.0.0/),
 and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0.html).
+## [0.7.0] - 2026-09-12
+
+### Added
+* Add bilingual error suite (404, 403, 500) and reusable layout ([`4eab127`](https://github.com/kmutahar/bilingual-jekyll-resume-theme/commit/4eab127d8cc3a4cedccca89943482fd3a067ee14))
+
+
+### Changed
+* Enhance README and DATA_GUIDE with dark mode, typography, and error page details ([`8284ee7`](https://github.com/kmutahar/bilingual-jekyll-resume-theme/commit/8284ee7c0ffe351b823ad8ea0854b8e6d6afecd5))
+
+* Implement universal dark mode and isolate profile layout styles ([`853a9ac`](https://github.com/kmutahar/bilingual-jekyll-resume-theme/commit/853a9ac1eaf11aadec62f198f6b7e9cdb2d3c209))
+
+* Update analytics configuration to support direct measurement ID for Google Analytics 4 ([`dff8c3d`](https://github.com/kmutahar/bilingual-jekyll-resume-theme/commit/dff8c3d3ce3bfebf2ebb37d3ada348ed1a603f3c))
+
+* Integrate Google Tag Manager analytics snippet into resume layouts ([`54f5c96`](https://github.com/kmutahar/bilingual-jekyll-resume-theme/commit/54f5c9676766c2ee04cd44a9b64b1a3472ca4d70))
+
+* Enhance contact information handling and improve schema markup in resume layouts ([`caf726c`](https://github.com/kmutahar/bilingual-jekyll-resume-theme/commit/caf726c557e8289c991b6cb15acc3cc54504867e))
+
+
+### Fixed
+* Upgrade Arabic font loading and isolate print social links ([`ca6898b`](https://github.com/kmutahar/bilingual-jekyll-resume-theme/commit/ca6898b883a5264dbee9088c849bfd6a00fdf079))
+
+* Scope global svg rules and add WCAG 2.1 AA accessible social links ([`d44dcb1`](https://github.com/kmutahar/bilingual-jekyll-resume-theme/commit/d44dcb15360ddd3c6e5eb42bc973564f882ee177))
+
+* Centralize modern favicon suite and resolve subdirectory 404s ([`943d565`](https://github.com/kmutahar/bilingual-jekyll-resume-theme/commit/943d5653d5cbfa5f6189b4975a74f2e981c6ceb1))
+
+* Add 'dir="ltr"' attribute to URLs for better text direction handling in resume sections ([`73da095`](https://github.com/kmutahar/bilingual-jekyll-resume-theme/commit/73da0959f2de2b7a6585d2c1c03fc59a4fa55f65))
+
+
+### Removed
+* Remove conflicting duplicate canonical tag from shared head ([`8f8b22b`](https://github.com/kmutahar/bilingual-jekyll-resume-theme/commit/8f8b22bfdea4e40371366db47bdddd98d412631a))
+
+## [0.6.1] - 2026-08-21
+
+### Changed
+* Version bump since v0.6.0 gemspec had incorrect version number and release was pushed to RubyGems incorrectly and it was yanked; re-releasing under v0.6.1.
+
+## [0.6.0] - 2026-08-21
+
+### Added
+* Add CLAUDE.md for AI coding assistant guidance and project documentation ([`d68bb03`](https://github.com/kmutahar/bilingual-jekyll-resume-theme/commit/d68bb031043eb88dc7bc6eaaa30a00867f7f7afc))
+
+
+### Changed
+* Add dark mode toggle with system preference detection ([`2dcb813`](https://github.com/kmutahar/bilingual-jekyll-resume-theme/commit/2dcb8135817d05f97d8705ea09bfb326d244cd3d))
+
+* Enhance CLAUDE.md with comprehensive project documentation and guidance for AI assistants ([`b3facba`](https://github.com/kmutahar/bilingual-jekyll-resume-theme/commit/b3facba6cac2caf853d3f70243dd8a9a2f87ab53))
+
+* Revise SECURITY.md with version support and monitoring ([`34c78a0`](https://github.com/kmutahar/bilingual-jekyll-resume-theme/commit/34c78a08ee5e96fd0667b9896c07f6e18e380dd0))
+
+* Potential fix for code scanning alert no. 1: Workflow does not contain permissions ([`915f9e7`](https://github.com/kmutahar/bilingual-jekyll-resume-theme/commit/915f9e77982a962e3eda844263d65b5a4ffb849b))
+
 ## [0.5.2] - 2026-05-09
 
 ### Added
@@ -143,7 +194,8 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0
 
 * Initial commit (New Theme Template) ([`00af662`](https://github.com/kmutahar/bilingual-jekyll-resume-theme/commit/00af6628dfec7aefe0ef7d7083bf98c9713a5ffd))
 
-[0.5.2]: https://github.com/kmutahar/bilingual-jekyll-resume-theme/compare/v0.5.1...0.5.2
+[0.6.0]: https://github.com/kmutahar/bilingual-jekyll-resume-theme/compare/v0.5.2...v0.6.0
+[0.5.2]: https://github.com/kmutahar/bilingual-jekyll-resume-theme/compare/v0.5.1...v0.5.2
 [0.5.1]: https://github.com/kmutahar/bilingual-jekyll-resume-theme/compare/v0.5.0...v0.5.1
 [0.5.0]: https://github.com/kmutahar/bilingual-jekyll-resume-theme/compare/v0.4.0...v0.5.0
 [0.4.0]: https://github.com/kmutahar/bilingual-jekyll-resume-theme/compare/v0.3.1...v0.4.0

data/README.md

@@ -7,11 +7,14 @@ Inspired by and originally forked from [Joel Glovier’s resume template](https:
 
 ## Features
 
-- **Bilingual support**: Separate layouts for English (`resume-en.html`) and Arabic (`resume-ar.html`) with full RTL support
+- **Bilingual support**: Separate layouts for English (`resume-en.html`) and Arabic (`resume-ar.html`) with full RTL support and Cairo typography
+- **Dark mode**: System preference detection (`prefers-color-scheme`) with optional interactive toggle, `localStorage` persistence, and zero-FOUC inline script
 - **Data-driven architecture**: All resume content stored in YAML files, supporting multiple data paths and versioning
 - **12 resume sections**: Experience, Education, Certifications, Courses, Volunteering, Projects, Skills, Recognition, Associations, Languages, Links, Interests
-- **Print-friendly**: Optimized for PDF generation and printing
-- **SEO ready**: Built-in support for multilingual SEO, sitemap, and feed generation
+- **WCAG 2.1 AA Accessible**: Full screen reader and keyboard accessibility with `.sr-only` labels and declarative aria attributes
+- **Modern favicon suite**: High-resolution favicons (Apple touch icon, 32x32, 16x16, webmanifest) with subpath-safe URLs and `_config.yml` override support
+- **Print-friendly**: Optimized for PDF generation and printing with bidirectional text isolation (`dir="ltr"`) for URLs
+- **SEO ready**: Built-in support for multilingual SEO, standardized canonical tags via `jekyll-seo-tag`, sitemaps, and feeds
 - **Arabic month support**: Arabic date formatting included out of the box (`_data/ar/months.yml`)
 
 ## Quick Start

data/_data/error_pages.yml

@@ -0,0 +1,33 @@
+# Bilingual Error Page Definitions
+# bilingual-jekyll-resume-theme
+# Centralized English and Arabic content for HTTP error pages.
+
+labels:
+  home: "Home / الرئيسية"
+  resume_en: "Resume (EN)"
+  resume_ar: "السيرة الذاتية (عربي)"
+  reload: "Reload Page / إعادة تحميل الصفحة"
+
+"404":
+  title_en: "Page Not Found"
+  desc_en: "The page you are looking for might have been removed, had its name changed, or is temporarily unavailable."
+  title_ar: "الصفحة غير موجودة"
+  desc_ar: "ربما تمت إزالة الصفحة التي تبحث عنها، أو تم تغيير اسمها، أو أنها غير متوفرة مؤقتاً."
+
+"403":
+  title_en: "Access Forbidden"
+  desc_en: "You do not have permission to access the requested resource or directory."
+  title_ar: "الوصول محظور"
+  desc_ar: "ليس لديك الصلاحية اللازمة للوصول إلى هذا المورد أو الدليل المطلوب."
+
+"500":
+  title_en: "Internal Server Error"
+  desc_en: "The server encountered an unexpected condition that prevented it from fulfilling the request. Please try again later."
+  title_ar: "خطأ داخلي في الخادم"
+  desc_ar: "واجه الخادم ظرفاً غير متوقع منعه من إكمال الطلب. يرجى المحاولة مرة أخرى لاحقاً."
+
+"503":
+  title_en: "Service Unavailable"
+  desc_en: "The server is currently unable to handle the request due to maintenance or capacity overload."
+  title_ar: "الخدمة غير متوفرة مؤقتاً"
+  desc_ar: "الخادم غير قادر على معالجة الطلب حالياً بسبب الصيانة أو زيادة الحمل."

data/_includes/analytics-body.html

@@ -1,5 +1,4 @@
 {%- if site.analytics.gtm -%}
-
     <!-- Google Tag Manager (noscript) -->
     <noscript>
         <iframe
@@ -10,19 +9,4 @@
         </iframe>
     </noscript>
     <!-- End Google Tag Manager (noscript) -->
-
-{%- else  -%}
-
-    {%- if site.analytics.ga  -%}
-
-        {%- comment -%}
-        No Google Analytics gtag.js exists for body so this section will return a blank.
-        {%- endcomment -%}
-
-    {%- endif -%}
-
-{%- else  -%}
-
-    <!-- No Analytics Added -->
-
 {%- endif -%}

data/_includes/analytics-head.html

@@ -16,15 +16,21 @@
             f.parentNode.insertBefore(j, f);
         })(window, document, 'script', 'dataLayer', '{{ site.analytics.gtm }}');
     </script>
-
     <!-- End Google Tag Manager -->
 
 {%- else -%}
 
-    {%- if site.analytics.ga -%}
+    {%- assign ga_id = nil -%}
+    {%- if site.analytics.gtag and site.analytics.gtag != "" -%}
+        {%- assign ga_id = site.analytics.gtag -%}
+    {%- elsif site.analytics.ga and site.analytics.ga != true and site.analytics.ga != "" -%}
+        {%- assign ga_id = site.analytics.ga -%}
+    {%- endif -%}
+
+    {%- if ga_id -%}
 
         <!-- Global site tag (gtag.js) - Google Analytics -->
-        <script async src="https://www.googletagmanager.com/gtag/js?id={{ site.analytics.gtag }}"></script>
+        <script async src="https://www.googletagmanager.com/gtag/js?id={{ ga_id }}"></script>
         <script>
             window.dataLayer = window.dataLayer || [];
 
@@ -33,7 +39,7 @@
             }
 
             gtag('js', new Date());
-            gtag('config', '{{ site.analytics.gtag }}');
+            gtag('config', '{{ ga_id }}');
         </script>
 
     {%- endif -%}

data/_includes/dark-mode-toggle.html

@@ -0,0 +1,177 @@
+<!-- Dark Mode Toggle Button (Two-state: System Default vs Pinned Override) -->
+<button
+  id="dark-mode-toggle"
+  class="dark-mode-toggle no-print"
+  type="button"
+  aria-label="Switch to dark mode"
+  title="Switch to dark mode"
+  aria-pressed="false"
+  data-pinned="false"
+>
+  <!-- Sun Icon: Visible in dark mode / indicates switching to light mode -->
+  <svg
+    class="dark-mode-icon dark-mode-icon-sun"
+    xmlns="http://www.w3.org/2000/svg"
+    width="20"
+    height="20"
+    viewBox="0 0 24 24"
+    fill="none"
+    stroke="currentColor"
+    stroke-width="2"
+    stroke-linecap="round"
+    stroke-linejoin="round"
+    aria-hidden="true"
+    focusable="false"
+  >
+    <circle cx="12" cy="12" r="5"></circle>
+    <line x1="12" y1="1" x2="12" y2="3"></line>
+    <line x1="12" y1="21" x2="12" y2="23"></line>
+    <line x1="4.22" y1="4.22" x2="5.64" y2="5.64"></line>
+    <line x1="18.36" y1="18.36" x2="19.78" y2="19.78"></line>
+    <line x1="1" y1="12" x2="3" y2="12"></line>
+    <line x1="21" y1="12" x2="23" y2="12"></line>
+    <line x1="4.22" y1="19.78" x2="5.64" y2="18.36"></line>
+    <line x1="18.36" y1="5.64" x2="19.78" y2="4.22"></line>
+  </svg>
+
+  <!-- Moon Icon: Visible in light mode / indicates switching to dark mode -->
+  <svg
+    class="dark-mode-icon dark-mode-icon-moon"
+    xmlns="http://www.w3.org/2000/svg"
+    width="20"
+    height="20"
+    viewBox="0 0 24 24"
+    fill="none"
+    stroke="currentColor"
+    stroke-width="2"
+    stroke-linecap="round"
+    stroke-linejoin="round"
+    aria-hidden="true"
+    focusable="false"
+  >
+    <path d="M21 12.79A9 9 0 1 1 11.21 3 7 7 0 0 0 21 12.79z"></path>
+  </svg>
+</button>
+
+<script>
+  (function () {
+    var toggleBtn = document.getElementById('dark-mode-toggle');
+    if (!toggleBtn) return;
+
+    var metaTheme = document.querySelector('meta[name="color-scheme"]');
+
+    function getSystemTheme() {
+      if (window.matchMedia) {
+        return window.matchMedia('(prefers-color-scheme: dark)').matches ? 'dark' : 'light';
+      }
+      return 'light';
+    }
+
+    function getSavedTheme() {
+      try {
+        var val = localStorage.getItem('color-scheme');
+        if (val === 'dark' || val === 'light') {
+          return val;
+        }
+        return null;
+      } catch (e) {
+        return null;
+      }
+    }
+
+    function isArabicRTL() {
+      var docEl = document.documentElement;
+      var dir = docEl.getAttribute('dir');
+      var lang = docEl.getAttribute('lang') || docEl.lang;
+      return dir === 'rtl' || lang === 'ar';
+    }
+
+    function syncState() {
+      var saved = getSavedTheme();
+      if (saved !== null) {
+        document.documentElement.setAttribute('data-color-scheme', saved);
+        document.documentElement.setAttribute('data-theme', saved);
+        if (metaTheme) {
+          metaTheme.setAttribute('content', saved);
+        }
+      } else {
+        document.documentElement.removeAttribute('data-color-scheme');
+        document.documentElement.removeAttribute('data-theme');
+        if (metaTheme) {
+          metaTheme.setAttribute('content', 'light dark');
+        }
+      }
+    }
+
+    function updateUI() {
+      var saved = getSavedTheme();
+      var isPinned = (saved !== null);
+      var effectiveTheme = isPinned ? saved : getSystemTheme();
+      var isRTL = isArabicRTL();
+      var label = '';
+
+      toggleBtn.setAttribute('data-pinned', isPinned ? 'true' : 'false');
+      toggleBtn.setAttribute('aria-pressed', isPinned ? 'true' : 'false');
+      toggleBtn.setAttribute('data-current-theme', effectiveTheme);
+
+      if (isPinned) {
+        label = isRTL
+          ? 'إعادة ضبط المظهر إلى الوضع التلقائي للنظام'
+          : 'Reset to system theme';
+      } else {
+        var nextTheme = (effectiveTheme === 'dark') ? 'light' : 'dark';
+        if (isRTL) {
+          label = (nextTheme === 'dark')
+            ? 'تبديل إلى الوضع الداكن'
+            : 'تبديل إلى الوضع الفاتح';
+        } else {
+          label = (nextTheme === 'dark')
+            ? 'Switch to dark mode'
+            : 'Switch to light mode';
+        }
+      }
+
+      toggleBtn.setAttribute('aria-label', label);
+      toggleBtn.setAttribute('title', label);
+    }
+
+    function toggleTheme() {
+      var saved = getSavedTheme();
+      if (saved !== null) {
+        // Currently pinned -> reset to system default
+        try {
+          localStorage.removeItem('color-scheme');
+        } catch (e) {}
+        syncState();
+      } else {
+        // Currently unpinned -> pin opposite of current system setting
+        var systemTheme = getSystemTheme();
+        var targetTheme = (systemTheme === 'dark') ? 'light' : 'dark';
+        try {
+          localStorage.setItem('color-scheme', targetTheme);
+        } catch (e) {}
+        syncState();
+      }
+      updateUI();
+    }
+
+    toggleBtn.addEventListener('click', toggleTheme);
+
+    if (window.matchMedia) {
+      var darkQuery = window.matchMedia('(prefers-color-scheme: dark)');
+      var mqListener = function () {
+        if (!getSavedTheme()) {
+          updateUI();
+        }
+      };
+      if (darkQuery.addEventListener) {
+        darkQuery.addEventListener('change', mqListener);
+      } else if (darkQuery.addListener) {
+        darkQuery.addListener(mqListener);
+      }
+    }
+
+    syncState();
+    updateUI();
+  })();
+</script>

data/_includes/print-social-links.html

@@ -1,75 +1,79 @@
 <!-- and guess where these are defined? Yup, you guessed it: the _config.yml file -->
 {% if site.resume_print_social_links %}
+{% assign is_ar = false %}
+{% if page.layout == "resume-ar" or page.lang == "ar" or page.language == "ar" or layout.lang == "ar" %}
+    {% assign is_ar = true %}
+{% endif %}
 <ul>
 
     {% if site.social_links.github %}
         <!-- GitHub link -->
-        <li><strong>Github</strong>: {{ site.social_links.github }}</li>
+        <li><strong>{% if is_ar %}جيت هاب (GitHub){% else %}GitHub{% endif %}</strong>: <span dir="ltr">{{ site.social_links.github }}</span></li>
     {% endif %}
 
     {% if site.social_links.twitter %}
         <!-- Twitter link -->
-        <li><strong>Twitter</strong>: {{ site.social_links.twitter }}</li>
+        <li><strong>{% if is_ar %}إكس / تويتر (X / Twitter){% else %}X (Twitter){% endif %}</strong>: <span dir="ltr">{{ site.social_links.twitter }}</span></li>
     {% endif %}
 
     {% if site.social_links.medium %}
         <!-- Medium link -->
-        <li><strong>Medium</strong>: {{ site.social_links.medium }}</li>
+        <li><strong>{% if is_ar %}ميديام (Medium){% else %}Medium{% endif %}</strong>: <span dir="ltr">{{ site.social_links.medium }}</span></li>
     {% endif %}
 
     {% if site.social_links.dribbble %}
         <!-- Dribbble link -->
-        <li><strong>Dribbble</strong>: {{ site.social_links.dribbble }}</li>
+        <li><strong>{% if is_ar %}دريبل (Dribbble){% else %}Dribbble{% endif %}</strong>: <span dir="ltr">{{ site.social_links.dribbble }}</span></li>
     {% endif %}
 
     {% if site.social_links.facebook %}
         <!-- Facebook link -->
-        <li><strong>Facebook</strong>: {{ site.social_links.facebook }}</li>
+        <li><strong>{% if is_ar %}فيسبوك (Facebook){% else %}Facebook{% endif %}</strong>: <span dir="ltr">{{ site.social_links.facebook }}</span></li>
     {% endif %}
 
     {% if site.social_links.linkedin %}
         <!-- LinkedIn link -->
-        <li><strong>LinkedIn</strong>: {{ site.social_links.linkedin }}</li>
+        <li><strong>{% if is_ar %}لينكد إن (LinkedIn){% else %}LinkedIn{% endif %}</strong>: <span dir="ltr">{{ site.social_links.linkedin }}</span></li>
     {% endif %}
 
     {% if site.social_links.instagram %}
         <!-- Instagram link -->
-        <li><strong>Instagram</strong>: {{ site.social_links.instagram }}</li>
+        <li><strong>{% if is_ar %}إنستغرام (Instagram){% else %}Instagram{% endif %}</strong>: <span dir="ltr">{{ site.social_links.instagram }}</span></li>
     {% endif %}
 
     {% if site.social_links.website %}
         <!-- Website link -->
-        <li><strong>Website</strong>: {{ site.social_links.website }}</li>
+        <li><strong>{% if is_ar %}الموقع الشخصي (Website){% else %}Website{% endif %}</strong>: <span dir="ltr">{{ site.social_links.website }}</span></li>
     {% endif %}
 
     {% if site.social_links.whatsapp %}
         <!-- Whatsapp link -->
-        <li><strong>Whatsapp</strong>: {{ site.social_links.whatsapp }}</li>
+        <li><strong>{% if is_ar %}واتساب (WhatsApp){% else %}WhatsApp{% endif %}</strong>: <span dir="ltr">{{ site.social_links.whatsapp }}</span></li>
     {% endif %}
 
     {% if site.social_links.devto %}
         <!-- Devto link -->
-        <li><strong>Devto</strong>: {{ site.social_links.devto }}</li>
+        <li><strong>{% if is_ar %}ديف تو (Dev.to){% else %}Dev.to{% endif %}</strong>: <span dir="ltr">{{ site.social_links.devto }}</span></li>
     {% endif %}
 
     {% if site.social_links.flickr %}
         <!-- Flickr link -->
-        <li><strong>Flickr</strong>: {{ site.social_links.flickr }}</li>
+        <li><strong>{% if is_ar %}فليكر (Flickr){% else %}Flickr{% endif %}</strong>: <span dir="ltr">{{ site.social_links.flickr }}</span></li>
     {% endif %}
 
     {% if site.social_links.pinterest %}
         <!-- Pinterest link -->
-        <li><strong>Pinterest</strong>: {{ site.social_links.pinterest }}</li>
+        <li><strong>{% if is_ar %}بينتيريست (Pinterest){% else %}Pinterest{% endif %}</strong>: <span dir="ltr">{{ site.social_links.pinterest }}</span></li>
     {% endif %}
 
     {% if site.social_links.telegram %}
         <!-- Telegram link -->
-        <li><strong>Telegram</strong>: {{ site.social_links.telegram }}</li>
+        <li><strong>{% if is_ar %}تيليجرام (Telegram){% else %}Telegram{% endif %}</strong>: <span dir="ltr">{{ site.social_links.telegram }}</span></li>
     {% endif %}
 
     {% if site.social_links.youtube %}
         <!-- Youtube link -->
-        <li><strong>Youtube</strong>: {{ site.social_links.youtube }}</li>
+        <li><strong>{% if is_ar %}يوتيوب (YouTube){% else %}YouTube{% endif %}</strong>: <span dir="ltr">{{ site.social_links.youtube }}</span></li>
     {% endif %}
 
 </ul>

data/_includes/resume-head-ar.html

@@ -1,14 +1,14 @@
-{% if site.resume_theme == 'default' %}
-    <!-- Arabic-friendly font (Cairo) -->
-    <link href="https://fonts.googleapis.com/css2?family=Cairo:wght@300;400;700;900&display=swap" rel="stylesheet">
+{% if site.font_ar_url %}
+    <!-- Custom Arabic Font Stylesheet -->
+    <link rel="stylesheet" href="{{ site.font_ar_url | relative_url }}">
+{% elsif site.disable_google_fonts != true and site.resume_theme != 'no-custom-fonts' %}
+    <!-- Arabic-friendly font (Cairo) with preconnect for performance -->
+    <link rel="preconnect" href="https://fonts.googleapis.com">
+    <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
+    <link href="https://fonts.googleapis.com/css2?family=Cairo:wght@300;400;600;700;900&display=swap" rel="stylesheet">
 {% endif %}
 
 <link rel="stylesheet" type="text/css" href="{{ 'assets/css/cv-ar.css' | relative_url }}">
 
-<!-- favicons generated by favicon.io -->
-<link rel="apple-touch-icon" sizes="180x180" href="{{ 'assets/favicon/resume/apple-touch-icon.png' | relative_url }}">
-<link rel="icon" type="image/png" sizes="32x32" href="{{ 'assets/favicon/resume/favicon-32x32.png' | relative_url }}">
-<link rel="icon" type="image/png" sizes="16x16" href="{{ 'assets/favicon/resume/favicon-16x16.png' | relative_url }}">
-<link rel="manifest" href="{{ 'assets/favicon/resume/site.webmanifest' | relative_url }}">
 
 {% include hreflang.html %}

data/_includes/resume-head-en.html

@@ -4,10 +4,5 @@
 
 <link rel="stylesheet" type="text/css" href="{{ 'assets/css/cv.css' | relative_url }}">
 
-<!-- favicons generated by favicon.io -->
-<link rel="apple-touch-icon" sizes="180x180" href="{{ 'assets/favicon/resume/apple-touch-icon.png' | relative_url }}">
-<link rel="icon" type="image/png" sizes="32x32" href="{{ 'assets/favicon/resume/favicon-32x32.png' | relative_url }}">
-<link rel="icon" type="image/png" sizes="16x16" href="{{ 'assets/favicon/resume/favicon-16x16.png' | relative_url }}">
-<link rel="manifest" href="{{ 'assets/favicon/resume/site.webmanifest' | relative_url }}">
 
 {% include hreflang.html %}

data/_includes/resume-section-ar.html

@@ -99,7 +99,7 @@
                             <span class="resume-item-copy-license-cert-id">معرّف الاعتماد:
                             {% if certification.credential_url %}
                                 <a href="{{ certification.credential_url }}" target="_blank" rel="noopener nofollow noreferrer">{{ certification.credential_id }}</a>
-                                <span class="print-only-inline">&nbsp;({{ certification.credential_url }})</span>
+                                <span class="print-only-inline" dir="ltr">&nbsp;({{ certification.credential_url }})</span>
                             </span>
                             {% else %}
                                 {{ certification.credential_id }}
@@ -136,7 +136,7 @@
                         <p class="resume-item-copy">معرّف الاعتماد:
                             {% if course.credential_url %}
                                 <a href="{{ course.credential_url }}" target="_blank" rel="noopener nofollow noreferrer">{{ course.credential_id }}</a>
-                                <span class="print-only-inline">&nbsp;({{ course.credential_url }})</span>
+                                <span class="print-only-inline" dir="ltr">&nbsp;({{ course.credential_url }})</span>
                             {% else %}
                                 {{ course.credential_id }}
                             {% endif %}
@@ -210,7 +210,7 @@
                     </h3>
 
                     {% if project.url %}
-                        <span class="print-only-inline" style="display: inline;">&nbsp;{{ project.url }}</span>
+                        <span class="print-only-inline" dir="ltr" style="display: inline;">&nbsp;{{ project.url }}</span>
                     {% endif %}
 
                     <h4 class="resume-item-details" itemprop="description">{{ project.role }} &bull; {{ project.duration }}</h4>
@@ -281,7 +281,7 @@
                     </h3>
 
                     {% if association.url %}
-                        <span class="print-only-inline" style="display: inline;">&nbsp;{{ association.url }}</span>
+                        <span class="print-only-inline" dir="ltr" style="display: inline;">&nbsp;{{ association.url }}</span>
                     {% endif %}
 
                     <h4 class="resume-item-details" itemprop="description">{{ association.role }} &bull; {{ association.year }}</h4>
@@ -359,8 +359,8 @@
                 {% for link in resume_data.links %}
                     {% if link.active == true %}
                         <li>
-                            <a href={{ link.url }} target="_blank" rel="noopener nofollow noreferrer" itemprop="url">{{ link.description }}</a>
-                            <span class="print-only-inline">&nbsp;{{ link.url }}</span>
+                            <a href="{{ link.url }}" target="_blank" rel="noopener nofollow noreferrer" itemprop="url">{{ link.description }}</a>
+                            <span class="print-only-inline" dir="ltr">&nbsp;{{ link.url }}</span>
                         </li>
                     {% endif %}
                 {% endfor %}

data/_includes/resume-section-en.html

@@ -358,7 +358,7 @@
                 {% for link in resume_data.links %}
                     {% if link.active == true %}
                         <li>
-                            <a href={{ link.url }} target="_blank" rel="noopener nofollow noreferrer" itemprop="url">{{ link.description }}</a>
+                            <a href="{{ link.url }}" target="_blank" rel="noopener nofollow noreferrer" itemprop="url">{{ link.description }}</a>
                             <span class="print-only-inline">&nbsp;{{ link.url }}</span>
                         </li>
                     {% endif %}

data/_includes/shared-head.html

@@ -1,11 +1,33 @@
 <meta charset="UTF-8">
 <meta http-equiv="X-UA-Compatible" content="IE=edge">
 <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1, viewport-fit=cover">
+<meta name="color-scheme" content="light dark">
+<script>
+  (function() {
+    try {
+      var saved = localStorage.getItem('color-scheme');
+      if (saved === 'dark' || saved === 'light') {
+        document.documentElement.setAttribute('data-color-scheme', saved);
+        document.documentElement.setAttribute('data-theme', saved);
+        var meta = document.querySelector('meta[name="color-scheme"]');
+        if (meta) {
+          meta.setAttribute('content', saved);
+        }
+      }
+    } catch (e) {
+      // Graceful fallback if localStorage is restricted (private browsing / iframe sandboxing)
+    }
+  })();
+</script>
 
-<link rel="shortcut icon" href="favicon.ico" type="image/x-icon">
-<link rel="icon" href="favicon.ico" type="image/x-icon">
-
-<link rel="canonical" href="{{ page.url | replace:'index.html','' | prepend: site.baseurl | prepend: site.url }}">
+<!-- Favicons -->
+{% assign favicon_path = site.favicon | default: 'assets/favicon/resume/favicon.ico' %}
+<link rel="shortcut icon" href="{{ favicon_path | relative_url }}" type="image/x-icon">
+<link rel="icon" href="{{ favicon_path | relative_url }}" type="image/x-icon">
+<link rel="apple-touch-icon" sizes="180x180" href="{{ site.apple_touch_icon | default: 'assets/favicon/resume/apple-touch-icon.png' | relative_url }}">
+<link rel="icon" type="image/png" sizes="32x32" href="{{ site.favicon_32 | default: 'assets/favicon/resume/favicon-32x32.png' | relative_url }}">
+<link rel="icon" type="image/png" sizes="16x16" href="{{ site.favicon_16 | default: 'assets/favicon/resume/favicon-16x16.png' | relative_url }}">
+<link rel="manifest" href="{{ 'assets/favicon/resume/site.webmanifest' | relative_url }}">
 
 {% if page.noindex == true -%}
 <meta name="robots" content="noindex noarchive nosnippet noimageindex">