File tree Expand file tree Collapse file tree 2 files changed +24
-7
lines changed Expand file tree Collapse file tree 2 files changed +24
-7
lines changed Original file line number Diff line number Diff line change @@ -68,7 +68,7 @@ document.addEventListener('DOMContentLoaded', () => {
68
68
hamburgerToggle . addEventListener ( 'click' , ( e ) => {
69
69
sidebar . element . classList . toggle ( 'sidebar-toggle' ) ;
70
70
let button = hamburgerToggle . firstElementChild ;
71
- if ( button . textContent == 'menu' ) {
71
+ if ( button . textContent === 'menu' ) {
72
72
button . textContent = 'close' ;
73
73
}
74
74
else {
@@ -90,8 +90,25 @@ document.addEventListener('DOMContentLoaded', () => {
90
90
} ) ;
91
91
} ) ;
92
92
93
+ isMobile = ( ) => {
94
+ return window . matchMedia ( "only screen and (max-width: 760px)" ) . matches ;
95
+ }
96
+
93
97
document . addEventListener ( 'keydown' , ( event ) => {
94
- if ( event . code == "Escape" && activeModal ) {
98
+ if ( event . code === "Escape" && activeModal ) {
95
99
activeModal . close ( ) ;
96
100
}
101
+ else if ( event . code === "KeyF" && ( event . ctrlKey || event . metaKey ) ) {
102
+ event . preventDefault ( ) ;
103
+ if ( isMobile ( ) ) {
104
+ mobileSearch . bar . scrollIntoView ( ) ;
105
+ mobileSearch . bar . focus ( ) ;
106
+ mobileSearch . open ( ) ;
107
+ }
108
+ else {
109
+ let searchInput = document . getElementById ( 'top-bar-search-input' ) ;
110
+ searchInput . scrollIntoView ( ) ;
111
+ searchInput . focus ( ) ;
112
+ }
113
+ }
97
114
} ) ;
Original file line number Diff line number Diff line change 71
71
< nav class ="mobile-only ">
72
72
< form role ="search " class ="search " action ="{{ pathto('search') }} " method ="get ">
73
73
< div class ="search-wrapper ">
74
- < input type ="search " name ="q " placeholder ="{{ _('Search documentation') }} " />
74
+ < input type ="search " id =" top-bar-search-input-mobile " name ="q " placeholder ="{{ _('Search documentation') }} " />
75
75
< button type ="submit ">
76
- < span class ="material-icons " aria-hidden ="true "> </ span >
76
+ < span class ="material-icons " aria-hidden ="true "> search </ span >
77
77
</ button >
78
78
</ div >
79
79
</ form >
94
94
</ select >
95
95
< form role ="search " class ="search " action ="{{ pathto('search') }} " method ="get ">
96
96
< div class ="search-wrapper ">
97
- < input type ="search " name ="q " placeholder ="{{ _('Search documentation') }} " />
97
+ < input type ="search " id =" top-bar-search-input " name ="q " placeholder ="{{ _('Search documentation') }} " />
98
98
< button type ="submit ">
99
99
< span class ="material-icons "> search</ span >
100
100
</ button >
101
101
</ div >
102
102
</ form >
103
- < a accesskey ="S " class ="settings "> < span class ="fa-1x fa-solid fa-gear "> </ span > </ a >
103
+ < a accesskey ="s " class ="settings "> < span class ="fa-1x fa-solid fa-gear "> </ span > </ a >
104
104
</ div >
105
105
{#- The sidebar component #}
106
106
< aside class ="grid-item ">
149
149
</ script >
150
150
{%- endif %}
151
151
152
- < div id ="settings " class ="modal " onclick ="if (event.target == this){ openModal(event, true); } " hidden >
152
+ < div id ="settings " class ="modal " accesskey =" s " onclick ="if (event.target = == this){ openModal(event, true); } " hidden >
153
153
< div class ="modal-content ">
154
154
< span class ="close material-icons " onclick ="openModal(event, true); " title ="Close "> close</ span >
155
155
< h1 > {{ _('Settings') }}</ h1 >
You can’t perform that action at this time.
0 commit comments