1<!DOCTYPE html>
2<html lang="{{ site.lang | default: "en-US" }}">
3 <head>
4 <meta charset="UTF-8">
5 <meta http-equiv="X-UA-Compatible" content="IE=edge">
6 <meta name="viewport" content="width=device-width, initial-scale=1">
7
8 {% seo %}
9
10 <link rel="stylesheet" href="{{ '/assets/css/style.css' | relative_url }}">
11 <link id="fa-stylesheet" rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@fortawesome/fontawesome-free@latest/css/all.min.css">
12
13 <!-- Favicon -->
14 <link rel="icon" type="image/x-icon" href="{{ '/assets/favicon.ico' | relative_url }}">
15 <link rel="shortcut icon" type="image/x-icon" href="{{ '/assets/favicon.ico' | relative_url }}">
16
17 <!-- Theme Toggle - inline script to prevent flash of wrong theme -->
18 <script>
19 (function() {
20 function getSystemPreference() {
21 return window.matchMedia && window.matchMedia('(prefers-color-scheme: dark)').matches
22 ? 'dark'
23 : 'light';
24 }
25 function getTheme() {
26 try {
27 const stored = localStorage.getItem('theme');
28 if (stored === 'dark' || stored === 'light') {
29 return stored;
30 }
31 } catch (e) {}
32 return getSystemPreference();
33 }
34 const theme = getTheme();
35 if (theme === 'dark') {
36 document.documentElement.setAttribute('data-theme', 'dark');
37 }
38 })();
39 </script>
40 </head>
41 <body>
42
43 {%- include header.html -%}
44
45 <div class="main-wrapper">
46 {%- include sidebar.html -%}
47 <main class="page-content" aria-label="Content">
48 <div class="wrapper">
49 {{ content }}
50 </div>
51 </main>
52 </div>
53 {%- include footer.html -%}
54
55 <script src="{{ '/assets/js/theme-toggle.js' | relative_url }}"></script>
56 </body>
57
58</html>