Skip to content

Commit 9403f98

Browse files
sethladdsethladd
authored
use flexbox (#1452)
* use flexbox * style tweaks * tweaks from review, regen tests * fix comment * regen
1 parent f24a1bb commit 9403f98

File tree

592 files changed

+12868
-25008
lines changed

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

592 files changed

+12868
-25008
lines changed

‎lib/resources/styles.css

Lines changed: 95 additions & 26 deletions
Original file line numberDiff line numberDiff line change
@@ -10,15 +10,90 @@
1010
.secondary-text-color { color: #727272; }
1111
.divider-color { border-color: #B6B6B6; }
1212

13-
html {
14-
position: relative;
15-
min-height: 100%;
13+
/* for layout */
14+
html,
15+
body {
16+
margin: 0;
17+
padding: 0;
18+
height: 100%;
19+
}
20+
body {
21+
display: flex;
22+
flex-direction: column;
23+
min-height: 100vh;
24+
}
25+
header {
26+
flex: 0 0 56px;
27+
display: flex;
28+
flex-direction: row;
29+
align-items: center;
30+
padding-left: 30px;
31+
}
32+
header ol {
33+
list-style: none;
34+
margin: 0;
35+
padding: 0;
36+
}
37+
header ol li {
38+
display: inline;
39+
}
40+
header form {
41+
display: flex;
42+
flex: 1;
43+
justify-content: flex-end;
44+
padding-right: 30px;
45+
46+
}
47+
footer {
48+
flex: 0 0 16px;
49+
display: flex;
50+
justify-content: center;
51+
align-items: center;
52+
padding: 20px;
53+
}
54+
main {
55+
flex: 1;
56+
display: flex;
57+
flex-direction: row;
58+
}
59+
.sidebar-offcanvas-left {
60+
flex: 0 1 195px;
61+
overflow-y: scroll;
62+
padding: 20px 0 15px 30px;
63+
}
64+
65+
::-webkit-scrollbar-button{ display: none; height: 13px; border-radius: 0px; background-color: #AAA; }
66+
::-webkit-scrollbar-button:hover{ background-color: #AAA; }
67+
::-webkit-scrollbar-thumb{ background-color: #CCC; }
68+
::-webkit-scrollbar-thumb:hover{ background-color: #CCC; }
69+
::-webkit-scrollbar{ width: 4px; }
70+
71+
.main-content {
72+
flex: 1;
73+
overflow-y: auto;
74+
padding: 20px 15px 0 30px;
75+
}
76+
77+
.main-content p {
78+
max-width: 700px;
79+
}
80+
81+
.sidebar,
82+
.main-content {
83+
margin: 20px 0;
1684
}
1785

86+
.sidebar-offcanvas-right {
87+
flex: 0 1 12em;
88+
overflow-y: auto;
89+
padding: 20px 15px 15px 15px;
90+
margin-right: 20px;
91+
}
92+
/* end for layout */
93+
1894
body {
1995
-webkit-text-size-adjust: 100%;
2096
overflow-x: hidden;
21-
2297
font-family: "Source Sans Pro", sans-serif;
2398
font-size: 16px;
2499
line-height: 1.42857143;
@@ -33,6 +108,12 @@ nav.navbar {
33108
border: 0;
34109
}
35110

111+
@media (max-width: 767px) {
112+
.hidden-xs {
113+
display: none!important;
114+
}
115+
}
116+
36117
nav.navbar .row {
37118
padding-top: 8px;
38119
}
@@ -41,12 +122,6 @@ nav .container {
41122
white-space: nowrap;
42123
}
43124

44-
@media screen and (min-width: 500px) and (max-width: 768px) {
45-
.navbar-right {
46-
float: right!important;
47-
}
48-
}
49-
50125
header {
51126
background-color: #eeeeee;
52127
box-shadow: 0 3px 5px rgba(0,0,0,0.1);
@@ -75,6 +150,10 @@ header .contents {
75150
}
76151
}
77152

153+
a {
154+
text-decoration: none;
155+
}
156+
78157
.body {
79158
margin-top: 90px;
80159
}
@@ -135,6 +214,7 @@ strong {
135214

136215
p {
137216
margin-bottom: 1em;
217+
margin-top: 0;
138218
}
139219

140220
a, a:hover {
@@ -235,6 +315,7 @@ dt {
235315
dd {
236316
color: #212121;
237317
margin-bottom: 1em;
318+
margin-left: 0;
238319
}
239320

240321
dd.callable, dd.constant, dd.property {
@@ -309,11 +390,8 @@ p.firstline {
309390

310391
footer {
311392
color: #fff;
312-
line-height: 16px;
313393
background-color: #111111;
314-
padding: 20px;
315394
width: 100%;
316-
margin: 20px 0 0 0;
317395
}
318396

319397
footer p {
@@ -510,16 +588,11 @@ ul.subnav li:last-of-type {
510588

511589
/* sidebar styles */
512590

513-
.sidebar-offcanvas-left,
514-
.sidebar-offcanvas-right {
515-
padding: 0;
516-
}
517-
518591
.sidebar ol {
519592
list-style: none;
520593
line-height: 22px;
521594
margin-bottom: 0;
522-
padding: 0;
595+
padding: 0 0 15px 0;
523596
}
524597

525598
.sidebar h5 a,
@@ -644,10 +717,6 @@ button {
644717
border: 0;
645718
}
646719

647-
form.search {
648-
display: inline;
649-
}
650-
651720
@media screen and (max-width: 500px) {
652721
form.search {
653722
display: none;
@@ -658,8 +727,8 @@ form.search {
658727
.tt-query,
659728
.tt-hint {
660729
width: 200px;
661-
height: 30px;
662-
padding: 8px 12px;
730+
height: 20px;
731+
padding: 4px 12px;
663732
line-height: 30px;
664733
outline: none;
665734
}
@@ -764,4 +833,4 @@ li.inherited a {
764833
a[href]:after {
765834
content:"" !important;
766835
}
767-
}
836+
}

‎lib/resources/typeahead.bundle.min.js

Lines changed: 4 additions & 4 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎lib/src/html/templates.dart

Lines changed: 0 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -21,7 +21,6 @@ const _partials = const <String>[
2121
'footer',
2222
'head',
2323
'property',
24-
'styles_and_scripts',
2524
'features',
2625
'documentation',
2726
'name_summary',

‎lib/templates/_footer.html

Lines changed: 9 additions & 20 deletions
Original file line numberDiff line numberDiff line change
@@ -1,26 +1,15 @@
1-
</div> <!-- row -->
2-
</div> <!-- container -->
1+
</main>
32

43
<footer>
5-
<div class="container-fluid">
6-
<div class="container">
7-
<p class="text-center">
8-
<span class="no-break">
9-
{{package.name}} {{package.version}}
10-
</span>
11-
&bull;
12-
<span class="no-break">
13-
<a href="https://www.dartlang.org"><img src="static-assets/favicon.png" alt="Dart" title="Dart" width="16" height="16"></a>
14-
</span>
15-
&bull;
16-
<span class="copyright no-break">
17-
<a href="http://creativecommons.org/licenses/by-sa/4.0/">cc license</a>
18-
</span>
4+
<span class="no-break">
5+
{{package.name}} {{package.version}}
6+
</span>
7+
&bull;
8+
<span class="copyright no-break">
9+
<a href="http://creativecommons.org/licenses/by-sa/4.0/">cc license</a>
10+
</span>
1911

20-
<!-- footer-text placeholder -->
21-
</p>
22-
</div>
23-
</div>
12+
<!-- footer-text placeholder -->
2413
</footer>
2514

2615
<script src="https://code.jquery.com/jquery-2.1.4.min.js"></script>

‎lib/templates/_head.html

Lines changed: 15 additions & 25 deletions
Original file line numberDiff line numberDiff line change
@@ -19,7 +19,6 @@
1919

2020
<link href="https://fonts.googleapis.com/css?family=Source+Code+Pro:500,400i,400,300|Source+Sans+Pro:400,300,700" rel="stylesheet">
2121
<link rel="stylesheet" href="static-assets/prettify.css">
22-
<link rel="stylesheet" href="static-assets/css/bootstrap.min.css">
2322
<link rel="stylesheet" href="static-assets/styles.css">
2423
<link rel="icon" href="static-assets/favicon.png">
2524

@@ -30,29 +29,20 @@
3029

3130
<div id="overlay-under-drawer"></div>
3231

33-
<header class="container-fluid header-fixed" id="title">
34-
<nav class="navbar navbar-fixed-top">
35-
<div class="container">
36-
<div class="row">
37-
<div class="col-sm-12 contents">
38-
{{^navLinks.isEmpty}}
39-
<button id="sidenav-left-toggle" type="button">&nbsp;</button>
40-
{{/navLinks.isEmpty}}
41-
<ol class="breadcrumbs gt-separated dark hidden-xs">
42-
{{#navLinks}}
43-
<li><a href="{{href}}">{{name}}</a></li>
44-
{{/navLinks}}
45-
<li class="self-crumb">{{{ layoutTitle }}}</li>
46-
</ol>
47-
<div class="self-name">{{self.name}}</div>
48-
<form class="search navbar-right" role="search">
49-
<input type="text" id="search-box" autocomplete="off" disabled class="form-control typeahead" placeholder="Loading search...">
50-
</form>
51-
</div> <!-- /col -->
52-
</div> <!-- /row -->
53-
</div> <!-- /container -->
54-
</nav>
32+
<header id="title">
33+
{{^navLinks.isEmpty}}
34+
<button id="sidenav-left-toggle" type="button">&nbsp;</button>
35+
{{/navLinks.isEmpty}}
36+
<ol class="breadcrumbs gt-separated dark hidden-xs">
37+
{{#navLinks}}
38+
<li><a href="{{href}}">{{name}}</a></li>
39+
{{/navLinks}}
40+
<li class="self-crumb">{{{ layoutTitle }}}</li>
41+
</ol>
42+
<div class="self-name">{{self.name}}</div>
43+
<form class="search navbar-right" role="search">
44+
<input type="text" id="search-box" autocomplete="off" disabled class="form-control typeahead" placeholder="Loading search...">
45+
</form>
5546
</header>
5647

57-
<div class="container body">
58-
<div class="row">
48+
<main>

‎lib/templates/_styles_and_scripts.html

Lines changed: 0 additions & 5 deletions
This file was deleted.

‎lib/templates/index.html

Lines changed: 0 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -67,8 +67,4 @@ <h2>Libraries</h2>
6767

6868
</div> <!-- /.main-content -->
6969

70-
<div class="col-xs-6 col-sm-6 col-md-2 sidebar sidebar-offcanvas-right">
71-
72-
</div><!--/.sidebar-offcanvas-right-->
73-
7470
{{>footer}}

0 commit comments

Comments
 (0)