Skip to content

Commit fa5e54e

Browse files
bigbesbigbes
committed
Show language selector/search box in desktop version
closes gh-85, closes gh-86
1 parent fcfd5f1 commit fa5e54e

File tree

9 files changed

+230
-256
lines changed

9 files changed

+230
-256
lines changed

‎_theme/tarantool/_less/page-base.less

Lines changed: 191 additions & 131 deletions
Original file line numberDiff line numberDiff line change
@@ -98,85 +98,48 @@
9898
width: 799px;
9999
margin: 0 auto;
100100
}
101-
.b-footer-wrapper {
102-
padding: 15px 0 0 0;
103-
}
104101
.b-content-wrapper {
105102
width: 940px;
106103
margin: 0 auto;
107104
padding: 0 20px;
108105
}
109106

110-
.b-menu {
111-
.block-list();
112-
height: 44px;
113-
114-
.b-menu-item {
115-
display: inline-block;
116-
margin-right: -0.29em;
117-
118-
.b-menu-item-url {
119-
display:inline-block;
120-
text-decoration:none;
121-
}
122-
}
123-
}
124-
.b-header_menu {
125-
.b-menu-item {
126-
.b-menu-item-url {
127-
height:21px;
128-
padding:11px 19px 12px 19px;
129-
font-size:16px;
130-
}
131-
&:hover {
132-
.transition-ease();
133-
background:#e7f3fc;
134-
}
135-
&.p-active {
136-
.transition-ease();
137-
background:#168de2;
138-
.b-menu-item-url {
139-
color:#FFF;
140-
}
141-
}
142-
}
143-
}
144107
.b-footer {
145108
height: 46px;
146109
margin: -46px auto 0 auto;
147110
font-size: 12px;
148111
background: #FFF;
149112

150-
a {
151-
text-decoration: none;
152-
}
153-
a:hover {
154-
text-decoration: underline;
155-
}
156-
}
157-
.b-footer_menu {
158-
float: right;
159-
width: 729px;
113+
.b-footer-wrapper {
114+
padding: 15px 0 0 0;
160115

161-
.b-menu {
162-
float: center;
163-
height: auto;
164-
display: inline;
165-
}
166-
.b-menu-item {
167-
padding-right:35px;
168-
}
169-
.b-menu-item-url:hover {
170-
text-decoration:underline;
116+
.b-footer_menu {
117+
float: right;
118+
width: 729px;
119+
120+
.b-menu {
121+
float: center;
122+
height: auto;
123+
display: inline;
124+
.b-menu-item {
125+
padding-right:35px;
126+
a { text-decoration: none; }
127+
a:hover { text-decoration: underline; }
128+
}
129+
.b-menu-item-url:hover {
130+
text-decoration:underline;
131+
}
132+
}
133+
}
134+
.b-footer-other {
135+
float:right;
136+
display:inline;
137+
}
171138
}
172139
}
173140
.b-footer-copyright {
174141
display:inline;
175142
}
176-
.b-footer-other {
177-
float:right;
178-
display:inline;
179-
}
180143
.p-main .b-footer,
181144
.b-footer {
182145
height: 50px;
@@ -276,39 +239,175 @@
276239
}
277240
}
278241

279-
.b-search {
280-
width: 289px;
281-
border: 1px solid #262626;
282-
padding: 7px 11px 6px 11px;
283-
position: relative;
284-
background: #FFF;
285-
-webkit-border-radius: 6px;
286-
-moz-border-radius: 6px;
287-
border-radius: 6px;
288-
input {
289-
width: 99%;
290-
color: #404040;
291-
border: 0;
292-
font-size: 14px;
293-
background: none;
242+
.b-menu {
243+
.block-list();
244+
245+
.b-menu-item {
246+
display: inline-block;
247+
margin-right: -0.29em;
248+
249+
.b-menu-item-url {
250+
display: inline-block;
251+
text-decoration: none;
252+
}
294253
}
295-
.p-placeholder {
296-
color: #8c8c8c;
254+
}
255+
256+
.b-header_menu {
257+
display: flex;
258+
flex-direction: column;
259+
260+
.b-header_menu-top {
261+
display: flex;
262+
flex-direction: row;
263+
justify-content: space-between;
264+
height: 44px;
265+
266+
.b-menu {
267+
font-size: 16px;
268+
269+
.b-menu-item-url {
270+
height: 21px;
271+
padding: 11px 13px 12px 13px;
272+
font-size: 16px;
273+
}
274+
&:hover {
275+
.transition-ease();
276+
background:#e7f3fc;
277+
}
278+
&.p-active {
279+
.transition-ease();
280+
background:#168de2;
281+
.b-menu-item-url {
282+
color:#FFF;
283+
}
284+
}
285+
}
286+
.b-header_menu-top-ctl {
287+
display: flex;
288+
flex-direction: row;
289+
justify-content: space-between;
290+
291+
.b-doc-language_selector-list {
292+
margin: 0;
293+
padding: 0;
294+
list-style: none;
295+
display: flex;
296+
align-items: center;
297+
justify-content: center;
298+
299+
.b-doc-language_selector-item {
300+
padding: 0px;
301+
302+
&:first-child .b-doc-language_selector-item-url {
303+
border-radius: 4px 0 0 4px;
304+
}
305+
&:last-child .b-doc-language_selector-item-url {
306+
border-radius: 0 4px 4px 0;
307+
}
308+
.b-doc-language_selector-item-url {
309+
background: #ffffff;
310+
color: #3366bb;
311+
font-size: 14px;
312+
padding: 3px 8px 5px 8px;
313+
position: relative;
314+
border-color: #168de2;
315+
border-width: 1px;
316+
border-style: solid;
317+
&, &:hover {
318+
text-decoration:none;
319+
}
320+
&:hover {
321+
background: #e7f3fc;
322+
}
323+
&.p-active {
324+
pointer-events: none;
325+
background: #168de2;
326+
color: #ffffff;
327+
}
328+
}
329+
}
330+
}
331+
.b-search-btn {
332+
background: #ffffff;
333+
width: 50%;
334+
border: none;
335+
margin: 3px 5px 3px 5px;
336+
padding: 9px 17px 9px 17px;
337+
outline: none;
338+
}
339+
}
297340
}
298-
.b-search-text {
299-
width: 270px;
300-
margin: 0 0 0 24px;
341+
.b-header_menu-bottom {
342+
flex-direction: row;
343+
justify-content: space-between;
344+
display: none;
345+
346+
&.p-active {
347+
display: flex;
348+
}
349+
.b-header_menu-search {
350+
display: flex;
351+
width: 100%;
352+
margin: 0.75em 2em 0.75em 2em;
353+
354+
border: 2px solid #262626;
355+
border-radius: 5px;
356+
357+
.b-header_menu-search-text {
358+
padding: 0.2em 0 0.2em 1em;
359+
width: 100%;
360+
height: 2em;
361+
line-height: 3em;
362+
border: none;
363+
}
364+
.b-header_menu-search-but {
365+
background: #ffffff;
366+
color: #3366bb;
367+
border: none;
368+
&:hover {
369+
background: #e7f3fc;
370+
}
371+
}
372+
}
373+
}
374+
}
375+
376+
.headerlink {
377+
margin: 5px;
378+
font-size: 16px;
379+
left: -0.5em;
380+
opacity: 0;
381+
382+
-webkit-transition: opacity 0.2s ease-in-out 0.1s;
383+
-moz-transition: opacity 0.2s ease-in-out 0.1s;
384+
-ms-transition: opacity 0.2s ease-in-out 0.1s;
385+
transition: opacity 0.2s ease-in-out 0.1s;
386+
.fa-link {
387+
visibility: visible;
301388
}
302-
.b-search-but {
303-
top: 0;
304-
left: 0;
305-
width: 33px;
306-
height: 34px;
307-
cursor: pointer;
308-
padding: 0;
309-
position: absolute;
310-
background: @icon-search 12px 12px no-repeat;
311-
text-indent: 33px;
389+
i:hover {
390+
cursor: pointer;
391+
}
392+
}
393+
394+
.b-404 {
395+
text-align: center;
396+
font-size: 32px;
397+
.b-section-title {
398+
font-size: 64px
399+
}
400+
/* max-height: ~"calc(100vh - 150px)"; */
401+
img {
402+
padding: 50 0px;
403+
max-width: 100%;
404+
max-height: 100%;
405+
}
406+
p {
407+
padding-bottom: 50px;
408+
&:last-child {
409+
padding-bottom: 0px;
410+
}
312411
}
313412
}
314413

@@ -378,52 +477,13 @@ img.align-center {
378477
right: 25px;
379478
outline: none;
380479
border-radius: 3px;
381-
width: calc(100% - 103px);
480+
width: ~"calc(100% - 103px)";
382481
padding: 0 5px;
383482
border: 1px solid #212121;
384483
}
385484
}
386485
}
387486
}
388-
389-
.headerlink {
390-
margin: 5px;
391-
font-size: 16px;
392-
left: -0.5em;
393-
opacity: 0;
394-
395-
-webkit-transition: opacity 0.2s ease-in-out 0.1s;
396-
-moz-transition: opacity 0.2s ease-in-out 0.1s;
397-
-ms-transition: opacity 0.2s ease-in-out 0.1s;
398-
transition: opacity 0.2s ease-in-out 0.1s;
399-
.fa-link {
400-
visibility: visible;
401-
}
402-
i:hover {
403-
cursor: pointer;
404-
}
405-
}
406-
407-
.b-404 {
408-
text-align: center;
409-
font-size: 32px;
410-
.b-section-title {
411-
font-size: 64px
412-
}
413-
/* max-height: ~"calc(100vh - 150px)"; */
414-
img {
415-
padding: 50 0px;
416-
max-width: 100%;
417-
max-height: 100%;
418-
}
419-
p {
420-
padding-bottom: 50px;
421-
&:last-child {
422-
padding-bottom: 0px;
423-
}
424-
}
425-
}
426-
427487
@media screen and (max-width: 992px) {
428488
#mobile-checker { display: none !important; }
429489
}

0 commit comments

Comments
 (0)