Skip to content

Commit b23e306

Browse files
committed
Add search styling and functionality improvements
- Introduced new CSS for search form and results layout. - Updated search JavaScript to handle new result types and improve scoring. - Enhanced search field HTML structure for better accessibility and styling. - Configured Sphinx to include new search CSS file.
1 parent c020c67 commit b23e306

4 files changed

Lines changed: 266 additions & 124 deletions

File tree

docs/_static/search.css

Lines changed: 69 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,69 @@
1+
/*
2+
Remove the external link icon from Plone Sphinx Theme for links
3+
in submodules that refer to Plone 6 Documentation via Intersphinx.
4+
Although these links have `external` in their class, they are
5+
actually internal to Plone 6 Documentation.
6+
*/
7+
.reference.external::after {
8+
all: unset;
9+
}
10+
a:not([title="(in Plone Documentation v6)"]).reference.external::after {
11+
margin-left: .3em;
12+
display: inline-block;
13+
content: var(--pst-icon-external-link);
14+
white-space: nowrap;
15+
font: var(--fa-font-solid);
16+
font-size: .75em;
17+
}
18+
19+
/* Search form styling */
20+
.bd-search {
21+
max-width: 600px;
22+
}
23+
24+
.bd-search .input-group-text {
25+
background-color: var(--pst-color-surface);
26+
border-color: var(--pst-color-border);
27+
color: var(--pst-color-text-muted);
28+
}
29+
30+
.bd-search .form-control,
31+
.bd-search .form-select {
32+
border-color: var(--pst-color-border);
33+
background-color: var(--pst-color-surface);
34+
color: var(--pst-color-text-base);
35+
}
36+
37+
.bd-search .form-control:focus,
38+
.bd-search .form-select:focus {
39+
border-color: var(--pst-color-primary);
40+
box-shadow: 0 0 0 0.2rem rgba(var(--pst-color-primary-rgb), 0.25);
41+
}
42+
43+
.bd-search .form-label {
44+
font-weight: 500;
45+
color: var(--pst-color-text-base);
46+
}
47+
48+
.bd-search .search-button__kbd-shortcut kbd {
49+
background-color: var(--pst-color-text-muted);
50+
color: var(--pst-color-surface);
51+
padding: 0.1rem 0.3rem;
52+
border-radius: 3px;
53+
font-size: 0.85em;
54+
}
55+
56+
.bd-search-container ul.search {
57+
padding-inline-start: 0;
58+
}
59+
60+
/* Search results styling */
61+
#search-results .breadcrumbs {
62+
font-size: 0.85em;
63+
color: var(--pst-color-text-muted);
64+
margin-bottom: 0.25rem;
65+
}
66+
67+
#search-results .breadcrumbs .pathseparator {
68+
padding: 0 0.5em;
69+
}

0 commit comments

Comments
 (0)