Movatterモバイル変換

[0]ホーム
URL:

Skip to content

Navigation Menu

Sign in
Appearance settings

Search code, repositories, users, issues, pull requests...

Provide feedback

We read every piece of feedback, and take your input very seriously.

Saved searches

Use saved searches to filter your results more quickly

 Sign up
Appearance settings

Commite4d8fa0

Browse files
feat(ui): added helpbub (#970)
* added helpbub; restyled main helpbub button* added smaller helpbub at all other pages* centered modal* Update _buttons.scss* Update _buttons.scss* centered helpbub vertically; added green outline* small pr improvements* efford to fix issue with button representation* cleaned yarn.lock changes; added aria-label for buttons; fixed username; refreshed helpbub code snippet* Update yarn.lock* set an anonymous user for helpbub---------Co-authored-by: NimRegev <nima.regev@codefresh.io>
1 parent8590dcc commite4d8fa0

File tree

9 files changed

+99
-20
lines changed

9 files changed

+99
-20
lines changed

‎_includes/docs-navbar.html‎

Lines changed: 19 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -6,8 +6,8 @@
66
</div>
77
<spanclass="badge cf-badge cf-badge-doc align-middle ml-1">Codefresh Documentation</span>
88
</a>
9-
{% if page.layout != "home" %}
10-
<divid="searchbar"class="order-2 order-md-2 align-items-center"></div>
9+
<!-- {% if page.layout != "home" %}-->
10+
<!-- <div></div>-->
1111
<!-- <form class="bd-search {% if page.layout == "docs" %}bd-search-docs {% endif %}d-flex mt-1 mb-1 mt-md-0 order-2 order-md-2 align-items-center">
1212
<input type="search" class="form-control form-control-dark mr-sm-2 doc-search-input" id="navbar-search-input" placeholder="{{ site.data.translations[site.locale].search_placeholder_text }}" aria-label="{{ site.data.translations[site.locale].search_placeholder_text }}" autocomplete="off">
1313
<i class="fa fa-search"></i>
@@ -17,7 +17,7 @@
1717
</button>
1818
{% endif %}
1919
</form> -->
20-
{% endif %}
20+
<!-- {% endif %}-->
2121
<divclass="navbar-nav-scroll order-1 order-md-1 mx-md-auto">
2222
<ulclass="navbar-nav flex-row mx-md-auto">
2323

@@ -93,6 +93,21 @@
9393
</ul>
9494
</div>
9595
-<!-- </div>
96-
<a href="https://codefresh.io/docs/">View Codefresh Docs</a>
96+
<a href="https://codefresh.io/docs/">View Codefresh Docs</a>
9797
</div> -->
98+
99+
{% if page.layout != "home" %}
100+
<button
101+
onclick="window.CommandBar.toggleHelpHub()"
102+
class="helpbub-toggler helpbub-toggler--small order-2 order-md-2"
103+
aria-label="Search Codefresh Documentation"
104+
type="button"
105+
>
106+
<divclass="d-flex align-items-center">
107+
<imgsrc="{{site.baseurl}}/images/icons/search.png"/>
108+
<spanclass="ml-2">Search</span>
109+
</div>
110+
<spanclass="helpbub-toggler--hotkey">&#8984; + K</span>
111+
</button>
112+
{% endif %}
98113
</header>

‎_includes/scripts.html‎

Lines changed: 30 additions & 13 deletions
Original file line numberDiff line numberDiff line change
@@ -34,19 +34,36 @@
3434

3535

3636
<!-- Start of Doc Search Embed Code -->
37+
<!--<script>-->
38+
<!-- docsearch({-->
39+
<!-- // inputSelector: '.doc-search-input',-->
40+
<!-- container: '#searchbar',-->
41+
<!-- typesenseCollectionName: 'project-one-doc-index', // Should match the collection name you mention in the docsearch scraper config.js-->
42+
<!-- typesenseServerConfig: {-->
43+
<!-- nodes: [{-->
44+
<!-- host: 'fxokw93dqyu27pv6p.a1.typesense.net', // For Typesense Cloud use xxx.a1.typesense.net-->
45+
<!-- port: '443', // For Typesense Cloud use 443-->
46+
<!-- protocol: 'https' // For Typesense Cloud use https-->
47+
<!-- }],-->
48+
<!-- apiKey: '5aRIuEbEpw9LTf2B5te4Essx4o4HE4Fl', // Use API Key with only Search permissions-->
49+
<!-- },-->
50+
<!-- });-->
51+
<!--</script>-->
52+
<!-- End of Doc Search Embed Code -->
53+
3754
<script>
38-
docsearch({
39-
// inputSelector: '.doc-search-input',
40-
container:'#searchbar',
41-
typesenseCollectionName:'project-one-doc-index',// Should match the collection name you mention in the docsearch scraper config.js
42-
typesenseServerConfig:{
43-
nodes:[{
44-
host:'fxokw93dqyu27pv6p.a1.typesense.net',// For Typesense Cloud use xxx.a1.typesense.net
45-
port:'443',// For Typesense Cloud use 443
46-
protocol:'https'// For Typesense Cloud use https
47-
}],
48-
apiKey:'5aRIuEbEpw9LTf2B5te4Essx4o4HE4Fl',// Use API Key with only Search permissions
49-
},
55+
varo="3033bf7f",n=["Object.assign","Symbol","Symbol.for"].join("%2C"),a=window;functionr(o,n){void0===n&&(n=!1),"complete"!==document.readyState&&window.addEventListener("load",r.bind(null,o,n),{capture:!1,once:!0});vara=document.createElement("script");a.type="text/javascript",a.async=n,a.src=o,document.head.appendChild(a)}functiont(){varn;if(void0===a.CommandBar){deletea.__CommandBarBootstrap__;vart=Symbol.for("CommandBar::configuration"),e=Symbol.for("CommandBar::orgConfig"),i=Symbol.for("CommandBar::disposed"),c=Symbol.for("CommandBar::isProxy"),m=Symbol.for("CommandBar::queue"),d=Symbol.for("CommandBar::unwrap"),l=Symbol.for("CommandBar::eventSubscriptions"),s=[],u=localStorage.getItem("commandbar.lc"),f=u&&u.includes("local")?"http://localhost:8000":"https://api.commandbar.com",p=Object.assign(((n={})[t]={uuid:o},n[e]={},n[i]=!1,n[c]=!0,n[m]=newArray,n[d]=function(){returnp},n[l]=void0,n),a.CommandBar),b=["addCommand","boot","addEventSubscriber","addRecordAction","setFormFactor"],y=p;Object.assign(p,{shareCallbacks:function(){return{}},shareContext:function(){return{}}}),a.CommandBar=newProxy(p,{get:function(o,n){returnniny?p[n]:"then"!==n?b.includes(n)?function(){varo=Array.prototype.slice.call(arguments);returnnewPromise((function(a,r){o.unshift(n,a,r),p[m].push(o)}))}:function(){varo=Array.prototype.slice.call(arguments);o.unshift(n),p[m].push(o)}:void0}}),null!==u&&s.push("lc=".concat(u)),s.push("version=2"),r("".concat(f,"/latest/").concat(o,"?").concat(s.join("&")),!0)}}void0===Object.assign||"undefined"==typeofSymbol||void0===Symbol.for?(a.__CommandBarBootstrap__=t,r("https://polyfill.io/v3/polyfill.min.js?version=3.101.0&callback=__CommandBarBootstrap__&features="+n)):t();
56+
window.CommandBar.boot(
57+
"",
58+
{},
59+
{canOpenEditor:false,products:["help_hub"]}
60+
);
61+
62+
document.addEventListener("keydown",function(event){
63+
if(event.metaKey&&event.key==="k"){
64+
window.CommandBar.toggleHelpHub();
65+
}
5066
});
5167
</script>
52-
<!-- End of Doc Search Embed Code -->
68+
69+

‎assets/css/docs.min.css‎

Lines changed: 1 addition & 1 deletion
Some generated files are not rendered by default. Learn more aboutcustomizing how changed files appear on GitHub.

‎assets/css/docs.min.css.map‎

Lines changed: 1 addition & 1 deletion
Some generated files are not rendered by default. Learn more aboutcustomizing how changed files appear on GitHub.

‎assets/scss/_helpbub.scss‎

Lines changed: 29 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,29 @@
1+
.helpbub-toggler {
2+
display:flex;
3+
flex-wrap:nowrap;
4+
align-items:center;
5+
justify-content:space-between;
6+
7+
width:100%;
8+
padding:4px12px4px8px;
9+
10+
color:$helpbub-text-color;
11+
cursor:pointer;
12+
background-color:$helpbub-bg;
13+
14+
border:1pxsolid$helpbub-border;
15+
border-radius:16px;
16+
17+
.helpbub-toggler--hotkey {
18+
color:$bd-doc-content-bg;
19+
}
20+
21+
&:focus {
22+
outline:1pxsolid$cf-bright-green;
23+
box-shadow:0005pxrgba(95,255,191,.24);
24+
}
25+
}
26+
27+
.helpbub-toggler--small {
28+
max-width:275px;
29+
}

‎assets/scss/_variables.scss‎

Lines changed: 5 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -77,6 +77,11 @@ $bd-doc-content-border: #dadada;
7777
$bd-link-color:$bd-topaz-main!default;
7878
$bd-link-hover-color:darken($bd-link-color,15%)!default;
7979

80+
// Helphub
81+
$helpbub-bg:#3f4255;
82+
$helpbub-text-color:#b0c4e7;
83+
$helpbub-border:#35384b;
84+
8085
// Fonts
8186
// stylelint-disable value-keyword-case
8287
$font-family-sans-serif:"Lato",-apple-system, BlinkMacSystemFont,"Segoe UI", roboto, Oxygen, Ubuntu, Cantarell,"Fira Sans","Droid Sans","Helvetica Neue",sans-serif;

‎assets/scss/docs.scss‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -47,3 +47,4 @@
4747
@import"anchor";
4848
@import"links";
4949
@import"algolia";
50+
@import"helpbub";

‎images/icons/search.png‎

285 Bytes
Loading

‎index.html‎

Lines changed: 13 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -19,7 +19,19 @@ <h2 class="mb-3 bd-text-white text-uppercase">
1919
Instantly build, test, and deploy Docker images.<br>
2020
Realize your true DevOps potential with the premier enterprise Argo software delivery solution.
2121
</p>
22-
<divid="searchbar"></div>
22+
<!-- <div id="searchbar"></div>-->
23+
<button
24+
onclick="window.CommandBar.toggleHelpHub()"
25+
class="helpbub-toggler mb-3"
26+
aria-label="Search Codefresh Documentation"
27+
type="button"
28+
>
29+
<divclass="d-flex align-items-center">
30+
<imgsrc="{{site.baseurl}}/images/icons/search.png"/>
31+
<spanclass="ml-2">Search</span>
32+
</div>
33+
<spanclass="helpbub-toggler--hotkey">&#8984; + K</span>
34+
</button>
2335
<!-- <div>
2436
<form class="bd-search bd-search--home d-flex mt-1 mb-3 mt-md-0 order-2 order-md-2 align-items-center">
2537
<input type="search" class="form-control form-control-dark mr-sm-2 doc-search-input" id="navbar-search-input" placeholder="{{ site.data.translations[site.locale].search_placeholder_text }}" aria-label="{{ site.data.translations[site.locale].search_placeholder_text }}" autocomplete="off">

0 commit comments

Comments
 (0)
[8]ページ先頭
©2009-2025 Movatter.jp