Skip to content

Commit 81ad485

Browse files
KrinkleKrinkle
committed
All: Integrate typesense-minibar and enable for local/stage sites
To update this checked in dependency in the future, change the number in composer.json and run `composer deps`. Ref jquery/infrastructure-puppet#33.
1 parent 32842d2 commit 81ad485

File tree

15 files changed

+622
-69
lines changed

15 files changed

+622
-69
lines changed

‎NOTICE.txt

Lines changed: 4 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -31,3 +31,7 @@ with this program; if not, write to the Free Software Foundation, Inc.,
3131
- TinyNav.js
3232
http://tinynav.com/
3333
located at themes/jquery/js/plugins.js
34+
35+
- typesense-minibar
36+
https://github.com/jquery/typesense-minibar
37+
located at themes/jquery/lib/typesense-minibar.js

‎composer.json

Lines changed: 5 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -6,6 +6,10 @@
66
"php-parallel-lint/php-parallel-lint": "1.3.2"
77
},
88
"scripts": {
9-
"test": "parallel-lint --exclude vendor/composer/autoload_static.php ."
9+
"test": "parallel-lint --exclude vendor/ .",
10+
"deps": [
11+
"curl -O -q --output-dir themes/jquery/lib/typesense-minibar 'https://raw.githubusercontent.com/jquery/typesense-minibar/1.1.1/{typesense-minibar.css,typesense-minibar.js,LICENSE.txt}'",
12+
"curl -q https://raw.githubusercontent.com/jquery/typesense-minibar/1.1.1/typesense-minibar-foot.css >> themes/jquery/lib/typesense-minibar/typesense-minibar.css"
13+
]
1014
}
1115
}

‎sites.php

Lines changed: 28 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -20,6 +20,8 @@ function jquery_sites() {
2020
'jquery_xfn_rel_me' => 'https://social.lfx.dev/@jquery',
2121
'jquery_docsearch_api_key' => '3cfde9aca378c8aab554d5bf1b23489b',
2222
'jquery_docsearch_index_name' => 'jquery',
23+
'jquery_typesense_key' => 'Zh8mMgohXECel9wjPwqT7lekLSG3OCgz',
24+
'jquery_typesense_collection' => 'jquery_com',
2325
),
2426
),
2527
'blog.jquery.com' => array(
@@ -45,6 +47,8 @@ function jquery_sites() {
4547
'jquery_logo_link'=> 'https://jquery.com/',
4648
'jquery_docsearch_api_key' => '3cfde9aca378c8aab554d5bf1b23489b',
4749
'jquery_docsearch_index_name' => 'jquery',
50+
'jquery_typesense_key' => 'Zh8mMgohXECel9wjPwqT7lekLSG3OCgz',
51+
'jquery_typesense_collection' => 'jquery_com',
4852
),
4953
),
5054
'plugins.jquery.com' => array(
@@ -84,6 +88,8 @@ function jquery_sites() {
8488
'jquery_body_class' => 'jquery-ui',
8589
'jquery_docsearch_api_key' => '2fce35e56784bbb48c78d105739190c2',
8690
'jquery_docsearch_index_name' => 'jqueryui',
91+
'jquery_typesense_key' => 'Zh8mMgohXECel9wjPwqT7lekLSG3OCgz',
92+
'jquery_typesense_collection' => 'jqueryui_com',
8793
'jquery_twitter_link' => 'https://twitter.com/jqueryui',
8894
),
8995
),
@@ -111,6 +117,8 @@ function jquery_sites() {
111117
'jquery_logo_link'=> 'https://jqueryui.com/',
112118
'jquery_docsearch_api_key' => '2fce35e56784bbb48c78d105739190c2',
113119
'jquery_docsearch_index_name' => 'jqueryui',
120+
'jquery_typesense_key' => 'Zh8mMgohXECel9wjPwqT7lekLSG3OCgz',
121+
'jquery_typesense_collection' => 'jqueryui_com',
114122
'jquery_twitter_link' => 'https://twitter.com/jqueryui',
115123
),
116124
),
@@ -128,6 +136,8 @@ function jquery_sites() {
128136
'jquery_logo_link'=> 'https://jqueryui.com/',
129137
'jquery_docsearch_api_key' => '2fce35e56784bbb48c78d105739190c2',
130138
'jquery_docsearch_index_name' => 'jqueryui',
139+
'jquery_typesense_key' => 'Zh8mMgohXECel9wjPwqT7lekLSG3OCgz',
140+
'jquery_typesense_collection' => 'jqueryui_com',
131141
'jquery_twitter_link' => 'https://twitter.com/jqueryui',
132142
),
133143
),
@@ -145,6 +155,8 @@ function jquery_sites() {
145155
'jquery_logo_link'=> 'https://jqueryui.com/',
146156
'jquery_docsearch_api_key' => '2fce35e56784bbb48c78d105739190c2',
147157
'jquery_docsearch_index_name' => 'jqueryui',
158+
'jquery_typesense_key' => 'Zh8mMgohXECel9wjPwqT7lekLSG3OCgz',
159+
'jquery_typesense_collection' => 'jqueryui_com',
148160
'jquery_twitter_link' => 'https://twitter.com/jqueryui',
149161
),
150162
),
@@ -174,6 +186,8 @@ function jquery_sites() {
174186
'jquery_body_class' => 'jquery-mobile',
175187
'jquery_docsearch_api_key' => '207328b0f1c18555c9021d05157dd651',
176188
'jquery_docsearch_index_name' => 'jquerymobile',
189+
'jquery_typesense_key' => 'Zh8mMgohXECel9wjPwqT7lekLSG3OCgz',
190+
'jquery_typesense_collection' => 'jquerymobile_com',
177191
'jquery_twitter_link' => 'https://twitter.com/jquerymobile',
178192
),
179193
),
@@ -191,6 +205,8 @@ function jquery_sites() {
191205
'jquery_logo_link'=> 'https://jquerymobile.com/',
192206
'jquery_docsearch_api_key' => '207328b0f1c18555c9021d05157dd651',
193207
'jquery_docsearch_index_name' => 'jquerymobile',
208+
'jquery_typesense_key' => 'Zh8mMgohXECel9wjPwqT7lekLSG3OCgz',
209+
'jquery_typesense_collection' => 'jquerymobile_com',
194210
'jquery_twitter_link' => 'https://twitter.com/jquerymobile',
195211
),
196212
),
@@ -249,6 +265,8 @@ function jquery_sites() {
249265
'jquery_logo_link'=> 'https://jquerymobile.com/',
250266
'jquery_docsearch_api_key' => '207328b0f1c18555c9021d05157dd651',
251267
'jquery_docsearch_index_name' => 'jquerymobile',
268+
'jquery_typesense_key' => 'Zh8mMgohXECel9wjPwqT7lekLSG3OCgz',
269+
'jquery_typesense_collection' => 'jquerymobile_com',
252270
'jquery_twitter_link' => 'https://twitter.com/jquerymobile',
253271
),
254272
),
@@ -266,6 +284,8 @@ function jquery_sites() {
266284
'jquery_logo_link'=> 'https://jqueryui.com/',
267285
'jquery_docsearch_api_key' => '2fce35e56784bbb48c78d105739190c2',
268286
'jquery_docsearch_index_name' => 'jqueryui',
287+
'jquery_typesense_key' => 'Zh8mMgohXECel9wjPwqT7lekLSG3OCgz',
288+
'jquery_typesense_collection' => 'jqueryui_com',
269289
'jquery_twitter_link' => 'https://twitter.com/jqueryui',
270290
),
271291
),
@@ -283,6 +303,8 @@ function jquery_sites() {
283303
'jquery_logo_link'=> 'https://jqueryui.com/',
284304
'jquery_docsearch_api_key' => '2fce35e56784bbb48c78d105739190c2',
285305
'jquery_docsearch_index_name' => 'jqueryui',
306+
'jquery_typesense_key' => 'Zh8mMgohXECel9wjPwqT7lekLSG3OCgz',
307+
'jquery_typesense_collection' => 'jqueryui_com',
286308
'jquery_twitter_link' => 'https://twitter.com/jqueryui',
287309
),
288310
),
@@ -300,6 +322,8 @@ function jquery_sites() {
300322
'jquery_logo_link'=> 'https://jqueryui.com/',
301323
'jquery_docsearch_api_key' => '2fce35e56784bbb48c78d105739190c2',
302324
'jquery_docsearch_index_name' => 'jqueryui',
325+
'jquery_typesense_key' => 'Zh8mMgohXECel9wjPwqT7lekLSG3OCgz',
326+
'jquery_typesense_collection' => 'jqueryui_com',
303327
'jquery_twitter_link' => 'https://twitter.com/jqueryui',
304328
),
305329
),
@@ -317,6 +341,8 @@ function jquery_sites() {
317341
'jquery_logo_link'=> 'https://jquerymobile.com/',
318342
'jquery_docsearch_api_key' => '207328b0f1c18555c9021d05157dd651',
319343
'jquery_docsearch_index_name' => 'jquerymobile',
344+
'jquery_typesense_key' => 'Zh8mMgohXECel9wjPwqT7lekLSG3OCgz',
345+
'jquery_typesense_collection' => 'jquerymobile_com',
320346
'jquery_twitter_link' => 'https://twitter.com/jquerymobile',
321347
),
322348
),
@@ -347,6 +373,8 @@ function jquery_sites() {
347373
'jquery_logo_link'=> 'https://jqueryui.com/',
348374
'jquery_docsearch_api_key' => '2fce35e56784bbb48c78d105739190c2',
349375
'jquery_docsearch_index_name' => 'jqueryui',
376+
'jquery_typesense_key' => 'Zh8mMgohXECel9wjPwqT7lekLSG3OCgz',
377+
'jquery_typesense_collection' => 'jqueryui_com',
350378
'jquery_twitter_link' => 'https://twitter.com/jqueryui',
351379
),
352380
),

‎themes/jquery.com/style.css

Lines changed: 0 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -48,8 +48,6 @@ a,
4848
.cross-browser .feature-box-image{
4949
background: url('i/feature-sprites.png') -278px 0 no-repeat;
5050
transition: all 0.4s;
51-
position: relative;
52-
z-index: 10;
5351
}
5452
.cross-browser .feature-box-image:hover {
5553
transition: all 0.7s;

‎themes/jquery/css/base.css

Lines changed: 51 additions & 52 deletions
Original file line numberDiff line numberDiff line change
@@ -93,15 +93,16 @@ body {
9393
margin: 0;
9494
}
9595

96-
::-moz-selection {
97-
background: #b3d4fc;
98-
text-shadow: none;
99-
}
100-
10196
::selection {
102-
background: #b3d4fc;
97+
background: #b4efff;
10398
text-shadow: none;
10499
}
100+
.jquery-ui ::selection {
101+
background: #ffddb2;
102+
}
103+
.jquery-mobile ::selection {
104+
background: #c9f2c8;
105+
}
105106

106107
.chromeframe {
107108
margin: 0.2em 0;
@@ -1602,7 +1603,7 @@ nav#main {
16021603
border-radius: 10px 10px 0 0;
16031604
border-right: 1px solid rgba(2, 2, 2, 0.28);
16041605
border-left: 1px solid rgba(2, 2, 2, 0.28);
1605-
border-top: 1px solid rgba(250, 250, 250, 0.27);
1606+
border-top: 1px solid rgba(250, 250, 250, 0.14);
16061607
box-shadow: 0 0 5px rgba(1, 1, 1, 0.7);
16071608
}
16081609

@@ -1641,8 +1642,7 @@ nav#main li a {
16411642
}
16421643

16431644
nav#main li a:hover,
1644-
nav#main li.current a,
1645-
nav#main .searchform {
1645+
nav#main li.current a {
16461646
background: none;
16471647
box-shadow: inset 0 0 5px rgba(0,0,0, 0.4), rgba(255,255,255,0.1) 0 1px 0;
16481648
border-radius: 4px;
@@ -1651,56 +1651,53 @@ nav#main .searchform {
16511651
text-shadow: rgba(0, 0, 0, 0.796875) 0 -1px 0, rgba(255, 255, 255, 0.296875) 0 0 10px;
16521652
}
16531653

1654-
nav#main .searchform {
1654+
.searchform {
16551655
float: right;
16561656
width: 28%;
1657-
margin-top: 12px;
1658-
margin-bottom: 12px;
1659-
padding: 0;
1660-
border-radius: 20px;
1661-
position: relative;
1662-
text-shadow: none;
16631657
}
1664-
1665-
/* Increase invisible click area to focus search field */
1666-
.searchform label {
1667-
width: 100%;
1668-
display: block;
1658+
.searchform input {
1659+
font-family: "Lucida Grande", Lucida, Verdana, sans-serif;
16691660
}
1670-
1671-
nav#main .searchform input {
1672-
text-decoration: none;
1673-
font: 12px/12px "Lucida Grande", Lucida, Verdana, sans-serif;
1674-
padding: 5px 10px;
1675-
margin: 0;
1676-
background-color: transparent;
1677-
border-style: none;
1678-
color: #fff;
1679-
line-height: 1.3;
1680-
text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.76);
1681-
width: 85%;
1682-
box-shadow: none;
1683-
}
1684-
1685-
nav#main .searchform input:focus {
1661+
.searchform input:focus {
16861662
outline: none;
16871663
}
16881664

1689-
nav#main .searchform input::placeholder {
1690-
color: #fff;
1665+
.searchform.tsmb-form {
1666+
--tsmb-size-radius: 5px;
1667+
--tsmb-size-base: 12px;
1668+
--tsmb-size-sm: 0.8rem;
1669+
--tsmb-color-base-background: var(--tsmb-color-primary50);
1670+
--tsmb-color-base30: #fff;
1671+
--tsmb-color-base50: var(--tsmb-color-primary90);
1672+
--tsmb-color-base90: var(--tsmb-color-primary90);
1673+
--tsmb-color-focus30: #666;
1674+
--tsmb-color-focus50: #444;
1675+
--tsmb-color-focus90: #ccc;
1676+
--tsmb-color-primary30: #333; /* jQuery Black */
1677+
--tsmb-color-primary50: #0769ad; /* jQuery Primary Blue */
1678+
--tsmb-color-primary90: #b4efff; /* oklch(0.92 0.07 228) hue=228 of #7ACEF4 (jQuery Secondary Blue) */
1679+
margin: 6px 0;
1680+
width: 30%;
16911681
}
1692-
1693-
nav#main .searchform .icon-search {
1694-
position: absolute;
1695-
right: 10px;
1696-
top: 3px;
1697-
bottom: 3px;
1682+
.jquery-ui .searchform.tsmb-form {
1683+
--tsmb-color-primary50: #b24926; /* jQuery UI Secondary Orange */
1684+
--tsmb-color-primary90: #ffddb2; /* = #b4efff + oklch(hue=70) of #FAA523 (jQuery UI Primary Orange) */
1685+
}
1686+
.jquery-mobile .searchform.tsmb-form {
1687+
--tsmb-color-primary50: #108040; /* jQuery Mobile Secondary Green */
1688+
--tsmb-color-primary90: #c9f2c8; /* = #b4efff + oklch(hue=144) of #3EB249 (jQuery UI Primary Orange) */
1689+
}
1690+
.searchform.tsmb-form:not(:focus-within)::before {
1691+
filter: invert();
1692+
}
1693+
.searchform.tsmb-form input[type=search] {
16981694
border-width: 0;
1699-
border-left: 1px solid rgba(7, 7, 7, 0.65);
1700-
background-color: transparent;
1701-
padding: 0 0 0 7px;
1702-
opacity: 0.33;
1703-
color: #fff;
1695+
}
1696+
.searchform.tsmb-form [role="listbox"] {
1697+
right: 0;
1698+
}
1699+
.searchform.tsmb-form [role="option"] mark {
1700+
border-bottom: 2px solid var(--tsmb-color-primary90);
17041701
}
17051702

17061703
#broadcast {
@@ -2840,6 +2837,9 @@ footer .books li a cite {
28402837
margin: 15px auto;
28412838
clear:both;
28422839
}
2840+
.searchform.tsmb-form input[type=search] {
2841+
border-width: 1px;
2842+
}
28432843

28442844
nav#main ul{
28452845
width: auto !important;
@@ -2959,8 +2959,7 @@ footer .books li a cite {
29592959
}
29602960

29612961
nav#main {
2962-
margin-top: 15px;
2963-
padding-top: 0;
2962+
padding: 0;
29642963
}
29652964

29662965
nav#main .searchform {

‎themes/jquery/css/docsearch.css

Lines changed: 51 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,55 @@
1-
/* Custom DocSeach CSS to adapt the generic one * See https://community.algolia.com/docsearch/styling.html for more info */
1+
/* Custom DocSeach CSS to adapt the generic one
2+
* See https://community.algolia.com/docsearch/styling.html for more info */
23

4+
nav#main .searchform {
5+
background: none;
6+
box-shadow: inset 0 0 5px rgba(0,0,0, 0.4), rgba(255,255,255,0.1) 0 1px 0;
7+
border: 1px solid rgba(0,0,0,0.25);
8+
color: #fff;
9+
10+
margin-top: 12px;
11+
margin-bottom: 12px;
12+
padding: 0;
13+
border-radius: 20px;
14+
position: relative;
15+
}
16+
17+
/* Increase invisible click area to focus search field */
18+
.searchform label {
19+
width: 100%;
20+
display: block;
21+
}
22+
23+
nav#main .searchform input {
24+
text-decoration: none;
25+
padding: 5px 10px;
26+
margin: 0;
27+
background-color: transparent;
28+
color: #fff;
29+
text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.76);
30+
font-size: 12px;
31+
width: 85%;
32+
box-shadow: none;
33+
border-style: none;
34+
line-height: 1.3;
35+
}
36+
37+
nav#main .searchform input::placeholder {
38+
color: #fff;
39+
}
40+
41+
nav#main .searchform .icon-search {
42+
position: absolute;
43+
right: 10px;
44+
top: 3px;
45+
bottom: 3px;
46+
border-width: 0;
47+
border-left: 1px solid rgba(7, 7, 7, 0.65);
48+
background-color: transparent;
49+
padding: 0 0 0 7px;
50+
opacity: 0.33;
51+
color: #fff;
52+
}
353

454
.algolia-autocomplete {
555
width: 99%;

‎themes/jquery/footer-mobile.php

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -8,7 +8,7 @@
88
</footer>
99

1010
<?php wp_footer(); ?>
11-
<?php jq_the_algolia_docsearch(); ?>
11+
<?php jq_search_the_footer(); ?>
1212

1313
</body>
1414
</html>

‎themes/jquery/footer-ui.php

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -36,7 +36,7 @@
3636
</footer>
3737

3838
<?php wp_footer(); ?>
39-
<?php jq_the_algolia_docsearch(); ?>
39+
<?php jq_search_the_footer(); ?>
4040

4141
</body>
4242
</html>

‎themes/jquery/footer.php

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -37,6 +37,6 @@
3737
</footer>
3838

3939
<?php wp_footer(); ?>
40-
<?php jq_the_algolia_docsearch(); ?>
40+
<?php jq_search_the_footer(); ?>
4141
</body>
4242
</html>

0 commit comments

Comments
 (0)