Skip to content

Commit a0db2a0

Browse files
author
scotty
committed
searchbox/vendorStrip responsive fixes
1 parent c6c27c2 commit a0db2a0

File tree

5 files changed

+91
-78
lines changed

5 files changed

+91
-78
lines changed

‎_layouts/docwithnav.html

Lines changed: 4 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -15,13 +15,10 @@ <h5>{{ site.data[foundTOC].abstract }}</h5>
1515
<li><a href="/docs/reference">REFERENCE</a></li>
1616
<li><a href="/docs/samples">SAMPLES</a></li>
1717
<li><a href="/docs/troubleshooting/">SUPPORT</a></li>
18-
</ul><!--
19-
<div class="dropdown">
20-
<div class="readout"></div>
21-
<a href="/v1.1/">Version 1.1</a>
22-
<a href="/v1.2/">Version 1.2</a>
23-
</div>-->
24-
<input type="text" id="search" placeholder="Search" onkeydown="if (event.keyCode==13) window.location.replace('/docs/search/?q=' + this.value)">
18+
</ul>
19+
<div id="searchBox">
20+
<input type="text" id="search" placeholder="Search" onkeydown="if (event.keyCode==13) window.location.replace('/docs/search/?q=' + this.value)">
21+
</div>
2522
</div>
2623
</section>
2724

‎_sass/_base.sass

Lines changed: 34 additions & 28 deletions
Original file line numberDiff line numberDiff line change
@@ -50,7 +50,7 @@ $main-nav-left-button-font-size: 18px
5050
$hero-padding-top: 80px
5151
$headline-wrapper-margin-bottom: 40px
5252
$quickstart-button-padding: 0 50px
53-
$vendor-strip-height: 44px
53+
$vendor-strip-height: 88px
5454
$vendor-strip-font-size: 16px
5555

5656

@@ -119,7 +119,7 @@ header
119119
display: none
120120

121121
#viewDocs
122-
border: 1px solid white
122+
border: 2px solid white
123123
background-color: transparent
124124
transition: 0.3s
125125

@@ -260,16 +260,12 @@ header
260260

261261
// VENDOR STRIP
262262
#vendorStrip
263+
position: relative
263264
background-color: transparentize(white, 0.9)
264265
font-weight: 100
265266
white-space: nowrap
266267
text-align: center
267268

268-
div
269-
vertical-align: middle
270-
height: 100%
271-
display: inline-block
272-
273269
// FOOTER
274270
footer
275271
width: 100%
@@ -393,7 +389,8 @@ section
393389
background-color: $dark-grey
394390

395391
h5
396-
margin-bottom: 20px
392+
margin: 20px 0
393+
line-height: 28px
397394

398395
#vendorStrip
399396
position: relative
@@ -412,22 +409,31 @@ section
412409
font-size: 0.75em
413410
font-weight: bold
414411

415-
li + li, #search
412+
li + li
416413
margin-left: 20px
417414

418-
#search
419-
display: block
420-
position: relative
421-
width: 100%
422-
min-width: 250px
423-
padding: 0 10px
424-
margin: 0
425-
height: 30px
426-
line-height: 30px
427-
border: 0
428-
background-color: $dark-grey
429-
font-size: 16px
430-
clear: both
415+
416+
#docs
417+
#vendorStrip
418+
line-height: 44px
419+
420+
ul
421+
float: none
422+
423+
#searchBox
424+
float: none
425+
display: block
426+
width: 80%
427+
margin: 0 auto
428+
height: 44px
429+
line-height: 44px
430+
431+
#search
432+
width: 100%
433+
padding: 0 10px
434+
height: 30px
435+
line-height: 30px
436+
font-size: 16px
431437

432438

433439
#encyclopedia
@@ -700,7 +706,7 @@ section
700706
background-color: transparent
701707

702708
.includecode, .includecode th, .includecode td
703-
padding: 0px !important
709+
padding: 0 !important
704710

705711
.includecode th
706712
text-align: right !important
@@ -711,7 +717,7 @@ section
711717
background-color: transparent !important
712718

713719
.includecode pre
714-
margin: 0px !important
720+
margin: 0 !important
715721

716722
ul li
717723
list-style: disc
@@ -1057,14 +1063,14 @@ $feature-box-div-margin-bottom: 40px
10571063

10581064
#home #hero
10591065
margin-bottom: 0
1066+
padding-bottom: 1px
10601067

10611068
main
1069+
padding: 0 10px
10621070
margin-bottom: 30px
10631071

1064-
#vendorStrip img
1065-
max-height: 24px
1066-
vertical-align: middle
1067-
margin: 0 30px
1072+
#vendorStrip
1073+
display: none
10681074

10691075

10701076
// OCEAN NODES

‎_sass/_desktop.sass

Lines changed: 33 additions & 15 deletions
Original file line numberDiff line numberDiff line change
@@ -1,26 +1,44 @@
11
$main-max-width: 1200px
2+
$vendor-strip-height: 44px
23
$video-section-height: 550px
34

45
@media screen and (min-width: 1025px)
56
#vendorStrip
6-
white-space: nowrap
7+
height: $vendor-strip-height
8+
line-height: $vendor-strip-height
79

8-
li + li, #search
9-
margin-left: 60px
10-
11-
#search
12-
display: inline-block
13-
position: relative
10+
#searchBox
1411
float: right
15-
width: 24%
16-
min-width: 250px
17-
padding: 0 10px
18-
margin: 8px 30px 0 0
19-
height: 30px
20-
line-height: 30px
21-
border: 1px solid $light-grey
22-
font-size: 16px
2312

13+
//#search
14+
// display: inline-block
15+
// position: relative
16+
// float: right
17+
// width: 24%
18+
// min-width: 250px
19+
// padding: 0 10px
20+
// margin: 8px 30px 0 0
21+
// height: 30px
22+
// line-height: 30px
23+
// border: 1px solid $light-grey
24+
// font-size: 16px
25+
// clear: none
26+
27+
28+
#home
29+
#hero
30+
#vendorStrip
31+
display: block
32+
33+
#docs
34+
#hero
35+
#vendorStrip
36+
ul
37+
float: left
38+
39+
#searchBox
40+
float: right
41+
width: 30%
2442

2543

2644
#docsToc

‎_sass/_tablet.sass

Lines changed: 15 additions & 20 deletions
Original file line numberDiff line numberDiff line change
@@ -48,7 +48,6 @@ $main-nav-left-button-font-size: 18px
4848
$hero-padding-top: 80px
4949
$headline-wrapper-margin-bottom: 40px
5050
$quickstart-button-padding: 0 50px
51-
$vendor-strip-height: 44px
5251
$vendor-strip-font-size: 16px
5352

5453
//video
@@ -81,6 +80,21 @@ $feature-box-div-width: 45%
8180
display: block
8281
text-align: center
8382

83+
img
84+
max-height: 24px
85+
vertical-align: middle
86+
margin: 0 30px
87+
88+
#docs
89+
#vendorStrip
90+
ul
91+
a
92+
font-size: 1em
93+
font-weight: normal
94+
95+
li + li
96+
margin-left: 60px
97+
8498

8599
#oceanNodes
86100
h3
@@ -126,8 +140,6 @@ $feature-box-div-width: 45%
126140

127141
#video
128142
height: $video-section-height
129-
130-
#video
131143
display: block
132144

133145
& > .light-text
@@ -187,20 +199,3 @@ $feature-box-div-width: 45%
187199
a
188200
width: 25%
189201
font-size: 22px
190-
191-
//
192-
// .social
193-
// position: relative
194-
// margin: 80px 0 60px
195-
//
196-
// label
197-
// float: right
198-
// display: inline-block
199-
// height: 50px
200-
// line-height: 50px
201-
// font-weight: 100
202-
// white-space: nowrap
203-
//
204-
// input
205-
// margin-left: 8px
206-
// width: 300px

‎index.html

Lines changed: 5 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -17,14 +17,11 @@ <h5>Manage an infrastructure cluster as a single system to simplify container op
1717
<a href="/docs/hellonode/" id="quickstartButton" class="button">Try Our Hello World</a>
1818
</main>
1919
<div id="vendorStrip" class="light-text">
20-
<!--<div>Join the growing community already using Kubernetes</div>-->
21-
<div>
22-
<img src="images/logos/viacom_logo.png">
23-
<img src="images/logos/soundcloud_logo.png">
24-
<img src="images/logos/redhat_logo.png">
25-
<img src="images/logos/wepay_logo.png">
26-
<img src="images/logos/verizon_logo.png">
27-
</div>
20+
<img src="images/logos/viacom_logo.png">
21+
<img src="images/logos/soundcloud_logo.png">
22+
<img src="images/logos/redhat_logo.png">
23+
<img src="images/logos/wepay_logo.png">
24+
<img src="images/logos/verizon_logo.png">
2825
</div>
2926
</section>
3027

0 commit comments

Comments
 (0)