eyemask 0.1.0

Sign up to get free protection for your applications and to get access to all the features.
@@ -0,0 +1,465 @@
1
+ <!DOCTYPE html>
2
+ <html>
3
+ <head>
4
+ <title>{{title}}: {{subtitle}}</title>
5
+ <link href='http://fonts.googleapis.com/css?family=Source+Code+Pro:200,300,400,500,600,700,900' rel='stylesheet' type='text/css'>
6
+ <link href='http://fonts.googleapis.com/css?family=Indie+Flower' rel='stylesheet' type='text/css'>
7
+ <style>
8
+
9
+ html {
10
+ font-size: 11pt;
11
+ }
12
+
13
+ body {
14
+ font-family: 'Helvetica Neue', sans-serif;
15
+ font-size: 2.4rem;
16
+ line-height: 1.6875;
17
+ }
18
+
19
+ h1,h2,h3,h4 {
20
+ font-family: 'Helvetica Neue', sans-serif;
21
+ margin: 0 0 16.875pt 0;
22
+ }
23
+
24
+ h1 {
25
+ font-size: 37.125pt;
26
+ }
27
+
28
+ h2 {
29
+ font-size: 24.75pt;
30
+ }
31
+
32
+ h3 {
33
+ font-size: 16.5pt;
34
+ }
35
+
36
+ h4 {
37
+ font-size: 11pt;
38
+ }
39
+
40
+ /***** SLIDES *****/
41
+
42
+ .slide {
43
+ page-break-before: always;
44
+ }
45
+
46
+ /***** PARTS *****/
47
+
48
+ #mainmatter {
49
+ counter-reset: feature;
50
+ }
51
+
52
+ /***** TITLE *****/
53
+
54
+ h1.title {
55
+ font-size: 24.75pt;
56
+ font-weight: lighter;
57
+ text-transform: uppercase;
58
+ color: #c33;
59
+ letter-spacing: 0.2em;
60
+ margin-top: 44mm;
61
+ margin-bottom: 0;
62
+ }
63
+ h2.subtitle {
64
+ font-size: 37.125pt;
65
+ }
66
+
67
+ .authors {
68
+ list-style: none;
69
+ font-weight: bold;
70
+ font-size: 16.5pt;
71
+ margin: 0;
72
+ }
73
+
74
+ .logo {
75
+ position: static;
76
+ bottom: 0;
77
+ right: 0;
78
+ }
79
+
80
+ /***** TABLE OF CONTENTS *****/
81
+
82
+ .toc ol {
83
+ list-style: none;
84
+ }
85
+
86
+ .toc a {
87
+ text-decoration: none;
88
+ }
89
+
90
+ .toc a[href]::after {
91
+ content: leader(".") target-counter(attr(href), page)
92
+ }
93
+
94
+ .toc ol a[href]::before {
95
+ content: target-counter(attr(href), feature) ". ";
96
+ }
97
+
98
+ .toc ol ol a[href]::before {
99
+ content: target-counter(attr(href), feature) "." target-counter(attr(href), scenario) ". ";
100
+ }
101
+
102
+ /***** SLIDE SECTION TITLE *****/
103
+
104
+ .slide-section-title h2 {
105
+ font-size: 37.125pt;
106
+ margin: 33mm auto;
107
+ text-align: center;
108
+ string-set: header "Feature " counter(feature) ". " content();
109
+ }
110
+
111
+ /***** FEATURE *****/
112
+
113
+ .slide-section-title.feature {
114
+ counter-increment: feature;
115
+ counter-reset: scenario;
116
+ }
117
+
118
+ .feature h2::before {
119
+ content: "Feature " counter(feature) ". ";
120
+ font-weight: lighter;
121
+ }
122
+ .slide-section-title.feature h2::before {
123
+ display: block;
124
+ font-weight: lighter;
125
+ text-transform: uppercase;
126
+ font-size: 24.75pt;
127
+ }
128
+
129
+ /***** SCENARIO *****/
130
+
131
+ .scenario {
132
+ counter-increment: scenario;
133
+ }
134
+
135
+ .scenario h3::before {
136
+ content: counter(feature) "." counter(scenario) ". ";
137
+ }
138
+
139
+ /***** STEPS *****/
140
+
141
+ .steps ol {
142
+ margin-left: 0;
143
+ list-style: lower-roman;
144
+ }
145
+
146
+ .steps ol li p {
147
+ margin-top: 0 !important;
148
+ }
149
+
150
+ .steps ol li p:only-child {
151
+ margin: 0;
152
+ }
153
+
154
+ .highlight {
155
+ page-break-before: avoid;
156
+ }
157
+ .docstring {
158
+ page-break-before: avoid;
159
+ }
160
+
161
+ .steptable {
162
+ page-break-before: avoid;
163
+ }
164
+
165
+ /***** NOTES *****/
166
+
167
+ .note {
168
+ border: 1pt solid #aaa;
169
+ border-left: 7pt solid #aaa;
170
+ background-color: #eee;
171
+ padding: 0 1.6875em;
172
+ margin-left: auto;
173
+ margin-right: auto;
174
+ }
175
+
176
+ .note.note-story {
177
+ font-family: "Indie Flower", cursive;
178
+ background-color: #ffa;
179
+ border-color: #aa6;
180
+ max-width: 40em;
181
+ }
182
+ .note.note-story::after{
183
+ text-align: right;
184
+ display: block;
185
+ width: 100%;
186
+ font-size: 16.5pt;
187
+ content: attr(data-note);
188
+ }
189
+
190
+ .note.note-questions {
191
+ padding-bottom: 1em;
192
+ float: bottom;
193
+ border-color: #a66;
194
+ }
195
+ .note.note-questions::before {
196
+ content: "Questions: ";
197
+ font-weight: bold;
198
+ }
199
+
200
+ /***** TABLES *****/
201
+
202
+ /* A clean textbook-like style with horizontal lines above and below and under
203
+ the header. Rows highlight on hover to help scanning the table on screen.
204
+ */
205
+
206
+ table
207
+ {
208
+ border-collapse: collapse;
209
+ border-spacing: 0; /* IE 6 */
210
+
211
+ border-bottom: 2pt solid #000;
212
+ border-top: 2pt solid #000; /* The caption on top will not have a bottom-border */
213
+
214
+ /* Center */
215
+ margin-left: auto;
216
+ margin-right: auto;
217
+ margin-bottom: 16.875pt;
218
+ }
219
+
220
+ thead /* Entire table header */
221
+ {
222
+ border-bottom: 1pt solid #000;
223
+ background-color: #eee; /* Does this BG print well? */
224
+ }
225
+
226
+ tr.header /* Each header row */
227
+ {
228
+ }
229
+
230
+ tbody /* Entire table body */
231
+ {
232
+ }
233
+
234
+ /* Table body rows */
235
+
236
+ tr {
237
+ border-bottom: 0.5pt solid #000;
238
+ }
239
+ .steptable tbody tr:nth-child(2n)
240
+ {
241
+ /*background-color: #eee;*/
242
+ }
243
+
244
+
245
+ td, th /* Table cells and table header cells */
246
+ {
247
+ vertical-align: top; /* Word */
248
+ vertical-align: baseline; /* Others */
249
+ padding-left: 0.5em;
250
+ padding-right: 0.5em;
251
+ padding-top: 0.2em;
252
+ padding-bottom: 0.2em;
253
+ }
254
+
255
+ /***** CODE/PRE *****/
256
+
257
+ pre,code,.highlight {
258
+ font-family: "Source Code Pro";
259
+ background-color: #eee;
260
+ }
261
+
262
+ pre, code
263
+ {
264
+ /* BEGIN word wrap */
265
+ /* Need all the following to word wrap instead of scroll box */
266
+ /* This will override the overflow:auto if present */
267
+ white-space: pre-wrap; /* css-3 */
268
+ white-space: -moz-pre-wrap !important; /* Mozilla, since 1999 */
269
+ white-space: -pre-wrap; /* Opera 4-6 */
270
+ white-space: -o-pre-wrap; /* Opera 7 */
271
+ word-wrap: break-word; /* Internet Explorer 5.5+ */
272
+ /* END word wrap */
273
+ }
274
+
275
+ pre, .highlight /* Code blocks */
276
+ {
277
+ /* Distinguish pre blocks from other text by more than the font with a background tint. */
278
+ padding: 0.5em; /* Since we have a background color */
279
+ border-radius: 5px; /* Softens it */
280
+ /* Give it a some definition */
281
+ border: 1px solid #ccc;
282
+ /* Set it off left and right, seems to look a bit nicer when we have a background */
283
+ margin-left: 0.5em;
284
+ margin-right: 0.5em;
285
+ }
286
+
287
+ /***** FIGURES/IMAGES *****/
288
+
289
+ figure img {
290
+ display: block;
291
+ margin-left: auto;
292
+ margin-right: auto;
293
+ max-width: 100%;
294
+ }
295
+
296
+ .resolution-print {
297
+ prince-image-resolution: 300dpi;
298
+ }
299
+
300
+ /***** FOOTNOTES *****/
301
+
302
+ .footnote {
303
+ display: none; /* default rule */
304
+
305
+ display: prince-footnote; /* prince-specific rules */
306
+ position: footnote;
307
+ footnote-style-position: inside;
308
+
309
+ counter-increment: footnote;
310
+ margin-left: 1.6875em;
311
+ font-size: 7.3pt;
312
+ line-height: 1.6875;
313
+ }
314
+
315
+ .footnote::footnote-call {
316
+ display: inline;
317
+ vertical-align: super;
318
+ font-size: 80%;
319
+ }
320
+
321
+ .footnote::footnote-marker {
322
+ padding-right: 0.4em;
323
+ }
324
+
325
+ /***** PAGE LAYOUT *****/
326
+
327
+ @page {
328
+ size: a4 landscape;
329
+ margin: 23.333mm 33mm 46.666mm 33mm;
330
+
331
+ @top-center {
332
+ font: 11pt 'Helvetica', sans-serif;
333
+ font-variant: small-caps;
334
+ content: string(header, first);
335
+ vertical-align: bottom;
336
+ padding-bottom: 2em;
337
+ }
338
+
339
+ @bottom-center {
340
+ font: 11pt 'Helvetica', sans-serif;
341
+ font-variant: small-caps;
342
+ text-align: center;
343
+ content: counter(page);
344
+ vertical-align: top;
345
+ padding-top: 2em;
346
+ }
347
+
348
+ @footnotes {
349
+ border-top: thin solid black;
350
+ padding-top: 0.3em;
351
+ margin-top: 16.875pt;
352
+ }
353
+ }
354
+ </style>
355
+ </head>
356
+ <body>
357
+ <section id="frontmatter">
358
+ <section class="slide slide-title">
359
+ <header>
360
+ <h1 class="title">{{title}}</h1>
361
+ <h2 class="subtitle">{{subtitle}}</h2>
362
+ </header>
363
+ {% unless authors.empty %}<ul class="authors">
364
+ {% for author in authors %}<li>{{author}}</li>
365
+ {% endfor %}
366
+ </ul>{% endunless %}
367
+
368
+ {% if logo %}<div class="logo">
369
+ <img alt="" src="{{logo}}">
370
+ </div>{% endif %}
371
+ </section>
372
+
373
+ <section class="slide toc">
374
+ <header>
375
+ <h2>Features</h2>
376
+ </header>
377
+ <ol class="features-list">
378
+ {% for feature in contents %}
379
+ <li><a href="#feature-{{feature.id}}">{{feature.name}}</a>
380
+ <ol class="scenarios-list">
381
+ {% for scenario in feature.elements %}
382
+ <li><a href="#scenario-{{scenario.id}}">{{scenario.name}}</a></li>
383
+ {% endfor %}
384
+ </ol>
385
+ </li>
386
+ {% endfor %}
387
+ </ol>
388
+ </section>
389
+
390
+ </section>
391
+ <section id="mainmatter">
392
+
393
+ {% for feature in contents %}
394
+ <section class="slide slide-section-title feature">
395
+ <header>
396
+ <h2 id="feature-{{feature.id}}">{{feature.name}}</h2>
397
+ </header>
398
+ </section>
399
+
400
+ {% unless feature.description == '' %}
401
+ <section class="slide slide-section-overview feature">
402
+ <header>
403
+ <h2>{{feature.name}}</h2>
404
+ </header>
405
+ {{ feature.description | parse | relevel:2 | markdown }}
406
+ </section>
407
+ {% endunless %}
408
+
409
+ {% for scenario in feature.elements %}
410
+ <section class="slide slide-scenario scenario">
411
+ <header>
412
+ <h3 id="scenario-{{scenario.id}}">{{scenario.name}}</h3>
413
+ </header>
414
+ <div class="description">
415
+ {{ scenario.description | parse | relevel:3 | markdown }}
416
+ </div>
417
+ <div class="steps">
418
+ <ol>
419
+ {% for step in scenario.steps %}
420
+ <li class="step {{step.keyword | strip | downcase}} {{step.result.status | strip | downcase }}">
421
+ <p>
422
+ <strong class="keyword">{{step.keyword | strip}}</strong> {{step.name}}
423
+ </p>
424
+
425
+ {% if step.doc_string %}
426
+ {{ step.doc_string.value | highlight: step.doc_string.content_type }}
427
+ {% endif %}
428
+
429
+ {% if step.rows %}
430
+ <table class="steptable">
431
+ <thead>
432
+ <tr>
433
+ {% for cell in step.rows[0].cells %}
434
+ <th>{{ cell }}</th>
435
+ {% endfor %}
436
+ </tr>
437
+ </thead>
438
+ <tbody>
439
+ {% for row in step.rows %}
440
+ {% unless forloop.first %}
441
+ <tr>
442
+ {% for cell in row.cells %}
443
+ <td>{{ cell | escape_once }}</td>
444
+ {% endfor %}
445
+ </tr>
446
+ {% endunless %}
447
+ {% endfor %}
448
+ </tbody>
449
+ </table>
450
+ {% endif %}
451
+
452
+ </li>
453
+ {% endfor %}
454
+ </ol>
455
+ </div>
456
+ </section>
457
+ {% endfor %}
458
+ {% endfor %}
459
+
460
+ </section>
461
+ <section id="backmatter">
462
+ </section>
463
+
464
+ </body>
465
+ </html>