jekyll-theme-zer0 0.17.0 → 0.18.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- checksums.yaml +4 -4
- data/CHANGELOG.md +74 -0
- data/README.md +1 -1
- data/_includes/components/cookie-consent.html +81 -9
- data/_includes/components/js-cdn.html +4 -1
- data/_includes/components/mermaid.html +260 -14
- data/_includes/components/search-modal.html +56 -0
- data/_includes/core/branding.html +12 -13
- data/_includes/core/head.html +1 -0
- data/_includes/core/header.html +38 -11
- data/_includes/navigation/navbar.html +31 -0
- data/_layouts/landing.html +21 -21
- data/_layouts/root.html +3 -0
- data/_sass/core/code-copy.scss +45 -6
- data/_sass/custom.scss +620 -1
- data/assets/js/code-copy.js +79 -13
- data/assets/js/modules/navigation/keyboard.js +9 -2
- data/assets/js/search-modal.js +239 -0
- data/assets/js/ui-enhancements.js +164 -0
- data/scripts/init_setup.sh +544 -0
- data/scripts/test-notebook-conversion.sh +105 -0
- metadata +11 -6
data/_includes/core/header.html
CHANGED
|
@@ -60,39 +60,53 @@
|
|
|
60
60
|
<!-- ========================== -->
|
|
61
61
|
<!-- MAIN NAVIGATION CONTAINER -->
|
|
62
62
|
<!-- ========================== -->
|
|
63
|
-
<nav class="container-xl order-2 order-lg-1 grid gap-1">
|
|
63
|
+
<nav class="container-xl order-2 order-lg-1 grid gap-1 navbar-main">
|
|
64
64
|
|
|
65
65
|
<!-- ========================== -->
|
|
66
66
|
<!-- MOBILE MENU CONTROLS -->
|
|
67
67
|
<!-- ========================== -->
|
|
68
68
|
|
|
69
69
|
<!-- Left Sidebar Toggle - Mobile view only -->
|
|
70
|
+
{% assign sidebar_nav = page.sidebar.nav | default: nil %}
|
|
71
|
+
{% assign sidebar_has_content = false %}
|
|
72
|
+
{% if sidebar_nav %}
|
|
73
|
+
{% if sidebar_nav == "auto" or sidebar_nav == "categories" %}
|
|
74
|
+
{% assign sidebar_has_content = true %}
|
|
75
|
+
{% elsif site.data.navigation[sidebar_nav] %}
|
|
76
|
+
{% assign sidebar_has_content = true %}
|
|
77
|
+
{% endif %}
|
|
78
|
+
{% endif %}
|
|
79
|
+
|
|
80
|
+
{% if sidebar_has_content %}
|
|
70
81
|
<div class="bd-navbar-toggle">
|
|
71
82
|
<button class="navbar-toggler p-2"
|
|
72
83
|
type="button"
|
|
73
84
|
data-bs-toggle="offcanvas"
|
|
74
85
|
data-bs-target="#bdSidebar"
|
|
75
86
|
aria-controls="bdSidebar"
|
|
76
|
-
aria-label="Toggle navigation">
|
|
87
|
+
aria-label="Toggle sidebar navigation">
|
|
77
88
|
<span class="bi bi-list"></span>
|
|
78
89
|
</button>
|
|
79
90
|
</div>
|
|
91
|
+
{% endif %}
|
|
80
92
|
|
|
81
93
|
<!-- ========================== -->
|
|
82
94
|
<!-- BRAND AND HOME NAVIGATION -->
|
|
83
95
|
<!-- ========================== -->
|
|
84
|
-
<div class="
|
|
85
|
-
<!-- Home Navigation Button -->
|
|
86
|
-
|
|
87
|
-
|
|
88
|
-
<
|
|
89
|
-
|
|
90
|
-
|
|
96
|
+
<div class="navbar-brand-group d-inline-flex align-items-center gap-2">
|
|
97
|
+
<!-- Home Navigation Button (Desktop only) -->
|
|
98
|
+
<div class="navbar-home-links d-none d-lg-inline-flex">
|
|
99
|
+
{%- for home in site.data.navigation.home -%}
|
|
100
|
+
<a class="btn" href="{{ home.url | relative_url }}" aria-label="{{ home.title }}" title="{{ home.title }}">
|
|
101
|
+
<i class="{{ site.default_icon}} {{ home.icon }}"></i>
|
|
102
|
+
</a>
|
|
103
|
+
{% endfor %}
|
|
104
|
+
</div>
|
|
91
105
|
|
|
92
106
|
<!-- Brand Logo Link to Root -->
|
|
93
107
|
<!-- Logo path configured in _config.yml -->
|
|
94
108
|
{% capture logo_path %}{{ site.logo }}{% endcapture %}
|
|
95
|
-
<a class="navbar-brand" href="{{ site.baseurl }}/">
|
|
109
|
+
<a class="navbar-brand" href="{{ site.baseurl }}/" aria-label="Home">
|
|
96
110
|
<img src="{{ logo_path | relative_url }}" alt="Logo" width="30" height="30">
|
|
97
111
|
</a>
|
|
98
112
|
</div>
|
|
@@ -113,8 +127,21 @@
|
|
|
113
127
|
<!-- UTILITY CONTROLS -->
|
|
114
128
|
<!-- ========================== -->
|
|
115
129
|
|
|
130
|
+
<!-- Search Modal Toggle -->
|
|
131
|
+
<button
|
|
132
|
+
class="btn nav-search-button"
|
|
133
|
+
type="button"
|
|
134
|
+
data-bs-toggle="modal"
|
|
135
|
+
data-bs-target="#siteSearchModal"
|
|
136
|
+
data-search-toggle
|
|
137
|
+
aria-label="Open search"
|
|
138
|
+
>
|
|
139
|
+
<i class="{{site.default_icon}} bi-search"></i>
|
|
140
|
+
<span class="d-none d-lg-inline ms-1">Search</span>
|
|
141
|
+
</button>
|
|
142
|
+
|
|
116
143
|
<!-- Settings Modal Toggle -->
|
|
117
|
-
<div class="btn"
|
|
144
|
+
<div class="btn d-none d-lg-flex nav-settings"
|
|
118
145
|
data-bs-toggle="modal"
|
|
119
146
|
data-bs-target="#info-section"
|
|
120
147
|
aria-expanded="false"
|
|
@@ -18,6 +18,12 @@
|
|
|
18
18
|
<!-- Main Navigation Body - Offcanvas -->
|
|
19
19
|
<div class="offcanvas-body">
|
|
20
20
|
<ul class="navbar-nav justify-content-lg-center text-start flex-grow-1">
|
|
21
|
+
<li class="nav-item d-lg-none">
|
|
22
|
+
<a class="nav-link" href="{{ '/' | relative_url }}">
|
|
23
|
+
<i class="{{site.default_icon}} bi-house me-2"></i>
|
|
24
|
+
Home
|
|
25
|
+
</a>
|
|
26
|
+
</li>
|
|
21
27
|
{%- for link in site.data.navigation.main -%}
|
|
22
28
|
{%- assign has_children = link.children and link.children.size > 0 -%}
|
|
23
29
|
|
|
@@ -81,6 +87,31 @@
|
|
|
81
87
|
</li>
|
|
82
88
|
{%- endif -%}
|
|
83
89
|
{%- endfor -%}
|
|
90
|
+
<li class="nav-item d-lg-none">
|
|
91
|
+
<button
|
|
92
|
+
class="nav-link btn btn-link text-start w-100"
|
|
93
|
+
type="button"
|
|
94
|
+
data-bs-toggle="modal"
|
|
95
|
+
data-bs-target="#siteSearchModal"
|
|
96
|
+
data-search-toggle
|
|
97
|
+
aria-label="Open search"
|
|
98
|
+
>
|
|
99
|
+
<i class="{{site.default_icon}} bi-search me-2"></i>
|
|
100
|
+
Search
|
|
101
|
+
</button>
|
|
102
|
+
</li>
|
|
103
|
+
<li class="nav-item d-lg-none">
|
|
104
|
+
<button
|
|
105
|
+
class="nav-link btn btn-link text-start w-100"
|
|
106
|
+
type="button"
|
|
107
|
+
data-bs-toggle="modal"
|
|
108
|
+
data-bs-target="#info-section"
|
|
109
|
+
aria-controls="info-section"
|
|
110
|
+
>
|
|
111
|
+
<i class="{{site.default_icon}} bi-gear me-2"></i>
|
|
112
|
+
Settings
|
|
113
|
+
</button>
|
|
114
|
+
</li>
|
|
84
115
|
</ul>
|
|
85
116
|
</div>
|
|
86
117
|
</div>
|
data/_layouts/landing.html
CHANGED
|
@@ -47,29 +47,29 @@ layout: root
|
|
|
47
47
|
<!-- ================================ -->
|
|
48
48
|
<!-- HERO SECTION -->
|
|
49
49
|
<!-- ================================ -->
|
|
50
|
-
<div class="bg-primary text-white">
|
|
50
|
+
<div class="bg-primary text-white position-relative overflow-hidden">
|
|
51
51
|
<div class="container-xl py-5 px-4 px-md-5">
|
|
52
52
|
<div class="row align-items-center min-vh-50 g-4 g-lg-5">
|
|
53
|
-
<div class="col-lg-6">
|
|
54
|
-
<h1 class="display-4 fw-bold mb-3">{{ page.title }}</h1>
|
|
55
|
-
<p class="lead mb-4">{{ page.description }}</p>
|
|
56
|
-
<div class="d-flex flex-column flex-md-row gap-3">
|
|
53
|
+
<div class="col-lg-6 order-2 order-lg-1">
|
|
54
|
+
<h1 class="display-4 fw-bold mb-3 animate-on-scroll">{{ page.title }}</h1>
|
|
55
|
+
<p class="lead mb-4 animate-on-scroll" style="animation-delay: 0.1s;">{{ page.description }}</p>
|
|
56
|
+
<div class="d-flex flex-column flex-md-row gap-3 animate-on-scroll" style="animation-delay: 0.2s;">
|
|
57
57
|
<a href="#get-started" class="btn btn-light btn-lg">
|
|
58
58
|
<i class="bi bi-rocket-takeoff me-2"></i>Get Started
|
|
59
59
|
</a>
|
|
60
60
|
<a href="#features" class="btn btn-outline-light btn-lg">
|
|
61
61
|
<i class="bi bi-list-check me-2"></i>Features
|
|
62
62
|
</a>
|
|
63
|
-
|
|
63
|
+
<a href="{{ site.resources.github_repo | default: '' | join: '' }}" class="btn btn-outline-light btn-lg" target="_blank" rel="noopener">
|
|
64
64
|
<i class="bi bi-github me-2"></i>GitHub
|
|
65
65
|
</a>
|
|
66
66
|
</div>
|
|
67
67
|
</div>
|
|
68
|
-
<div class="col-lg-6 text-center">
|
|
68
|
+
<div class="col-lg-6 text-center order-1 order-lg-2">
|
|
69
69
|
{% if page.hero_image %}
|
|
70
|
-
<img src="{{ page.hero_image }}" alt="{{ page.title }}" class="img-fluid rounded shadow-lg">
|
|
70
|
+
<img src="{{ page.hero_image }}" alt="{{ page.title }}" class="img-fluid rounded shadow-lg animate-on-scroll" loading="eager" style="animation-delay: 0.3s;">
|
|
71
71
|
{% else %}
|
|
72
|
-
<div class="bg-secondary rounded p-5 text-body">
|
|
72
|
+
<div class="bg-secondary rounded p-5 text-body animate-on-scroll">
|
|
73
73
|
<i class="bi bi-code-square display-1"></i>
|
|
74
74
|
<p class="mt-3 mb-0">Jekyll Theme</p>
|
|
75
75
|
</div>
|
|
@@ -102,37 +102,37 @@ layout: root
|
|
|
102
102
|
|
|
103
103
|
<div class="row g-4">
|
|
104
104
|
<div class="col-md-4">
|
|
105
|
-
<div class="card h-100 border-0 shadow-sm">
|
|
105
|
+
<div class="card h-100 border-0 shadow-sm feature-card">
|
|
106
106
|
<div class="card-body text-center p-4">
|
|
107
|
-
<div class="bg-primary text-white rounded-circle d-inline-flex align-items-center justify-content-center mb-3" style="width: 60px; height: 60px;">
|
|
107
|
+
<div class="bg-primary text-white rounded-circle d-inline-flex align-items-center justify-content-center mb-3 feature-icon" style="width: 60px; height: 60px;">
|
|
108
108
|
<i class="bi bi-shield-check fs-4"></i>
|
|
109
109
|
</div>
|
|
110
|
-
|
|
111
|
-
|
|
110
|
+
<h5 class="card-title text-body-emphasis">Error-Free Development</h5>
|
|
111
|
+
<p class="card-text text-body-secondary">Built-in error handling and self-healing installation process ensures a smooth development experience.</p>
|
|
112
112
|
</div>
|
|
113
113
|
</div>
|
|
114
114
|
</div>
|
|
115
115
|
|
|
116
116
|
<div class="col-md-4">
|
|
117
|
-
<div class="card h-100 border-0 shadow-sm">
|
|
117
|
+
<div class="card h-100 border-0 shadow-sm feature-card">
|
|
118
118
|
<div class="card-body text-center p-4">
|
|
119
|
-
<div class="bg-success text-white rounded-circle d-inline-flex align-items-center justify-content-center mb-3" style="width: 60px; height: 60px;">
|
|
119
|
+
<div class="bg-success text-white rounded-circle d-inline-flex align-items-center justify-content-center mb-3 feature-icon" style="width: 60px; height: 60px;">
|
|
120
120
|
<i class="bi bi-boxes fs-4"></i>
|
|
121
121
|
</div>
|
|
122
|
-
|
|
123
|
-
|
|
122
|
+
<h5 class="card-title text-body-emphasis">Docker-First Approach</h5>
|
|
123
|
+
<p class="card-text text-body-secondary">Cross-platform compatibility with zero local configuration. Works on Apple Silicon, Intel, and Linux.</p>
|
|
124
124
|
</div>
|
|
125
125
|
</div>
|
|
126
126
|
</div>
|
|
127
127
|
|
|
128
128
|
<div class="col-md-4">
|
|
129
|
-
<div class="card h-100 border-0 shadow-sm">
|
|
129
|
+
<div class="card h-100 border-0 shadow-sm feature-card">
|
|
130
130
|
<div class="card-body text-center p-4">
|
|
131
|
-
<div class="bg-info text-white rounded-circle d-inline-flex align-items-center justify-content-center mb-3" style="width: 60px; height: 60px;">
|
|
131
|
+
<div class="bg-info text-white rounded-circle d-inline-flex align-items-center justify-content-center mb-3 feature-icon" style="width: 60px; height: 60px;">
|
|
132
132
|
<i class="bi bi-lightning-charge fs-4"></i>
|
|
133
133
|
</div>
|
|
134
|
-
|
|
135
|
-
|
|
134
|
+
<h5 class="card-title text-body-emphasis">AI-Powered Setup</h5>
|
|
135
|
+
<p class="card-text text-body-secondary">Intelligent installation automation that detects and fixes common issues automatically.</p>
|
|
136
136
|
</div>
|
|
137
137
|
</div>
|
|
138
138
|
</div>
|
data/_layouts/root.html
CHANGED
|
@@ -59,6 +59,9 @@
|
|
|
59
59
|
<!-- Main site header with navigation, branding, and search functionality -->
|
|
60
60
|
{% include core/header.html %}
|
|
61
61
|
|
|
62
|
+
<!-- Search modal (site-wide) -->
|
|
63
|
+
{% include components/search-modal.html %}
|
|
64
|
+
|
|
62
65
|
<!-- Site-wide information banner or announcement section -->
|
|
63
66
|
{% include components/info-section.html %}
|
|
64
67
|
|
data/_sass/core/code-copy.scss
CHANGED
|
@@ -10,10 +10,27 @@
|
|
|
10
10
|
background-color: black;
|
|
11
11
|
border: none;
|
|
12
12
|
cursor: pointer;
|
|
13
|
+
transition: all 0.3s ease;
|
|
14
|
+
|
|
13
15
|
&:focus {
|
|
14
16
|
outline: none; // remove default focus outline
|
|
15
17
|
box-shadow: 0 0 0 3px rgba(21, 156, 228, 0.4); // add custom focus style
|
|
16
|
-
}
|
|
18
|
+
}
|
|
19
|
+
|
|
20
|
+
&:hover {
|
|
21
|
+
background-color: rgba(0, 0, 0, 0.8);
|
|
22
|
+
transform: translateY(-1px);
|
|
23
|
+
}
|
|
24
|
+
|
|
25
|
+
&.copied {
|
|
26
|
+
background-color: #28a745;
|
|
27
|
+
animation: pulse 0.3s ease;
|
|
28
|
+
}
|
|
29
|
+
}
|
|
30
|
+
|
|
31
|
+
@keyframes pulse {
|
|
32
|
+
0%, 100% { transform: scale(1); }
|
|
33
|
+
50% { transform: scale(1.05); }
|
|
17
34
|
}
|
|
18
35
|
|
|
19
36
|
pre.highlight {
|
|
@@ -48,21 +65,43 @@
|
|
|
48
65
|
position: absolute;
|
|
49
66
|
right: 1.2rem;
|
|
50
67
|
top: 1.2rem;
|
|
51
|
-
|
|
52
|
-
|
|
68
|
+
opacity: 0.7;
|
|
69
|
+
transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
|
|
70
|
+
background: rgba(0, 0, 0, 0.5);
|
|
71
|
+
border: 1px solid rgba(255, 255, 255, 0.2);
|
|
72
|
+
border-radius: 0.375rem;
|
|
73
|
+
padding: 0.375rem 0.75rem;
|
|
74
|
+
font-size: 0.75rem;
|
|
75
|
+
font-weight: 500;
|
|
76
|
+
backdrop-filter: blur(4px);
|
|
77
|
+
|
|
53
78
|
&:active,
|
|
54
79
|
&:focus,
|
|
55
80
|
&:hover {
|
|
56
|
-
background: rgba(0, 0, 0, 0.
|
|
81
|
+
background: rgba(0, 0, 0, 0.8);
|
|
57
82
|
opacity: 1;
|
|
83
|
+
transform: scale(1.05);
|
|
84
|
+
border-color: rgba(255, 255, 255, 0.4);
|
|
85
|
+
box-shadow: 0 2px 8px rgba(0, 0, 0, 0.3);
|
|
86
|
+
}
|
|
87
|
+
|
|
88
|
+
&:active {
|
|
89
|
+
transform: scale(0.95);
|
|
58
90
|
}
|
|
59
91
|
}
|
|
60
92
|
|
|
61
93
|
&:active .copy,
|
|
62
94
|
&:focus .copy,
|
|
63
95
|
&:hover .copy {
|
|
64
|
-
background: rgba(0, 0, 0, 0.
|
|
65
|
-
|
|
96
|
+
background: rgba(0, 0, 0, 0.8);
|
|
97
|
+
opacity: 1;
|
|
98
|
+
}
|
|
99
|
+
|
|
100
|
+
// Show copy button on hover
|
|
101
|
+
position: relative;
|
|
102
|
+
|
|
103
|
+
&:hover .copy {
|
|
104
|
+
opacity: 1;
|
|
66
105
|
}
|
|
67
106
|
}
|
|
68
107
|
|