bookbindery 9.5.0 → 9.6.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- checksums.yaml +4 -4
- data/bookbinder.gemspec +3 -1
- data/lib/bookbinder/commands/collection.rb +1 -1
- data/lib/bookbinder/commands/generate.rb +1 -1
- data/lib/bookbinder/css_link_checker.rb +6 -2
- data/lib/bookbinder/preprocessing/dita_html_preprocessor.rb +3 -3
- data/lib/bookbinder/preprocessing/link_to_site_gen_dir.rb +2 -2
- data/lib/bookbinder/subnav/{json_from_html_toc.rb → navigation_entries_from_html_toc.rb} +3 -5
- data/lib/bookbinder/subnav/{json_from_markdown_toc.rb → navigation_entries_from_markdown_root.rb} +4 -4
- data/lib/bookbinder/subnav/pdf_config_creator.rb +3 -5
- data/lib/bookbinder/subnav/subnav_generator.rb +9 -6
- data/lib/bookbinder/subnav/subnav_generator_factory.rb +2 -8
- data/lib/bookbinder/subnav/template_creator.rb +33 -21
- data/master_middleman/archive_drop_down_menu.rb +3 -3
- data/master_middleman/bookbinder_helpers.rb +1 -1
- data/master_middleman/source/javascripts/sidenav.js +45 -0
- data/master_middleman/source/layouts/_additional-scripts.erb +0 -0
- data/master_middleman/source/layouts/_book-footer.erb +0 -0
- data/master_middleman/source/layouts/_book-search.erb +0 -0
- data/master_middleman/source/layouts/_book-title.erb +3 -0
- data/master_middleman/source/layouts/_header.erb +34 -0
- data/master_middleman/source/layouts/_local-header.erb +0 -0
- data/master_middleman/source/layouts/layout.erb +73 -0
- data/master_middleman/source/stylesheets/base.scss +365 -0
- data/master_middleman/source/stylesheets/partials/_book-base-values.scss +0 -0
- data/master_middleman/source/stylesheets/partials/_book-vars.scss +0 -0
- data/master_middleman/source/stylesheets/partials/_default.scss +300 -0
- data/master_middleman/source/stylesheets/partials/_footer.scss +63 -0
- data/master_middleman/source/stylesheets/partials/_header.scss +429 -0
- data/master_middleman/source/stylesheets/partials/_mixins.scss +43 -0
- data/master_middleman/source/stylesheets/partials/_reset.scss +233 -0
- data/master_middleman/source/stylesheets/partials/_search.scss +78 -0
- data/master_middleman/source/stylesheets/partials/_sidenav.scss +143 -0
- data/master_middleman/source/stylesheets/partials/_syntax-highlight.scss +64 -0
- data/master_middleman/source/stylesheets/partials/_vars.scss +62 -0
- data/master_middleman/source/subnavs/_default.erb +0 -0
- data/master_middleman/source/subnavs/_nav-links.erb +10 -0
- data/master_middleman/source/subnavs/_subnav_template.erb +8 -0
- metadata +55 -5
- data/lib/bookbinder/subnav/json_props_creator.rb +0 -35
|
File without changes
|
|
@@ -0,0 +1,73 @@
|
|
|
1
|
+
<!doctype html>
|
|
2
|
+
<html>
|
|
3
|
+
<head>
|
|
4
|
+
<meta charset="utf-8">
|
|
5
|
+
<!-- Always force latest IE rendering engine or request Chrome Frame -->
|
|
6
|
+
<meta content="IE=edge,chrome=1" http-equiv="X-UA-Compatible">
|
|
7
|
+
|
|
8
|
+
<link href='https://fonts.googleapis.com/css?family=Source+Sans+Pro:300,300italic,400italic,400,600' rel='stylesheet' type='text/css'>
|
|
9
|
+
<!-- Use title if it's in the page YAML frontmatter -->
|
|
10
|
+
<title>
|
|
11
|
+
<% if data.page.title %>
|
|
12
|
+
<%= data.page.title %> |
|
|
13
|
+
<% end %>
|
|
14
|
+
<%= vars.book_title_short %>
|
|
15
|
+
</title>
|
|
16
|
+
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
|
17
|
+
<%= stylesheet_link_tag 'base', :media => 'screen, print' %>
|
|
18
|
+
<%= stylesheet_link_tag 'book-styles', :media => 'screen, print' %>
|
|
19
|
+
<link href='/images/favicon.ico' rel='shortcut icon'>
|
|
20
|
+
|
|
21
|
+
<script src="/javascripts/sidenav.js" />
|
|
22
|
+
<%= partial 'layouts/additional-scripts' %>
|
|
23
|
+
</head>
|
|
24
|
+
|
|
25
|
+
<body class="<%= defined?(body_classes) ? body_classes : page_classes %> <%= yield_for_subnav.empty? ? '' : 'has-subnav' %>">
|
|
26
|
+
|
|
27
|
+
<div class="viewport">
|
|
28
|
+
<div class='wrap'>
|
|
29
|
+
<script type="text/javascript">
|
|
30
|
+
document.domain = "<%= vars.domain_name %>";
|
|
31
|
+
</script>
|
|
32
|
+
|
|
33
|
+
<%= partial 'layouts/header' %>
|
|
34
|
+
|
|
35
|
+
|
|
36
|
+
<div class="container">
|
|
37
|
+
|
|
38
|
+
<!--googleoff: index-->
|
|
39
|
+
<%= yield_for_subnav %>
|
|
40
|
+
<!--googleon: index-->
|
|
41
|
+
|
|
42
|
+
<main class="content content-layout" id="js-content" role="main">
|
|
43
|
+
<a id="top"></a>
|
|
44
|
+
<%= partial 'layouts/local-header' %>
|
|
45
|
+
<% if current_page.data.title %>
|
|
46
|
+
<h1 class="title-container">
|
|
47
|
+
<%= current_page.data.title %>
|
|
48
|
+
</h1>
|
|
49
|
+
<% end %>
|
|
50
|
+
<% if quick_links %>
|
|
51
|
+
<div id="js-quick-links">
|
|
52
|
+
<%= quick_links %>
|
|
53
|
+
</div>
|
|
54
|
+
<% end %>
|
|
55
|
+
<div class="to-top" id="js-to-top">
|
|
56
|
+
<a href="#top" title="back to top"></a>
|
|
57
|
+
</div>
|
|
58
|
+
<%= yield %>
|
|
59
|
+
</main>
|
|
60
|
+
</div>
|
|
61
|
+
</div>
|
|
62
|
+
</div>
|
|
63
|
+
|
|
64
|
+
<div id="scrim"></div>
|
|
65
|
+
|
|
66
|
+
<div class="container">
|
|
67
|
+
<footer class="site-footer-links">
|
|
68
|
+
<%= partial 'layouts/book-footer' %>
|
|
69
|
+
</footer>
|
|
70
|
+
</div><!--end of container-->
|
|
71
|
+
|
|
72
|
+
</body>
|
|
73
|
+
</html>
|
|
@@ -0,0 +1,365 @@
|
|
|
1
|
+
@import "font-awesome/variables";
|
|
2
|
+
@import "font-awesome/core";
|
|
3
|
+
@import "font-awesome/path";
|
|
4
|
+
|
|
5
|
+
@import "partials/vars";
|
|
6
|
+
@import "partials/mixins";
|
|
7
|
+
|
|
8
|
+
@import "partials/reset";
|
|
9
|
+
@import "partials/default";
|
|
10
|
+
|
|
11
|
+
@import "partials/syntax-highlight";
|
|
12
|
+
@import "partials/header";
|
|
13
|
+
@import "partials/footer";
|
|
14
|
+
@import "partials/search";
|
|
15
|
+
|
|
16
|
+
|
|
17
|
+
// ~LAYOUT
|
|
18
|
+
// ===================================================
|
|
19
|
+
.container {
|
|
20
|
+
background: #fff;
|
|
21
|
+
clear: both;
|
|
22
|
+
margin: 0 auto;
|
|
23
|
+
max-width: 1024px;
|
|
24
|
+
}
|
|
25
|
+
.content-layout {
|
|
26
|
+
padding: 2em 1.5em 2em 1.5em;
|
|
27
|
+
@media (min-width: $bp-wide) {
|
|
28
|
+
padding-top: 4.2em;
|
|
29
|
+
}
|
|
30
|
+
}
|
|
31
|
+
.has-subnav .container {
|
|
32
|
+
max-width: auto;
|
|
33
|
+
@media (min-width: $bp-wide) {
|
|
34
|
+
margin-left: $sidenav-wide;
|
|
35
|
+
}
|
|
36
|
+
@media (min-width: $bp-widest) {
|
|
37
|
+
margin-left: $sidenav-widest;
|
|
38
|
+
}
|
|
39
|
+
}
|
|
40
|
+
.has-subnav .content-layout {
|
|
41
|
+
@media (min-width: $bp-wide) {
|
|
42
|
+
max-width: 45em;
|
|
43
|
+
padding: 6.2em 2em 2em;
|
|
44
|
+
}
|
|
45
|
+
}
|
|
46
|
+
.nav-container {
|
|
47
|
+
@media (min-width: $bp-wide) {
|
|
48
|
+
position: fixed;
|
|
49
|
+
z-index: 10;
|
|
50
|
+
top: 38px;
|
|
51
|
+
left: 0;
|
|
52
|
+
bottom: 0;
|
|
53
|
+
overflow-y: auto;
|
|
54
|
+
overflow-x: hidden;
|
|
55
|
+
-webkit-overflow-scrolling: touch;
|
|
56
|
+
width: $sidenav-wide;
|
|
57
|
+
}
|
|
58
|
+
@media (min-width: $bp-widest) {
|
|
59
|
+
width: $sidenav-widest;
|
|
60
|
+
}
|
|
61
|
+
}
|
|
62
|
+
|
|
63
|
+
|
|
64
|
+
// ~SIDE NAV RELATED STYLES
|
|
65
|
+
// ===================================================
|
|
66
|
+
.has-sidenav table {
|
|
67
|
+
border-color: $color-border;
|
|
68
|
+
border: 1px solid $color-border;
|
|
69
|
+
}
|
|
70
|
+
.has-sidenav th {
|
|
71
|
+
background-color: transparentize($color-accent, 0.95);
|
|
72
|
+
}
|
|
73
|
+
.has-sidenav table tr:nth-child(2n+1) {
|
|
74
|
+
background: none;
|
|
75
|
+
}
|
|
76
|
+
.has-sidenav .content tr:nth-child(2n+1) {
|
|
77
|
+
background-color: $color-border-row;
|
|
78
|
+
}
|
|
79
|
+
|
|
80
|
+
// ~GRID HELPER
|
|
81
|
+
// ===================================================
|
|
82
|
+
.span3 {
|
|
83
|
+
display: block;
|
|
84
|
+
@media (min-width: $bp-wide) {
|
|
85
|
+
// 2 col
|
|
86
|
+
float: left;
|
|
87
|
+
margin-right: 2%;
|
|
88
|
+
width: 48%;
|
|
89
|
+
}
|
|
90
|
+
@media (min-width: $bp-widest) {
|
|
91
|
+
// 3 col
|
|
92
|
+
width: 32%;
|
|
93
|
+
}
|
|
94
|
+
}
|
|
95
|
+
// first of 2
|
|
96
|
+
.span3:nth-child(2n+1) {
|
|
97
|
+
@media (min-width: $bp-wide) and (max-width: $bp-widest) {
|
|
98
|
+
clear: left;
|
|
99
|
+
}
|
|
100
|
+
}
|
|
101
|
+
// last of 2
|
|
102
|
+
.span3:nth-child(2n) {
|
|
103
|
+
@media (min-width: $bp-wide) and (max-width: $bp-widest) {
|
|
104
|
+
margin-right: 0;
|
|
105
|
+
}
|
|
106
|
+
}
|
|
107
|
+
|
|
108
|
+
// first of 3
|
|
109
|
+
.span3:nth-child(3n+1) {
|
|
110
|
+
@media (min-width: $bp-widest) {
|
|
111
|
+
clear: left;
|
|
112
|
+
}
|
|
113
|
+
}
|
|
114
|
+
// last of 3
|
|
115
|
+
.span3:nth-child(3n) {
|
|
116
|
+
@media (min-width: $bp-widest) {
|
|
117
|
+
margin-right: 0;
|
|
118
|
+
}
|
|
119
|
+
}
|
|
120
|
+
|
|
121
|
+
/*doc
|
|
122
|
+
---
|
|
123
|
+
title: Title Container
|
|
124
|
+
name: title_container
|
|
125
|
+
category: basics
|
|
126
|
+
---
|
|
127
|
+
```html_example
|
|
128
|
+
<h1 class="title-container">
|
|
129
|
+
Lorem Ipsum Dolor
|
|
130
|
+
</h1>
|
|
131
|
+
```
|
|
132
|
+
*/
|
|
133
|
+
|
|
134
|
+
// Title of content
|
|
135
|
+
.title-container {
|
|
136
|
+
line-height: 1.1;
|
|
137
|
+
font-weight: 600;
|
|
138
|
+
font-size: $font-size-xl;
|
|
139
|
+
margin-top: 0;
|
|
140
|
+
@media (min-width: $bp-wide) {
|
|
141
|
+
font-size: $font-size-xxl
|
|
142
|
+
}
|
|
143
|
+
}
|
|
144
|
+
|
|
145
|
+
// ~QUICK LINKS
|
|
146
|
+
// ===================================================
|
|
147
|
+
/*doc
|
|
148
|
+
---
|
|
149
|
+
title: Nav - Quick Links
|
|
150
|
+
name: nav-quick_links
|
|
151
|
+
category: basics
|
|
152
|
+
---
|
|
153
|
+
```html_example
|
|
154
|
+
<div class="quick-links">
|
|
155
|
+
<ul>
|
|
156
|
+
<li><a href="#">quick link</a></li>
|
|
157
|
+
<li><a href="#">quick link</a></li>
|
|
158
|
+
<li><a href="#">quick link</a></li>
|
|
159
|
+
</ul>
|
|
160
|
+
</div>
|
|
161
|
+
```
|
|
162
|
+
*/
|
|
163
|
+
.quick-links {
|
|
164
|
+
background-color: $color-bg-light;
|
|
165
|
+
border-radius: 3px;
|
|
166
|
+
border: 1px solid $color-border-superlight;
|
|
167
|
+
display: inline-block;
|
|
168
|
+
padding: 1em 1.5em;
|
|
169
|
+
|
|
170
|
+
ol, ul, li {
|
|
171
|
+
margin: 0;
|
|
172
|
+
}
|
|
173
|
+
|
|
174
|
+
> ul {
|
|
175
|
+
list-style-position: inside;
|
|
176
|
+
list-style-type: lower-roman;
|
|
177
|
+
margin-left: -1em;
|
|
178
|
+
|
|
179
|
+
&:before {
|
|
180
|
+
content: "In this topic:";
|
|
181
|
+
display: block;
|
|
182
|
+
padding-bottom: 0.25em;
|
|
183
|
+
}
|
|
184
|
+
}
|
|
185
|
+
|
|
186
|
+
ul ul {
|
|
187
|
+
padding-left: 1.8em;
|
|
188
|
+
}
|
|
189
|
+
}
|
|
190
|
+
|
|
191
|
+
// ~CONTENT
|
|
192
|
+
// ===================================================
|
|
193
|
+
// Designate external links with an icon
|
|
194
|
+
|
|
195
|
+
/*doc
|
|
196
|
+
---
|
|
197
|
+
title: Link External
|
|
198
|
+
name: link_external
|
|
199
|
+
category: basics
|
|
200
|
+
---
|
|
201
|
+
```html_example
|
|
202
|
+
<a class="external-link" href="#">Link</a>
|
|
203
|
+
```
|
|
204
|
+
*/
|
|
205
|
+
.content a[href^="http"]:after,
|
|
206
|
+
.external-link:after {
|
|
207
|
+
@extend .fa;
|
|
208
|
+
content: $fa-var-external-link;
|
|
209
|
+
font-size: 0.75em;
|
|
210
|
+
padding-left: 0.5em;
|
|
211
|
+
}
|
|
212
|
+
|
|
213
|
+
.content a:hover,
|
|
214
|
+
.content a:focus,
|
|
215
|
+
.content a:active,
|
|
216
|
+
.link:hover,
|
|
217
|
+
.link:focus,
|
|
218
|
+
.link:active {
|
|
219
|
+
background-color: transparentize($color-accent-bright, 0.92);
|
|
220
|
+
border-bottom-style: solid;
|
|
221
|
+
}
|
|
222
|
+
|
|
223
|
+
// Enlarge first paragraph of content.
|
|
224
|
+
|
|
225
|
+
/*doc
|
|
226
|
+
---
|
|
227
|
+
title: Content Helper - Intro
|
|
228
|
+
name: content_helper-intro
|
|
229
|
+
category: basics
|
|
230
|
+
---
|
|
231
|
+
```html_example
|
|
232
|
+
<p class="intro">Lorem ipsum dolor sit amet, consectetur adipisicing elit. Necessitatibus totam libero facilis voluptatem aliquam incidunt ipsa officiis, dicta nihil expedita, molestiae delectus impedit hic quidem deserunt laudantium, sint debitis tenetur.</p>
|
|
233
|
+
```
|
|
234
|
+
*/
|
|
235
|
+
|
|
236
|
+
.intro {
|
|
237
|
+
font-size: $font-size-m;
|
|
238
|
+
font-weight: 300;
|
|
239
|
+
}
|
|
240
|
+
|
|
241
|
+
/*doc
|
|
242
|
+
---
|
|
243
|
+
title: Content Helper - Note
|
|
244
|
+
name: content_helper-note
|
|
245
|
+
category: basics
|
|
246
|
+
---
|
|
247
|
+
```html_example
|
|
248
|
+
<p class="note">Lorem ipsum dolor sit amet, consectetur adipisicing elit. Necessitatibus totam libero facilis voluptatem aliquam incidunt ipsa officiis, dicta nihil expedita, molestiae delectus impedit hic quidem deserunt laudantium, sint debitis tenetur.</p>
|
|
249
|
+
```
|
|
250
|
+
*/
|
|
251
|
+
|
|
252
|
+
// Notes and tips
|
|
253
|
+
.note {
|
|
254
|
+
background: #ffffed;
|
|
255
|
+
border-color: #ebebd3;
|
|
256
|
+
border-radius: 3px;
|
|
257
|
+
border-style: solid;
|
|
258
|
+
border-width: 1px;
|
|
259
|
+
margin: 1em 0;
|
|
260
|
+
padding: 0.7em 1em 0.7em 2.3em;
|
|
261
|
+
position: relative;
|
|
262
|
+
&:before {
|
|
263
|
+
content: $fa-var-lightbulb-o;
|
|
264
|
+
@extend .fa;
|
|
265
|
+
color: #b9b781;
|
|
266
|
+
font-size: 1.5em;
|
|
267
|
+
left: 0.6em;
|
|
268
|
+
position: absolute;
|
|
269
|
+
top: 0.45em;
|
|
270
|
+
}
|
|
271
|
+
}
|
|
272
|
+
|
|
273
|
+
/*doc
|
|
274
|
+
---
|
|
275
|
+
title: Content Helper - New User Tip
|
|
276
|
+
name: content_helper-tip
|
|
277
|
+
category: basics
|
|
278
|
+
---
|
|
279
|
+
```html_example
|
|
280
|
+
<p class="tip">Lorem ipsum dolor sit amet, consectetur adipisicing elit. Necessitatibus totam libero facilis voluptatem aliquam incidunt ipsa officiis, dicta nihil expedita, molestiae delectus impedit hic quidem deserunt laudantium, sint debitis tenetur.</p>
|
|
281
|
+
```
|
|
282
|
+
*/
|
|
283
|
+
|
|
284
|
+
// Tips for first-time users
|
|
285
|
+
.tip {
|
|
286
|
+
background: #ffffff;
|
|
287
|
+
border-color: $color-border-tip;
|
|
288
|
+
border-radius: 3px;
|
|
289
|
+
border-style: solid;
|
|
290
|
+
border-width: 1px;
|
|
291
|
+
margin: 1em 0;
|
|
292
|
+
padding: 1.7em 2em;
|
|
293
|
+
position: relative;
|
|
294
|
+
text-align: left;
|
|
295
|
+
&:before {
|
|
296
|
+
@extend .fa;
|
|
297
|
+
color: #7C7C7C;
|
|
298
|
+
font-size: $font-size-xl;
|
|
299
|
+
left: 0.5em;
|
|
300
|
+
position: absolute;
|
|
301
|
+
top: 0.8em;
|
|
302
|
+
}
|
|
303
|
+
}
|
|
304
|
+
|
|
305
|
+
// ~CODE EXAMPLE STYLES
|
|
306
|
+
// ===================================================
|
|
307
|
+
|
|
308
|
+
/*doc
|
|
309
|
+
---
|
|
310
|
+
title: Code Example - Terminal
|
|
311
|
+
name: code_example-terminal
|
|
312
|
+
category: basics
|
|
313
|
+
---
|
|
314
|
+
```html_example
|
|
315
|
+
<pre class="terminal">$ keytool -import -alias ops-metrics-ssl -file ops-metrics.cer -keystore localhost.truststore</pre>
|
|
316
|
+
```
|
|
317
|
+
*/
|
|
318
|
+
|
|
319
|
+
.terminal {
|
|
320
|
+
background-color: #3a3a3a;
|
|
321
|
+
border: 0;
|
|
322
|
+
color: #fefefe;
|
|
323
|
+
}
|
|
324
|
+
|
|
325
|
+
|
|
326
|
+
// ~BACK TO TOP
|
|
327
|
+
// ===================================================
|
|
328
|
+
.to-top {
|
|
329
|
+
visibility: hidden;
|
|
330
|
+
opacity: 0;
|
|
331
|
+
@include transition(all 0.2s linear);
|
|
332
|
+
a {
|
|
333
|
+
border: 0;
|
|
334
|
+
bottom: 4em;
|
|
335
|
+
position: fixed;
|
|
336
|
+
right: 4em;
|
|
337
|
+
&:hover {
|
|
338
|
+
background: none;
|
|
339
|
+
}
|
|
340
|
+
&:before {
|
|
341
|
+
content: $fa-var-arrow-up;
|
|
342
|
+
@extend .fa;
|
|
343
|
+
background: $color-accent-bright;
|
|
344
|
+
box-shadow: 0 0 9px rgba(153, 153, 153, 0.8);
|
|
345
|
+
color: #fff;
|
|
346
|
+
line-height: 2.5em;
|
|
347
|
+
height: 2.5em;
|
|
348
|
+
text-align: center;
|
|
349
|
+
width: 2.5em;
|
|
350
|
+
}
|
|
351
|
+
}
|
|
352
|
+
&.sticky {
|
|
353
|
+
// display: inline-block;
|
|
354
|
+
visibility: visible;
|
|
355
|
+
opacity: 1;
|
|
356
|
+
}
|
|
357
|
+
@media (max-width: $bp-wide) {
|
|
358
|
+
// Hide back to top on narrow width screens
|
|
359
|
+
display: none;
|
|
360
|
+
}
|
|
361
|
+
}
|
|
362
|
+
// Hide back to top on homepage
|
|
363
|
+
.index .to-top {
|
|
364
|
+
display: none;
|
|
365
|
+
}
|
|
File without changes
|
|
File without changes
|
|
@@ -0,0 +1,300 @@
|
|
|
1
|
+
/*
|
|
2
|
+
* FILE: _default.scss
|
|
3
|
+
======================================================================== */
|
|
4
|
+
* {
|
|
5
|
+
-webkit-font-smoothing: antialiased;
|
|
6
|
+
}
|
|
7
|
+
html {
|
|
8
|
+
font-size: 1em;
|
|
9
|
+
}
|
|
10
|
+
body {
|
|
11
|
+
background-color: #fff;
|
|
12
|
+
// background-color: $color-bg;
|
|
13
|
+
font-family: $font-primary;
|
|
14
|
+
font-weight: 400;
|
|
15
|
+
line-height: 1.45;
|
|
16
|
+
color: #333;
|
|
17
|
+
margin: 0;
|
|
18
|
+
padding: 0;
|
|
19
|
+
}
|
|
20
|
+
|
|
21
|
+
// Paragraphs
|
|
22
|
+
p {
|
|
23
|
+
margin-bottom: 1.3em;
|
|
24
|
+
}
|
|
25
|
+
li p {
|
|
26
|
+
margin: 0; // Hack to fix broken markdown.
|
|
27
|
+
}
|
|
28
|
+
|
|
29
|
+
/*doc
|
|
30
|
+
---
|
|
31
|
+
title: Link Default
|
|
32
|
+
name: link_default
|
|
33
|
+
category: basics
|
|
34
|
+
---
|
|
35
|
+
```html_example
|
|
36
|
+
<a class="link" href="#">Link</a>
|
|
37
|
+
```
|
|
38
|
+
*/
|
|
39
|
+
|
|
40
|
+
a, .link {
|
|
41
|
+
border-bottom: 1px dotted lighten(desaturate($color-link, 40%), 40%);
|
|
42
|
+
color: $color-link;
|
|
43
|
+
text-decoration: none;
|
|
44
|
+
@include transition(all 0.1s linear);
|
|
45
|
+
}
|
|
46
|
+
|
|
47
|
+
img {
|
|
48
|
+
height: auto;
|
|
49
|
+
max-width: 100%;
|
|
50
|
+
}
|
|
51
|
+
|
|
52
|
+
// Type Scale: Major Third 1.250
|
|
53
|
+
h1, h2, h3, h4, h5, h6 {
|
|
54
|
+
margin: 60px 0 0.5em;
|
|
55
|
+
font-weight: inherit;
|
|
56
|
+
line-height: 1.2;
|
|
57
|
+
}
|
|
58
|
+
|
|
59
|
+
.steps-header {
|
|
60
|
+
margin-top: -0.2em;
|
|
61
|
+
}
|
|
62
|
+
|
|
63
|
+
/*doc
|
|
64
|
+
---
|
|
65
|
+
title: Headings
|
|
66
|
+
name: headings
|
|
67
|
+
category: basics
|
|
68
|
+
---
|
|
69
|
+
```html_example
|
|
70
|
+
<h1>h1. heading level 1</h1>
|
|
71
|
+
<h2>h2. heading level 2</h2>
|
|
72
|
+
<h3>h3. heading level 3</h3>
|
|
73
|
+
<h4>h4. heading level 4</h4>
|
|
74
|
+
<div class="h2">this is a div with an h2 class</div>
|
|
75
|
+
<h5 class="h3">this is an h5 with an h3 class</h5>
|
|
76
|
+
<h2><a id='fake-anchor'></a>h2. heading with link</h2>
|
|
77
|
+
<h3><a id='other-fake-anchor'></a>h3. heading with link</h3>
|
|
78
|
+
```
|
|
79
|
+
*/
|
|
80
|
+
|
|
81
|
+
h1, .h1 {
|
|
82
|
+
margin-top: 0;
|
|
83
|
+
font-size: $font-size-xxl;
|
|
84
|
+
}
|
|
85
|
+
h2, .h2 {
|
|
86
|
+
font-size: $font-size-xl;
|
|
87
|
+
}
|
|
88
|
+
h3, .h3 {
|
|
89
|
+
font-size: $font-size-l;
|
|
90
|
+
}
|
|
91
|
+
h4, h5, .h4 {
|
|
92
|
+
font-size: $font-size-m;
|
|
93
|
+
}
|
|
94
|
+
small,
|
|
95
|
+
.font_small {
|
|
96
|
+
font-size: 0.8em;
|
|
97
|
+
}
|
|
98
|
+
h2 > a:before, h3 > a:before {
|
|
99
|
+
@media (min-width: $bp-wide) {
|
|
100
|
+
content: "";
|
|
101
|
+
display: block;
|
|
102
|
+
height: 80px;
|
|
103
|
+
margin: -80px 0 0;
|
|
104
|
+
}
|
|
105
|
+
}
|
|
106
|
+
|
|
107
|
+
// Lists
|
|
108
|
+
ul,
|
|
109
|
+
ol {
|
|
110
|
+
margin: 0 0 1em;
|
|
111
|
+
}
|
|
112
|
+
ul {
|
|
113
|
+
padding: 0 0 0 1.2em;
|
|
114
|
+
}
|
|
115
|
+
ol {
|
|
116
|
+
padding: 0 0 0 1.4em;
|
|
117
|
+
}
|
|
118
|
+
ul ul,
|
|
119
|
+
ol ol {
|
|
120
|
+
margin-top: 1em;
|
|
121
|
+
padding-bottom: 0
|
|
122
|
+
}
|
|
123
|
+
|
|
124
|
+
// Vertical spacing for ordered lists
|
|
125
|
+
ol li {
|
|
126
|
+
margin: 0 0 1.3em;
|
|
127
|
+
padding: 0;
|
|
128
|
+
}
|
|
129
|
+
|
|
130
|
+
// Tight spacing for unordered lists
|
|
131
|
+
ul li {
|
|
132
|
+
margin: 0 0 0.5em;
|
|
133
|
+
padding: 0;
|
|
134
|
+
}
|
|
135
|
+
|
|
136
|
+
// Tight spacing for nested lists
|
|
137
|
+
li li {
|
|
138
|
+
margin-bottom: 0;
|
|
139
|
+
}
|
|
140
|
+
|
|
141
|
+
// Image spacing inside lists
|
|
142
|
+
ol img,
|
|
143
|
+
ul img {
|
|
144
|
+
margin: 0.5em 0;
|
|
145
|
+
}
|
|
146
|
+
|
|
147
|
+
// Input forms
|
|
148
|
+
input {
|
|
149
|
+
background-color: #f1f1f1;
|
|
150
|
+
border: 1px solid $color-border;
|
|
151
|
+
border-radius: $radius;
|
|
152
|
+
box-shadow: $color-border 1px 1px 4px -2px inset;
|
|
153
|
+
color: $color-text;
|
|
154
|
+
display: block;
|
|
155
|
+
padding: 0.5em 1em;
|
|
156
|
+
@include transition(all 0.1s linear);
|
|
157
|
+
width: 100%;
|
|
158
|
+
|
|
159
|
+
&:hover {
|
|
160
|
+
border-color: transparentize(darken($color-accent, 10%), 0.5);
|
|
161
|
+
background-color: #fff;
|
|
162
|
+
}
|
|
163
|
+
&:focus {
|
|
164
|
+
background-color: #fff;
|
|
165
|
+
border-color: $color-accent;
|
|
166
|
+
box-shadow: $color-border 0 0 4px;
|
|
167
|
+
outline: 0;
|
|
168
|
+
}
|
|
169
|
+
}
|
|
170
|
+
|
|
171
|
+
// Tables
|
|
172
|
+
table {
|
|
173
|
+
border-color: #b5b5b5;
|
|
174
|
+
border-collapse: collapse;
|
|
175
|
+
border-style: solid;
|
|
176
|
+
border-width: 1px;
|
|
177
|
+
color: #333333;
|
|
178
|
+
font-size: 1em;
|
|
179
|
+
margin-top: 1em;
|
|
180
|
+
padding: 0.8em 0.7rem;
|
|
181
|
+
width: 100%;
|
|
182
|
+
}
|
|
183
|
+
th {
|
|
184
|
+
background-color: #f8f8f8;
|
|
185
|
+
border-color: #b5b5b5;
|
|
186
|
+
color: #4b6475;
|
|
187
|
+
line-height: 1.1;
|
|
188
|
+
font-size: $font-size-s;
|
|
189
|
+
text-align: left;
|
|
190
|
+
}
|
|
191
|
+
tr {
|
|
192
|
+
color: #686868;
|
|
193
|
+
}
|
|
194
|
+
|
|
195
|
+
.content td, .content th, .content tr {
|
|
196
|
+
border: solid 1px grey;
|
|
197
|
+
}
|
|
198
|
+
|
|
199
|
+
.content tr:hover {
|
|
200
|
+
background-color: #fdfdfd;
|
|
201
|
+
color: #333;
|
|
202
|
+
}
|
|
203
|
+
|
|
204
|
+
caption {
|
|
205
|
+
font-size: $font-size-m;
|
|
206
|
+
padding: 0.5em;
|
|
207
|
+
}
|
|
208
|
+
|
|
209
|
+
// Code
|
|
210
|
+
|
|
211
|
+
/*doc
|
|
212
|
+
---
|
|
213
|
+
title: Code Example - Default
|
|
214
|
+
name: code_example-default
|
|
215
|
+
category: basics
|
|
216
|
+
---
|
|
217
|
+
```html_example
|
|
218
|
+
<pre><code class="highlight ruby"><span class="nb">require</span> <span class="s1">'ova_manager'</span>
|
|
219
|
+
<span class="nb">require</span> <span class="s1">'vsphere_clients'</span>
|
|
220
|
+
|
|
221
|
+
<span class="no">OvaManager</span><span class="o">::</span><span class="no">Deployer</span><span class="p">.</span><span class="nf">new</span><span class="p">({</span>
|
|
222
|
+
<span class="ss">host: </span><span class="s2">"172.16.74.3"</span><span class="p">,</span>
|
|
223
|
+
<span class="ss">user: </span><span class="s2">"root"</span><span class="p">,</span>
|
|
224
|
+
<span class="ss">password: </span><span class="s2">"vmware"</span>
|
|
225
|
+
<span class="p">})</span>
|
|
226
|
+
</code></pre>
|
|
227
|
+
```
|
|
228
|
+
*/
|
|
229
|
+
|
|
230
|
+
pre {
|
|
231
|
+
background-color: #f0f0f0;
|
|
232
|
+
border-radius: 3px;
|
|
233
|
+
font-size: rem(13);
|
|
234
|
+
padding: 1em;
|
|
235
|
+
white-space: pre;
|
|
236
|
+
// max-width: 20em;
|
|
237
|
+
overflow: auto;
|
|
238
|
+
}
|
|
239
|
+
pre code {
|
|
240
|
+
background-color: transparent;
|
|
241
|
+
border: 0;
|
|
242
|
+
color: $color-text;
|
|
243
|
+
direction: ltr;
|
|
244
|
+
font-family: Consolas, "Liberation Mono", Menlo, Courier, monospace;
|
|
245
|
+
overflow: auto;
|
|
246
|
+
text-align: left;
|
|
247
|
+
margin: 0;
|
|
248
|
+
padding: 0;
|
|
249
|
+
word-spacing: normal;
|
|
250
|
+
word-break: normal;
|
|
251
|
+
}
|
|
252
|
+
|
|
253
|
+
/*doc
|
|
254
|
+
---
|
|
255
|
+
title: Code Example - Inline
|
|
256
|
+
name: code_example-inline
|
|
257
|
+
|
|
258
|
+
category: basics
|
|
259
|
+
---
|
|
260
|
+
```html_example
|
|
261
|
+
<code>"mbus"=>"nats://nats:nats@192.168.86.17:4222"</code>
|
|
262
|
+
```
|
|
263
|
+
*/
|
|
264
|
+
|
|
265
|
+
code {
|
|
266
|
+
background-color: #f5f5ff;
|
|
267
|
+
border: 1px solid #e4e4e4;
|
|
268
|
+
display: inline-block;
|
|
269
|
+
font-size: rem(13);
|
|
270
|
+
line-height: 1.4;
|
|
271
|
+
margin: 0.2em 0.1em 0.1em;
|
|
272
|
+
padding: 0 0.4em 0 0.4em;
|
|
273
|
+
vertical-align: text-top;
|
|
274
|
+
}
|
|
275
|
+
code a {
|
|
276
|
+
color: #fefefe;
|
|
277
|
+
}
|
|
278
|
+
|
|
279
|
+
hr {
|
|
280
|
+
background-color: $color-border-light;
|
|
281
|
+
border: 0;
|
|
282
|
+
height: 1px;
|
|
283
|
+
float: left;
|
|
284
|
+
width: 100%;
|
|
285
|
+
}
|
|
286
|
+
.content pre {
|
|
287
|
+
&::-webkit-scrollbar {
|
|
288
|
+
-webkit-appearance: none;
|
|
289
|
+
width: 7px;
|
|
290
|
+
height: 7px;
|
|
291
|
+
}
|
|
292
|
+
&::-webkit-scrollbar-thumb {
|
|
293
|
+
border-radius: 4px;
|
|
294
|
+
background-color: rgba(0,0,0,.5);
|
|
295
|
+
-webkit-box-shadow: 0 0 1px rgba(255,255,255,.5);
|
|
296
|
+
}
|
|
297
|
+
}
|
|
298
|
+
.hidden {
|
|
299
|
+
display: none !important;
|
|
300
|
+
}
|