Skip to content

Commit 03c2e2d

Browse files
ndd7xvndd7xv
committed
add search
largely based off instruction in their readme: https://github.com/pelican-plugins/search#installation considered using tipue_search but was marked as deprecated in the repo and suggested the search plugin this search also uses stork, which is written in rust! also just adding it to the main page, since i'm not sure if it'd be as useful on every article or any other page.
1 parent 61bc5ab commit 03c2e2d

File tree

11 files changed

+302
-2
lines changed

11 files changed

+302
-2
lines changed

‎pelicanconf.py

Lines changed: 4 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -14,6 +14,7 @@
1414
else:
1515
THEME = 'themes/rusted'
1616

17+
THEME_STATIC_DIR = THEME + '/static'
1718
PLUGIN_PATHS = ["plugins"]
1819
PLUGINS = ['assets', 'neighbors']
1920

@@ -47,7 +48,9 @@
4748
"""
4849
}
4950

50-
PLUGINS = ['webassets']
51+
SEARCH_HTML_SELECTOR = "article"
52+
53+
PLUGINS = ['webassets', 'search']
5154

5255
MARKDOWN = {
5356
'extension_configs': {

‎publishing/Dockerfile

Lines changed: 4 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -12,6 +12,9 @@ ENV LC_ALL='en_US.UTF-8'
1212
RUN ln -s /usr/bin/python3.8 /usr/bin/python
1313
COPY requirements.txt .
1414
RUN pip3 install -r requirements.txt
15+
RUN curl https://files.stork-search.net/releases/v1.5.0/stork-ubuntu-20-04 -o stork \
16+
&& chmod +x stork \
17+
&& mv ./stork /usr/bin/stork
1518

1619
# sass/juice
1720
RUN apt-get install -y curl
@@ -26,7 +29,7 @@ COPY plugins plugins
2629
COPY themes themes
2730
COPY pelicanconf.py pelicanconf.py
2831

29-
COPY publishing/*.sh .
32+
COPY publishing/*.sh ./
3033
RUN chmod 777 *.sh
3134

3235
CMD ["pelican", "--delete-output-directory", "content"]

‎requirements.txt

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -6,3 +6,4 @@ Markdown==3.3.7
66
markupsafe==2.0.1
77
pelican==4.7.1
88
pelican-webassets==2.0.0
9+
pelican-search==1.0.1

‎themes/rusted/static/css/_layout.scss

Lines changed: 22 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -58,6 +58,28 @@ body > footer {
5858
font-size: 20px;
5959
}
6060

61+
/**
62+
* Search
63+
*/
64+
.search {
65+
li.nav-header h2 {
66+
border-bottom: 1px solid $grey-colour-light;
67+
}
68+
69+
li {
70+
line-height: 1.8;
71+
}
72+
}
73+
74+
.stork-close-button {
75+
right: 15px;
76+
top: 87px;
77+
bottom: unset;
78+
}
79+
80+
.stork-progress {
81+
position: relative;
82+
}
6183

6284
/**
6385
* Page content

‎themes/rusted/static/css/stork-dark.css

Lines changed: 38 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,38 @@
1+
@import url(https://files.stork-search.net/basic.css);
2+
3+
body:not(.stork-multitheme),
4+
.stork-wrapper-dark {
5+
--stork-border-color: hsl(0, 0%, 36%);
6+
--stork-background-color: hsl(0, 0%, 22%);
7+
--stork-accent-color: hsl(194, 90%, 53%);
8+
9+
--stork-input-text-color: white;
10+
11+
--stork-results-hover-color: hsl(210, 83%, 16%);
12+
--stork-results-title-color: white;
13+
--stork-results-excerpt-color: hsla(0, 0%, 80%, 1);
14+
--stork-results-highlight-color: rgb(94, 201, 186);
15+
--stork-results-border-color: hsl(0, 0%, 30%);
16+
}
17+
18+
body:not(.stork-multitheme) .stork-close-button,
19+
.stork-wrapper-dark .stork-close-button {
20+
background: linear-gradient(
21+
to bottom,
22+
hsl(0, 0%, 60%) 0%,
23+
hsl(0, 0%, 50%) 100%
24+
);
25+
border: 1px solid hsla(0, 0%, 50%, 0.8);
26+
color: hsl(0, 0%, 25%);
27+
}
28+
29+
body:not(.stork-multitheme) .stork-close-button:hover,
30+
.stork-wrapper-dark .stork-close-button:hover {
31+
background: hsla(0, 0%, 45%);
32+
cursor: pointer;
33+
}
34+
35+
body:not(.stork-multitheme) .stork-close-button:active,
36+
.stork-wrapper-dark .stork-close-button:active {
37+
background: hsla(0, 0%, 40%);
38+
}

‎themes/rusted/static/css/stork.css

Lines changed: 212 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,212 @@
1+
:root {
2+
--stork-border-color: hsl(0, 0%, 65%);
3+
--stork-background-color: hsla(0, 0%, 97%, 1);
4+
--stork-font-family: inherit;
5+
--stork-size-multiplier: 1;
6+
--stork-accent-color: hsl(210, 72%, 45%);
7+
8+
--stork-input-width: 100%;
9+
--stork-input-border-radius: 8px;
10+
--stork-input-text-color: black;
11+
--stork-input-shadow: 1;
12+
13+
--stork-results-width: 100%;
14+
--stork-results-border-radius: 4px;
15+
--stork-results-shadow: 1;
16+
--stork-results-hover-color: hsl(210, 65%, 75%);
17+
--stork-results-title-color: black;
18+
--stork-results-excerpt-color: black;
19+
--stork-results-highlight-color: rgb(245, 230, 26);
20+
--stork-results-border-color: var(--stork-border-color);
21+
}
22+
23+
.stork-wrapper {
24+
position: relative;
25+
font-family: var(--stork-font-family);
26+
box-sizing: border-box;
27+
font-size: 1em * var(--stork-size-multiplier);
28+
}
29+
30+
.stork-wrapper *,
31+
.stork-wrapper *:before,
32+
.stork-wrapper *:after {
33+
box-sizing: border-box;
34+
}
35+
36+
.stork-input {
37+
width: var(--stork-input-width);
38+
height: 2.4em;
39+
font-size: 1em;
40+
padding: 0.4em 0.8em;
41+
position: relative;
42+
box-shadow: inset 0 0.1em 0.3em
43+
hsla(0, 0%, 0%, calc(var(--stork-input-shadow) * 0.25));
44+
border: 1px solid var(--stork-border-color);
45+
border-radius: var(--stork-input-border-radius);
46+
background-color: var(--stork-background-color);
47+
color: var(--stork-input-text-color);
48+
font-family: var(--stork-font-family);
49+
}
50+
51+
.stork-input:focus {
52+
outline: none;
53+
}
54+
55+
.stork-progress {
56+
position: absolute;
57+
display: block;
58+
content: "";
59+
bottom: 1px;
60+
background-color: var(--stork-accent-color);
61+
box-shadow: 0 0 8px var(--stork-accent-color);
62+
height: 1px;
63+
transition: width 0.25s ease, opacity 0.4s ease 0.4s;
64+
}
65+
66+
.stork-output {
67+
position: absolute;
68+
width: var(--stork-results-width);
69+
margin-top: 0.5em;
70+
border-radius: var(--stork-results-border-radius);
71+
display: flex;
72+
flex-direction: column;
73+
z-index: 100;
74+
color: var(--stork-results-title-color);
75+
font-weight: 400;
76+
font-family: var(--stork-font-family);
77+
}
78+
79+
.stork-attribution a:link,
80+
.stork-attribution a:visited {
81+
color: var(--stork-accent-color);
82+
}
83+
84+
.stork-output-visible {
85+
border: 1px solid var(--stork-border-color);
86+
box-shadow: 0px 0px 2.2px
87+
rgba(0, 0, 0, calc(var(--stork-results-shadow) * 0.02)),
88+
0px 0px 5.3px rgba(0, 0, 0, calc(var(--stork-results-shadow) * 0.028)),
89+
0px 0px 10px rgba(0, 0, 0, calc(var(--stork-results-shadow) * 0.035)),
90+
0px 0px 17.9px rgba(0, 0, 0, calc(var(--stork-results-shadow) * 0.042)),
91+
0px 0px 33.4px rgba(0, 0, 0, calc(var(--stork-results-shadow) * 0.05)),
92+
0px 0px 80px rgba(0, 0, 0, calc(var(--stork-results-shadow) * 0.07));
93+
background: var(--stork-background-color);
94+
}
95+
96+
.stork-message {
97+
width: 100%;
98+
padding: 0.5em 1em;
99+
color: var(--stork-results-title-color);
100+
}
101+
102+
.stork-attribution {
103+
width: 100%;
104+
padding: 0.5em 1em;
105+
font-size: 0.8em;
106+
color: var(--stork-results-title-color);
107+
}
108+
109+
.stork-results {
110+
margin: 0;
111+
padding: 0.25em 0;
112+
width: 100%;
113+
list-style-type: none;
114+
max-height: 25em;
115+
overflow-y: scroll;
116+
border-top: 1px solid var(--stork-border-color);
117+
border-bottom: 1px solid var(--stork-border-color);
118+
box-shadow: inset 0em 0.7em 0.7em -0.7em hsla(0, 0%, 0%, calc(var(
119+
--stork-results-shadow
120+
) * 0.34)),
121+
inset 0em -0.7em 0.7em -0.7em
122+
hsl(0, 0%, 0%, calc(var(--stork-results-shadow) * 0.34));
123+
}
124+
125+
.stork-result:not(:last-child) {
126+
border-bottom: 1px solid var(--stork-results-border-color);
127+
}
128+
129+
.stork-result.selected {
130+
background: var(--stork-results-hover-color);
131+
}
132+
133+
.stork-result a:link {
134+
padding: 1em;
135+
display: block;
136+
color: currentcolor;
137+
text-decoration: none;
138+
}
139+
140+
.stork-result p {
141+
margin: 0;
142+
}
143+
144+
.stork-title {
145+
font-weight: bold;
146+
font-size: 0.95em;
147+
margin: 0 0 0.75em 0;
148+
color: var(--stork-results-title-color);
149+
150+
/* Flexbox container for the title and the score, when debugging */
151+
display: flex;
152+
justify-content: space-between;
153+
}
154+
155+
.stork-excerpt {
156+
font-size: 0.8em;
157+
line-height: 1;
158+
margin: 0;
159+
color: var(--stork-results-excerpt-color);
160+
161+
/* Flexbox container for the title and the score, when debugging */
162+
display: flex;
163+
justify-content: space-between;
164+
}
165+
166+
.stork-excerpt:not(:last-of-type) {
167+
margin-bottom: 0.6em;
168+
}
169+
170+
.stork-highlight {
171+
background-color: var(--stork-results-highlight-color);
172+
padding: 0 0.1em;
173+
}
174+
175+
.stork-error {
176+
outline: 2px solid hsl(0, 89%, 46%);
177+
}
178+
179+
.stork-close-button {
180+
position: absolute;
181+
bottom: 0;
182+
right: 0;
183+
margin: 0.3em 0.4em;
184+
height: 1.5em;
185+
width: 1.5em;
186+
padding: 0px;
187+
background: linear-gradient(
188+
to bottom,
189+
hsl(0, 0%, 85%) 0%,
190+
hsl(0, 0%, 75%) 100%
191+
);
192+
border: 1px solid hsla(0, 0%, 50%, 0.8);
193+
font-size: 1.1em;
194+
color: hsl(0, 0%, 45%);
195+
border-radius: 15%;
196+
line-height: 1;
197+
}
198+
199+
.stork-close-button svg {
200+
width: 0.8em;
201+
position: relative;
202+
top: 1px;
203+
}
204+
205+
.stork-close-button:hover {
206+
background: hsla(0, 0%, 70%);
207+
cursor: pointer;
208+
}
209+
210+
.stork-close-button:active {
211+
background: hsla(0, 0%, 65%);
212+
}

‎themes/rusted/static/js/stork.js

Lines changed: 2 additions & 0 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎themes/rusted/static/js/stork.js.map

Lines changed: 1 addition & 0 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎themes/rusted/static/js/stork.wasm

343 KB
Binary file not shown.

‎themes/rusted/templates/base.html

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -32,6 +32,8 @@
3232
<link href="{{ FEED_DOMAIN }}/{{ FEED_ALL_ATOM }}" type="application/atom+xml" rel="alternate" title="{{ SITENAME|striptags }} - Full Atom Feed" />
3333

3434
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.4/css/bootstrap.min.css" />
35+
<link rel="stylesheet" href="https://files.stork-search.net/basic.css" />
36+
<link rel="stylesheet" media="screen and (prefers-color-scheme: dark)" href="{{ SITEURL }}/{{ THEME_STATIC_DIR }}/css/stork-dark.css">
3537
{% assets filters="libsass,cssmin", output="css/web-min.css", "css/main.scss" %}
3638

3739
<link rel="stylesheet" href="/{{ ASSET_URL }}" />

‎themes/rusted/templates/index.html

Lines changed: 16 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -27,5 +27,21 @@ <h1 class="pitch">Handpicked Rust updates, <br /> delivered to your inbox.</h1>
2727
</li>
2828
</ul>
2929
</div>
30+
<div class ="col-md-12">
31+
<ul class="list-unstyled search">
32+
<li class="nav-header disabled"><h2>Search</h2></li>
33+
<div>
34+
<input data-stork="sitesearch" class="form-control"/>
35+
<div data-stork="sitesearch-output"></div>
36+
37+
<script src="{{ SITEURL }}/{{ THEME_STATIC_DIR }}/js/stork.js"></script>
38+
<script>
39+
stork.initialize("{{ SITEURL }}/{{ THEME_STATIC_DIR }}/js/stork.wasm")
40+
stork.downloadIndex("sitesearch", "{{ SITEURL }}/search-index.st")
41+
stork.attach("sitesearch")
42+
</script>
43+
</div>
44+
</ul>
45+
</div>
3046
</div>
3147
{% endblock content %}

0 commit comments

Comments
 (0)