jekyll-theme-centos 0.0.0

data/_includes/base/content.html.liquid

@@ -0,0 +1,7 @@
+{%- assign content_schema_key = "content_schema" %}
+{%- assign content_schema     = include.schema
+                              | default: site.data[content_schema_key]
+                              | default: site.data.base[content_schema_key]
+-%}
+
+{{ content }}

data/_includes/base/copyright.html.liquid

@@ -0,0 +1,70 @@
+{% comment %}
+================================================================================
+Template: Copyright Footer Component
+Purpose: Renders copyright notice with author name and optional legal links.
+Shows dynamic year, author, and links to Terms of Service, Privacy Policy, etc.
+================================================================================
+
+Design Logic:
+- Dynamic year: automatically uses current year from site.time
+- Legal links looping: flexible number of links in footer
+- Reusable link component: consistent styling
+- Capture-based rendering: builds complex link string before output
+- Border separator styling: visual dividers between links
+
+Required Inputs:
+- author: Copyright holder name (e.g., "The CentOS Project")
+
+Optional Inputs:
+- legals: Array of legal link objects
+  - name: Link text (e.g., "Terms of Service")
+  - link: URL for legal document
+  - color: Link color (defaults to light)
+  - icon: Icon class (optional)
+  - class: Custom CSS classes (optional)
+
+Data Source Hierarchy (priority):
+1. include.data
+2. page.with_copyright_data
+3. site.data.copyright
+4. site.data.base.copyright
+================================================================================
+{% endcomment %}
+
+{%- assign with_copyright = include.with_copyright
+| default: page.with_copyright
+%}
+
+{%- assign with_copyright_data = include.data
+| default: page.with_copyright_data
+| default: site.data.copyright
+| default: site.data.base.copyright
+%}
+
+{%- assign with_copyright_schema = site.data.base.copyright_schema.properties.with_copyright_data.properties %}
+
+{%- if with_copyright %}
+
+{%- comment %} === Presentation === {% endcomment %}
+{%- comment %} --- Defaults --- {% endcomment %}
+{%- assign copyright_author = with_copyright_data.author | default: with_copyright_schema.author.default %}
+{%- assign copyright_legals = with_copyright_data.legals | default: with_copyright_schema.legals.default %}
+
+{%- capture copyright_links -%}
+{%- for item in copyright_legals -%}
+{%- assign copyright_link_class = item.class | default: "link link-offset-3 link-offset-3-hover link-underline-primary link-underline-opacity-0 link-underline-opacity-100-hover border-start ms-2 ps-2 link-light" %}
+{%- include base/link.html.liquid
+    class         = copyright_link_class
+    name          = item.name
+    link          = item.link
+    color         = item.color
+    role          = item.role
+    icon          = item.icon
+    icon_position = item.icon_position
+-%}
+{%- endfor -%}
+{%- endcapture -%}
+
+{%- comment %} --- HTML --- {% endcomment %}
+<p class="my-1">Copyright &copy; {{ site.time | date: "%Y" }} {{ copyright_author }} {{ copyright_links }}</p>
+{%- endif -%}

data/_includes/base/copyvalue.html.liquid

@@ -0,0 +1,82 @@
+{% comment %}
+================================================================================
+Template: Copy Value Component
+Purpose: Copy to clipboard with visual feedback (checkmark + tooltip).
+Auto-detects and handles both escaped and unescaped values.
+================================================================================
+
+Recommended Usage (in template):
+  <span role="button" class="copy-btn" data-copy-value="{{ command | escape }}"
+        data-bs-toggle="tooltip" data-bs-title="Copy command">
+    <span class="fa-regular fa-copy"></span>
+  </span>
+
+Strategic Design Logic:
+- Armored implementation: handles escaped and unescaped values
+- HTML entity detection: decodes &quot;, &amp;, &#39; automatically
+- Visual feedback: checkmark icon + success tooltip
+- Auto-reset: returns to original state after delay
+- Clipboard API: native browser copy functionality
+
+Required Inputs (from HTML element):
+- class="copy-btn": Element to attach handler
+- data-copy-value: Text to copy to clipboard
+
+Optional Inputs (from data objects):
+- reset_delay: Milliseconds before reset (default varies by schema)
+- checkmark_path: SVG path for success icon
+- checkmark_viewbox: SVG viewBox for success icon
+- success_message: Tooltip message on success
+
+Data Source Hierarchy (in priority order):
+1. include.data             - Explicitly passed configuration
+2. page.with_copyvalue_data - Page front matter
+3. site.data.copyvalue      - Site configuration
+4. site.data.base.copyvalue - Theme defaults
+
+Dependencies:
+Bootstrap 5, FontAwesome 6+, Clipboard API (modern browsers)
+================================================================================
+{% endcomment %}
+
+{%- assign with_copyvalue = include.with_copyvalue
+| default: page.with_copyvalue
+%}
+
+{%- assign with_copyvalue_data = include.data
+| default: page.with_copyvalue_data
+| default: site.data.copyvalue
+| default: site.data.base.copyvalue
+%}
+
+{%- assign with_copyvalue_schema = site.data.base.copyvalue_schema.properties.with_copyvalue_data.properties %}
+
+{%- if with_copyvalue %}
+
+{%- comment %} === Presentation === {% endcomment %}
+
+{%- comment %} --- Defaults --- {% endcomment %}
+{%- assign copyvalue_reset_delay       = with_copyvalue_data.reset_delay       | default: with_copyvalue_schema.reset_delay.default %}
+{%- assign copyvalue_checkmark_path    = with_copyvalue_data.checkmark_path    | default: with_copyvalue_schema.checkmark_path.default %}
+{%- assign copyvalue_checkmark_viewbox = with_copyvalue_data.checkmark_viewbox | default: with_copyvalue_schema.checkmark_viewbox.default %}
+{%- assign copyvalue_success_message   = with_copyvalue_data.success_message   | default: with_copyvalue_schema.success_message.default %}
+
+{%- comment %} --- HTML --- {% endcomment %}
+<!-- Load Copy Value functionality with configuration via data attributes -->
+<script id="centos-copyvalue"
+        {%- if with_copyvalue_data.reset_delay %}
+        data-reset-delay="{{ copyvalue_reset_delay }}"
+        {%- endif %}
+        {%- if with_copyvalue_data.checkmark_path %}
+        data-checkmark-path="{{ copyvalue_checkmark_path }}"
+        {%- endif %}
+        {%- if with_copyvalue_data.checkmark_viewbox %}
+        data-checkmark-viewbox="{{ copyvalue_checkmark_viewbox }}"
+        {%- endif %}
+        {%- if with_copyvalue_data.success_message %}
+        data-success-message="{{ copyvalue_success_message }}"
+        {%- endif %}
+        src="{{ site.baseurl }}/assets/js/base/copyvalue.min.js"
+        defer></script>
+
+{%- endif %}

data/_includes/base/datatable.html.liquid

@@ -0,0 +1,83 @@
+{% comment %}
+================================================================================
+Template: DataTables Library Initialization Component
+Purpose: Loads DataTables jQuery plugin from CDN with SRI integrity checks.
+Initializes DataTables on all .dataTable elements with responsive design,
+pagination, searching, and sorting.
+================================================================================
+
+Design Logic:
+- CDN-based library loading with SRI integrity checks
+- Responsive table design for mobile devices
+- Smart pagination: only if table has >10 rows
+- Automatic element detection: targets all .dataTable classes
+- jQuery dependency: requires jQuery loaded first
+
+Optional Inputs:
+- type: "head" for CSS include, "script" for JavaScript
+- version: DataTables version (e.g., "1.13.7")
+- css_integrity, script_integrity: SRI integrity hashes
+- page_length: Default rows per page (default: 10)
+- length_menu: Pagination options
+- data: DataTables configuration object
+
+Data Source Hierarchy (priority):
+1. include.data
+2. page.with_datatable_data
+3. site.data.datatable
+4. site.data.base.datatable
+================================================================================
+{% endcomment %}
+
+{%- assign with_datatable = include.with_datatable
+| default: page.with_datatable
+%}
+
+{%- assign with_datatable_data = include.data
+| default: page.with_datatable_data
+| default: site.data.datatable
+| default: site.data.base.datatable
+%}
+
+{%- assign with_datatable_schema = site.data.base.datatable_schema.properties.with_datatable_data.properties %}
+
+{%- if with_datatable %}
+
+{%- comment %} === Presentation === {% endcomment %}
+{%- comment %} --- Defaults --- {% endcomment %}
+{%- assign datatable_version          = with_datatable_data.version          | default: with_datatable_schema.version.default %}
+{%- assign datatable_css_integrity    = with_datatable_data.css_integrity    | default: with_datatable_schema.css_integrity.default %}
+{%- assign datatable_script_integrity = with_datatable_data.script_integrity | default: with_datatable_schema.script_integrity.default %}
+{%- assign datatable_page_length      = with_datatable_data.page_length      | default: with_datatable_schema.page_length.default %}
+{%- assign datatable_length_menu      = with_datatable_data.length_menu      | default: with_datatable_schema.length_menu.default %}
+
+{%- capture html_datatable_head %}
+  <link href="https://cdn.datatables.net/{{ datatable_version }}/datatables.min.css" rel="stylesheet" integrity="{{ datatable_css_integrity }}" crossorigin="anonymous" referrerpolicy="no-referrer" />
+{%- endcapture %}
+
+{%- capture html_datatable_script %}
+  <!-- DataTables Library -->
+  <script src="https://cdn.datatables.net/{{ datatable_version }}/datatables.min.js" integrity="{{ datatable_script_integrity }}" crossorigin="anonymous" referrerpolicy="no-referrer" defer></script>
+
+  <!-- Initialize DataTables with configuration via data attributes -->
+  <script id="centos-datatable"
+          {%- if with_datatable_data.page_length %}
+          data-page-length="{{ datatable_page_length }}"
+          {%- endif %}
+          {%- if with_datatable_data.length_menu %}
+          data-length-menu='{{ datatable_length_menu | split: "," | jsonify }}'
+          {%- endif %}
+          src="{{ site.baseurl }}/assets/js/base/datatable.min.js"
+          defer></script>
+{%- endcapture %}
+
+{%- comment %} --- HTML --- {% endcomment %}
+{%- assign type = include.type %}
+{%- case type %}
+{%- when "head" %}
+  {{ html_datatable_head }}
+{%- when "script" %}
+  {{ html_datatable_script }}
+{%- endcase %}
+
+{%- endif %}

data/_includes/base/event.html.liquid

@@ -0,0 +1,105 @@
+{% comment %}
+================================================================================
+Template: Event Alerts Component
+Purpose: Renders event announcements as styled alert boxes with date, location,
+description, and optional action links.
+================================================================================
+
+Design Logic:
+- Alert-based styling: consistent with Bootstrap alert components
+- Icon support: visual identification of event type
+- Color coding: color-based categorization
+- Location details: address and city information optional
+- Date/time display: with location suffix if available
+- Optional action link: "Know more" button for details page
+- Multi-event support: loops through event array
+
+Required Inputs:
+- title: Event name/title
+
+Optional Inputs:
+- description: Event description text
+- date: Event date/time string
+- location: Event location name
+- color: Alert color scheme (default: "secondary")
+- icon: Icon class (default: "fa-solid fa-calendar")
+- link: URL to event details page (optional)
+- data: Array of event objects
+
+Data Source Hierarchy (priority):
+1. include.data
+2. page.with_event_data
+3. site.data.event
+4. site.data.base.event
+================================================================================
+{% endcomment %}
+
+{%- assign with_event = include.with_event
+| default: page.with_event
+%}
+
+{%- assign with_event_data = include.data
+| default: page.with_event_data
+| default: site.data.event
+| default: site.data.base.event
+%}
+
+{%- if with_event %}
+
+{%- assign with_event_schema = site.data.base.event_schema.properties.with_event_data.items.properties %}
+
+{%- comment %} === Presentation === {% endcomment %}
+{%- if with_event_data.size > 0 %}
+<div class="mb-3">
+  {%- for event in with_event_data %}
+    {%- comment %} --- Defaults --- {% endcomment %}
+    {%- assign event_address     = event.address     | default: with_event_schema.address.default %}
+    {%- assign event_city        = event.city        | default: with_event_schema.city.default %}
+    {%- assign event_color       = event.color       | default: with_event_schema.color.default %}
+    {%- assign event_location    = event.location    | default: with_event_schema.location.default %}
+    {%- assign event_date        = event.date        | default: with_event_schema.date.default %}
+    {%- assign event_description = event.description | default: with_event_schema.description.default %}
+    {%- assign event_icon        = event.icon        | default: with_event_schema.icon.default %}
+    {%- assign event_image_url   = event.image_url   | default: with_event_schema.image_url.default %}
+    {%- assign event_link        = event.link        | default: with_event_schema.link.default %}
+    {%- assign event_title       = event.title       | default: with_event_schema.title.default %}
+
+    {%- assign event_btn_class = "btn btn-sm text-nowrap btn-" | append: event_color %}
+
+    {%- comment %} --- HTML --- {% endcomment %}
+    <div class="alert alert-{{ event_color }} rounded mb-1" role="alert">
+      <div class="d-flex justify-content-between align-items-start">
+        {%- if event_icon != "" %}
+          <div class="h6 my-1 me-2"><i class="{{ event_icon }}"></i></div>
+        {%- endif %}
+        <div class="flex-fill text-start">
+          {%- if event_title != "" %}
+            <p class="ms-1 fw-bold mb-0">{{ event_title }}</p>
+          {%- endif %}
+          {%- if event_date != "" %}
+            <p class="ms-1 mb-0">{{ event_date }}{% if event_location != "" %} • {{ event_location }}{%- endif %}</p>
+          {%- endif %}
+          {%- if event_description != "" %}
+            <p class="ms-1 mb-0">{{ event_description }}</p>
+          {%- endif %}
+        </div>
+        {%- if event_link != "" %}
+          <div class="ms-1">
+            {% include base/link.html.liquid
+            name          = "Know more"
+            icon          = "fa-solid fa-arrow-right"
+            icon_position = "end"
+            role          = "button"
+            class         = event_btn_class
+            color         = event_color
+            link          = event_link
+            %}
+          </div>
+        {%- endif %}
+      </div>
+    </div>
+  {% endfor %}
+</div>
+{%- endif %}
+
+{%- endif -%}

data/_includes/base/fontawesome.html.liquid

@@ -0,0 +1,91 @@
+{% comment %}
+================================================================================
+Template: Font Awesome Icon Library Component
+Purpose: Loads Font Awesome icon library CSS and JavaScript from CDN
+with integrity checks.
+================================================================================
+
+Design Logic:
+- CDN-based library loading with SRI integrity verification
+- Two loading modes: svg+js (default) and css
+  - svg+js: JavaScript bundle replaces <i> tags with inline SVGs via DOM mutation;
+    enables power transforms, layering, pseudo-element watching
+  - css: stylesheet + WOFF2 font files loaded on demand; lighter payload, no DOM cost
+- Format switching: separate head (CSS link) and script (JS) includes; preload hints mode-aware
+- Subresource Integrity (SRI): ensures file hasn't been tampered with
+- Privacy-focused: referrerpolicy="no-referrer"
+
+Optional Inputs:
+- type: "preload" for resource hint, "head" for CSS link, "script" for JavaScript
+- mode: "svg+js" (default) or "css" — controls which assets are emitted per type
+- version: Font Awesome version (e.g., "7.0.1")
+- cdn: CDN base URL (default: cdnjs.cloudflare.com)
+- css_bundle_name, js_bundle_name: Bundle identifiers
+- css_bundle_integrity, js_bundle_integrity: SRI hashes
+- data: Font Awesome configuration object
+
+Data Source Hierarchy (priority):
+1. include.data
+2. page.with_fontawesome_data
+3. site.data.fontawesome
+4. site.data.base.fontawesome
+================================================================================
+{% endcomment %}
+
+{%- assign with_fontawesome = include.with_fontawesome
+| default: page.with_fontawesome
+%}
+
+{%- assign with_fontawesome_data = include.data
+| default: page.with_fontawesome_data
+| default: site.data.fontawesome
+| default: site.data.base.fontawesome
+%}
+
+{%- assign with_fontawesome_schema = site.data.base.fontawesome_schema.properties.with_fontawesome_data.properties %}
+
+{%- if with_fontawesome %}
+
+{%- comment %} === Presentation === {% endcomment %}
+
+{%- comment %} --- Defaults --- {% endcomment %}
+{%- assign fontawesome_version              = with_fontawesome_data.version              | default: with_fontawesome_schema.version.default %}
+{%- assign fontawesome_cdn                  = with_fontawesome_data.cdn                  | default: with_fontawesome_schema.cdn.default %}
+{%- assign fontawesome_css_bundle_name      = with_fontawesome_data.css_bundle_name      | default: with_fontawesome_schema.css_bundle_name.default %}
+{%- assign fontawesome_css_bundle_integrity = with_fontawesome_data.css_bundle_integrity | default: with_fontawesome_schema.css_bundle_integrity.default %}
+{%- assign fontawesome_js_bundle_name       = with_fontawesome_data.js_bundle_name       | default: with_fontawesome_schema.js_bundle_name.default %}
+{%- assign fontawesome_js_bundle_integrity  = with_fontawesome_data.js_bundle_integrity  | default: with_fontawesome_schema.js_bundle_integrity.default %}
+{%- assign fontawesome_mode                 = with_fontawesome_data.mode                 | default: with_fontawesome_schema.mode.default | default: "svg+js" %}
+
+{%- capture html_fontawesome_preload %}
+{%- if fontawesome_mode == "css" %}
+<link rel="preload" href="{{ fontawesome_cdn }}/{{ fontawesome_version }}/css/{{ fontawesome_css_bundle_name }}.min.css" as="style" fetchpriority="high" crossorigin="anonymous" />
+{%- else %}
+<link rel="preload" href="{{ fontawesome_cdn }}/{{ fontawesome_version }}/js/{{ fontawesome_js_bundle_name }}.min.js" as="script" fetchpriority="high" crossorigin="anonymous" />
+{%- endif %}
+{%- endcapture %}
+
+{%- capture html_fontawesome_head %}
+{%- if fontawesome_mode == "css" %}
+<link rel="stylesheet" href="{{ fontawesome_cdn }}/{{ fontawesome_version }}/css/{{ fontawesome_css_bundle_name }}.min.css" integrity="{{ fontawesome_css_bundle_integrity }}" crossorigin="anonymous" referrerpolicy="no-referrer" />
+{%- endif %}
+{%- endcapture %}
+
+{%- capture html_fontawesome_script %}
+{%- if fontawesome_mode == "svg+js" %}
+<script src="{{ fontawesome_cdn }}/{{ fontawesome_version }}/js/{{ fontawesome_js_bundle_name }}.min.js" integrity="{{ fontawesome_js_bundle_integrity }}" crossorigin="anonymous" referrerpolicy="no-referrer" defer></script>
+{%- endif %}
+{%- endcapture %}
+
+{%- comment %} --- HTML --- {% endcomment %}
+{%- assign type = include.type %}
+{%- case type %}
+{%- when "preload" %}
+{{ html_fontawesome_preload }}
+{%- when "head" %}
+{{ html_fontawesome_head }}
+{%- when "script" %}
+{{ html_fontawesome_script }}
+{%- endcase %}
+
+{% endif %}

data/_includes/base/footer.html.liquid

@@ -0,0 +1,69 @@
+{%- assign with_footer = include.with_footer
+| default: page.with_footer
+%}
+
+{%- assign with_footer_data = include.data
+| default: page.with_footer_data
+| default: site.data.footer
+| default: site.data.base.footer
+%}
+
+{%- if with_footer -%}
+
+{%- assign with_footer_schema = site.data.base.footer_schema.properties.with_footer_data.properties %}
+
+{%- assign footer_brand_image               = with_footer_data.brand_image               | default: with_footer_schema.brand_image.default %}
+{%- assign footer_brand_image_class         = with_footer_data.brand_image_class         | default: with_footer_schema.brand_image_class.default %}
+{%- assign footer_brand_image_height        = with_footer_data.brand_image_height        | default: with_footer_schema.brand_image_height.default %}
+{%- assign footer_brand_manifestation       = with_footer_data.brand_manifestation       | default: with_footer_schema.brand_manifestation.default %}
+{%- assign footer_brand_manifestation_class = with_footer_data.brand_manifestation_class | default: with_footer_schema.brand_manifestation_class.default %}
+
+<div class="container">
+  <div class="row justify-content-between align-items-start gx-5">
+    <div class="col-sm-12 col-lg-4">
+      {%- if footer_brand_image != "" %}
+        <a class="navbar-brand" href="{{ site.baseurl }}/">
+          <img
+              class="d-inline-block align-text-middle me-2{% if footer_brand_image_class != "" %} {{ footer_brand_image_class }}{% endif %}"
+              src="{{ site.baseurl }}/assets/img/{{ footer_brand_image }}"
+              height="{{ footer_brand_image_height }}"
+              alt="{{ site.title }}" />
+          {%- if footer_brand_manifestation != "" %}
+            <span class="d-inline-block align-text-middle fs-6 border-start border-1 border-light opacity-75 ps-3{% if footer_brand_manifestation_class != "" %} {{ footer_brand_manifestation_class }}{% endif %}">{{ footer_brand_manifestation }}</span>
+          {%- endif %}
+        </a>
+      {%- endif %}
+      {% if site.description %}
+        <p class="mt-2 mb-5">{{ site.description }}</p>
+      {% endif %}
+
+      {% include base/sponsors-carousel.html.liquid -%}
+    </div>
+
+    {% if page.with_shortcut %}
+      <div class="col-sm-12 col-lg-5">
+        {% include base/shortcut.html.liquid %}
+      </div>
+    {% endif %}
+
+    {% if page.with_locales or page.with_social %}
+      <div class="col-sm-12 col-lg-3 pb-5">
+        {% include base/locales.html.liquid %}
+        {% include base/social.html.liquid %}
+      </div>
+    {% endif %}
+
+  </div>
+</div>
+
+{% if page.with_copyright %}
+  <div class="container">
+    <div class="row justify-content-between align-items-center py-3">
+      <div class="col">
+        {% include base/copyright.html.liquid %}
+      </div>
+    </div>
+  </div>
+{% endif %}
+
+{%- endif -%}

data/_includes/base/head.html.liquid

@@ -0,0 +1,135 @@
+{% comment %}
+================================================================================
+Template: Page Head Section Component
+Purpose: Generates complete HTML <head> section with meta tags, stylesheets,
+icons, fonts, and conditional library includes.
+================================================================================
+
+Design Logic:
+- Comprehensive meta tags: charset, viewport, referrer policy, description, theme-color
+- Dynamic title generation: page title + site title
+- Favicon support: multiple formats (16x16, 32x32, SVG with type, Apple Touch)
+- Google Fonts: Montserrat (5 weights) and Source Code Pro (2 weights) via async stylesheet
+- Breakingnews scroll offset: dynamic CSS calculation
+- Conditional includes: OGP, Highlight.js, DataTables, FontAwesome (SVG+JS)
+- CSS prioritization: custom stylesheet last for override
+- Script loading: Bootstrap base first (defer), then optional extensions, then UI behaviors
+- Bootstrap and FontAwesome preloaded (high-priority fetch); CDN origins preconnected + dns-prefetched per active component
+
+Required Inputs:
+- page.title: Current page title
+- site.title: Site name/title
+- site.baseurl: Base URL for asset paths
+
+Optional Inputs:
+- page.with_ogp, page.with_fontawesome: Include OGP/Font Awesome SVG+JS (boolean)
+- page.with_breakingnews, page.with_highlight: Include breaking news/highlight
+- page.with_datatable: Include DataTables (boolean)
+- page.with_breakingnews_data: Array of breaking news items
+- page.with_backtotop: Include back-to-top button (boolean)
+- page.with_copyvalue: Include copy-to-clipboard behavior (boolean)
+- page.with_heading_anchor: Include heading anchor copy behavior (boolean)
+- page.theme_color, site.theme_color: Override browser chrome color (default: #A54C93)
+================================================================================
+{% endcomment %}
+
+<head>
+<meta charset="utf-8" />
+<meta name="viewport" content="width=device-width, initial-scale=1.0" />
+<meta name="referrer" content="strict-origin-when-cross-origin" />
+{% if page.title == site.title -%}
+  <title>{{ page.title }}</title>
+{% else -%}
+  <title>{{ page.title }} - {{ site.title }}</title>
+{% endif -%}
+<meta name="description" content="{{ page.description | default: page.excerpt | default: page.title_lead | default: site.description | strip_html | truncate: 160 }}" />
+{% include base/ogp.html.liquid %}
+<link rel="icon" href="{{ site.baseurl }}/assets/icons/favicon-16.png" sizes="16x16" />
+<link rel="icon" href="{{ site.baseurl }}/assets/icons/favicon-32.png" sizes="32x32" />
+<link rel="icon" href="{{ site.baseurl }}/assets/icons/favicon.svg" type="image/svg+xml" sizes="any" />
+<link rel="apple-touch-icon" href="{{ site.baseurl }}/assets/icons/apple-touch-icon.png" sizes="180x180" />
+<link rel="manifest" href="{{ site.baseurl }}/site.webmanifest" />
+{%- assign head_theme_color = page.theme_color | default: site.theme_color | default: '#A54C93' %}
+<meta name="theme-color" content="{{ head_theme_color }}" />
+<link rel="preconnect" href="https://fonts.googleapis.com" />
+<link rel="dns-prefetch" href="https://fonts.googleapis.com" />
+<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
+<link rel="dns-prefetch" href="https://fonts.gstatic.com" />
+{%- if page.with_fontawesome or page.with_highlight %}
+<link rel="preconnect" href="https://cdnjs.cloudflare.com" crossorigin />
+<link rel="dns-prefetch" href="https://cdnjs.cloudflare.com" />
+{%- endif %}
+{%- if page.with_highlight or page.with_backtotop %}
+<link rel="preconnect" href="https://unpkg.com" crossorigin />
+<link rel="dns-prefetch" href="https://unpkg.com" />
+{%- endif %}
+{%- if page.with_datatable %}
+<link rel="preconnect" href="https://cdn.datatables.net" crossorigin />
+<link rel="dns-prefetch" href="https://cdn.datatables.net" />
+{%- endif %}
+<link rel="preload" href="{{ site.baseurl }}/assets/js/bootstrap.bundle.min.js" as="script" fetchpriority="high" />
+{%- include base/fontawesome.html.liquid type="preload" %}
+<link rel="preload" href="https://fonts.googleapis.com/css2?family=Montserrat:wght@300;400;500;600;700&family=Source+Code+Pro:ital,wght@0,400;0,700&display=swap" as="style" onload="this.onload=null;this.rel='stylesheet'" />
+<noscript><link rel="stylesheet" href="https://fonts.googleapis.com/css2?family=Montserrat:wght@300;400;500;600;700&family=Source+Code+Pro:ital,wght@0,400;0,700&display=swap" /></noscript>
+<link rel="stylesheet" href="{{ site.baseurl }}/assets/css/base/stylesheet.min.css" />
+{%- comment %}
+Dynamic Breaking News Offset CSS
+Adjust scroll-margin-top values based on the number of breaking news items.
+Uses CSS custom properties for cleaner, more maintainable dynamic styling.
+{%- endcomment %}
+{%- assign breakingnews = page.with_breakingnews_data | default: site.data.breakingnews | default: site.data.base.breakingnews %}
+{%- if page.with_breakingnews == true and breakingnews.size > 0 %}
+  {%- assign breakingnews_alert_height = site.data.base.breakingnews_schema.properties.breakingnews_alert_height.default %}
+  {%- assign navbar_height = site.data.base.navbar_schema.properties.navbar_height.default %}
+  {%- assign breakingnews_offset = 0 %}
+  {%- for item in breakingnews %}
+    {%- if forloop.first %}
+      {%- assign breakingnews_offset = breakingnews_alert_height | plus: navbar_height %}
+    {%- else %}
+      {%- assign breakingnews_offset = breakingnews_offset | plus: breakingnews_alert_height %}
+    {%- endif %}
+  {%- endfor %}
+  {%- assign heading_margin_px = 48 %}
+  {%- assign heading_scroll_margin_height = breakingnews_offset | plus: heading_margin_px %}
+  {%- assign accordion_scroll_margin_height = breakingnews_offset %}
+  <style>
+  :root {
+    --calculated-heading-offset: {{ heading_scroll_margin_height }}px;
+    --calculated-accordion-offset: {{ accordion_scroll_margin_height }}px;
+  }
+  main {
+    .content > h1,
+    .content > h2,
+    .content > h3,
+    .content > h4,
+    .content > h5,
+    .content > h6 {
+      scroll-margin-top: calc(var(--calculated-heading-offset) * 1.3) !important;
+    }
+    .content .accordion,
+    .content .accordion-item {
+      scroll-margin-top: calc(var(--calculated-accordion-offset) * 1.5) !important;
+    }
+  }
+  </style>
+{%- endif %}
+
+{%- comment %} CSS dependencies {%- endcomment %}
+{%- include base/fontawesome.html.liquid type="head" %}
+{%- include base/highlight.html.liquid type="head" %}
+{%- include base/datatable.html.liquid type="head" %}
+
+{%- comment %} JavaScript base — Bootstrap must execute before all component scripts {%- endcomment %}
+<script src="{{ site.baseurl }}/assets/js/bootstrap.bundle.min.js" defer></script>
+<script src="{{ site.baseurl }}/assets/js/base/init-tooltips.min.js" defer></script>
+
+{%- comment %} JavaScript optional library extensions {%- endcomment %}
+{%- include base/fontawesome.html.liquid type="script" %}
+{%- include base/highlight.html.liquid type="script" %}
+{%- include base/datatable.html.liquid type="script" %}
+
+{%- comment %} JavaScript UI behavior components — depend on Bootstrap and FontAwesome SVG+JS {%- endcomment %}
+{%- include base/backtotop.html.liquid %}
+{%- include base/copyvalue.html.liquid %}
+{%- include base/heading_anchor.html.liquid %}
+</head>