slideshow 2.3.0 → 2.4.0
Sign up to get free protection for your applications and to get access to all the features.
- checksums.yaml +7 -0
- data/HISTORY.md +4 -0
- data/Manifest.txt +3 -48
- data/{README.markdown → README.md} +134 -132
- data/Rakefile +26 -17
- data/lib/slideshow.rb +19 -97
- data/lib/slideshow/cli/main.rb +38 -20
- data/lib/slideshow/cli/main_utils.rb +10 -4
- data/lib/slideshow/cli/opts.rb +3 -1
- data/lib/slideshow/cli/version.rb +26 -0
- metadata +63 -147
- data/History.markdown +0 -171
- data/config/slideshow.builtin.yml +0 -8
- data/config/slideshow.index.yml +0 -61
- data/config/slideshow.yml +0 -76
- data/lib/slideshow/cli/commands/fetch.rb +0 -121
- data/lib/slideshow/cli/commands/gen.rb +0 -330
- data/lib/slideshow/cli/commands/gen_templates.rb +0 -52
- data/lib/slideshow/cli/commands/list.rb +0 -70
- data/lib/slideshow/cli/commands/plugins.rb +0 -44
- data/lib/slideshow/cli/commands/quick.rb +0 -86
- data/lib/slideshow/config.rb +0 -241
- data/lib/slideshow/filters/debug_filter.rb +0 -74
- data/lib/slideshow/filters/headers_filter.rb +0 -45
- data/lib/slideshow/filters/slide_filter.rb +0 -113
- data/lib/slideshow/filters/text_filter.rb +0 -140
- data/lib/slideshow/headers.rb +0 -87
- data/lib/slideshow/helpers/background_helper.rb +0 -121
- data/lib/slideshow/helpers/capture_helper.rb +0 -136
- data/lib/slideshow/helpers/directive_helper.rb +0 -43
- data/lib/slideshow/helpers/markdown_helper.rb +0 -18
- data/lib/slideshow/helpers/source_helper.rb +0 -39
- data/lib/slideshow/helpers/step_helper.rb +0 -33
- data/lib/slideshow/helpers/syntax/coderay_helper.rb +0 -84
- data/lib/slideshow/helpers/syntax/sh_helper.rb +0 -61
- data/lib/slideshow/helpers/syntax/uv_helper.rb +0 -90
- data/lib/slideshow/helpers/text_helper.rb +0 -130
- data/lib/slideshow/manifest_helpers.rb +0 -94
- data/lib/slideshow/markup/markdown.rb +0 -18
- data/lib/slideshow/markup/mediawiki.rb +0 -38
- data/lib/slideshow/markup/rest.rb +0 -17
- data/lib/slideshow/markup/textile.rb +0 -68
- data/lib/slideshow/plugin_helpers.rb +0 -62
- data/lib/slideshow/slide.rb +0 -118
- data/lib/slideshow/version.rb +0 -3
- data/templates/s6.txt +0 -27
- data/templates/s6.txt.gen +0 -19
- data/templates/s6/jquery.js +0 -8176
- data/templates/s6/jquery.microsoft.js +0 -31
- data/templates/s6/jquery.slideshow.js +0 -534
- data/templates/s6/print.css +0 -1
- data/templates/s6/projection.css +0 -109
- data/templates/s6/screen.css +0 -50
- data/templates/slides.html.erb +0 -55
- data/templates/slides.pdf.html.erb +0 -62
- data/templates/style.css.erb +0 -91
- data/templates/welcome.text +0 -167
- data/templates/welcome.txt.quick +0 -6
data/templates/s6/print.css
DELETED
@@ -1 +0,0 @@
|
|
1
|
-
/*********************************
|
2
|
* CSS @media print rules (not projection or screen)
|
3
1
|
*/
|
4
2
|
* Make sure all slides are visible (to make them all appear in prin)
|
5
3
|
*/
|
6
4
|
display: block !important;
|
7
5
|
}
|
8
6
|
* Extra styling for first slide (title slide)
|
9
7
|
*/
|
10
8
|
border-bottom: 1px dotted silver;
|
11
9
|
}
|
12
10
|
* Turn on print-specific stuff/classes
|
13
11
|
*/
|
14
12
|
* Turn off online (screen/projection)-specific stuff/classes
|
15
13
|
*/
|
16
14
|
* The following rule keeps the layout stuff out of print.
|
17
15
|
* Remove at your own risk!
|
18
16
|
*/
|
data/templates/s6/projection.css
DELETED
@@ -1,109 +0,0 @@
|
|
1
|
-
/*********************************
|
2
|
-
* CSS @media projection rules (not print or screen)
|
3
|
-
*
|
4
|
-
* 1) projection -> slideshow mode (display one slide at-a-time; hide all others)
|
5
|
-
* 2) screen -> outline mode (display all slides-at-once on screen)
|
6
|
-
* 3) print -> print (and print preview)
|
7
|
-
*
|
8
|
-
* toogle between slideshow/outline mode using t-key
|
9
|
-
*/
|
10
|
-
|
11
|
-
html,
|
12
|
-
body,
|
13
|
-
.presentation { margin: 0; padding: 0; }
|
14
|
-
|
15
|
-
|
16
|
-
.slide { display: none;
|
17
|
-
position: absolute;
|
18
|
-
top: 0; left: 0;
|
19
|
-
margin: 0;
|
20
|
-
padding: 2% 4% 0% 4%; /* css note: order is => top right bottom left */
|
21
|
-
width: 92%; height: 95%; /* css note: to get to 100% add padding/border/margin */
|
22
|
-
overflow-x: hidden; overflow-y: auto;
|
23
|
-
z-index: 2;
|
24
|
-
}
|
25
|
-
|
26
|
-
#slide1 { display: block; }
|
27
|
-
|
28
|
-
.notes { display: none; } /* handout notes/note (use note? handout? notes? */
|
29
|
-
|
30
|
-
|
31
|
-
/********* format layout block
|
32
|
-
*
|
33
|
-
* .layout
|
34
|
-
* > #header
|
35
|
-
* > #footer
|
36
|
-
* > #controls (holding navigation controls)
|
37
|
-
* > #navLinks
|
38
|
-
* > #toggle
|
39
|
-
* > #navList
|
40
|
-
* > #jumplist
|
41
|
-
* > #currentSlide (e.g. 1/7)
|
42
|
-
*
|
43
|
-
*/
|
44
|
-
|
45
|
-
.layout { display: block; }
|
46
|
-
|
47
|
-
#header { position: fixed;
|
48
|
-
top: 0; left: 0;
|
49
|
-
width: 100%; height: 0.5em;
|
50
|
-
z-index: 1;
|
51
|
-
}
|
52
|
-
|
53
|
-
#footer { position: fixed;
|
54
|
-
top: auto; bottom: 0;
|
55
|
-
padding: 1em 0; /* css note: order is => 1st top,bottom; 2nd right,left */
|
56
|
-
width: 100%; height: 1em;
|
57
|
-
z-index: 5;
|
58
|
-
|
59
|
-
/* todo: move font-size and font-style to blank.css */
|
60
|
-
font-size: 100%; font-weight: bold;
|
61
|
-
}
|
62
|
-
|
63
|
-
/* todo: move font-size and font-style to blank.css */
|
64
|
-
|
65
|
-
#footer h1 { display: block; margin: 0; padding: 0 1em; font-size: 0.5em; }
|
66
|
-
#footer h2 { display: block; margin: 0; padding: 0 1em; font-size: 0.5em; font-style: italic; }
|
67
|
-
|
68
|
-
|
69
|
-
/*************************
|
70
|
-
* format for navigation controls
|
71
|
-
*/
|
72
|
-
|
73
|
-
|
74
|
-
#controls { position: fixed;
|
75
|
-
left: 60%; bottom: 0;
|
76
|
-
width: 40%;
|
77
|
-
z-index: 100;
|
78
|
-
text-align: right;
|
79
|
-
font: bold 1.2em Verdana, Helvetica, sans-serif;
|
80
|
-
}
|
81
|
-
|
82
|
-
#controls :focus { outline: 1px dotted white;}
|
83
|
-
|
84
|
-
#controls #navLinks { text-align: right; margin: 0; visibility: hidden; }
|
85
|
-
|
86
|
-
#controls #navLinks a { padding: 0; margin: 0 0.5em; cursor: pointer; border: none; }
|
87
|
-
|
88
|
-
#controls #navLinks :link,
|
89
|
-
#controls #navLinks :visited {text-decoration: none; }
|
90
|
-
|
91
|
-
#controls #navList #jumplist { background: white; color: black; }
|
92
|
-
|
93
|
-
/*************************
|
94
|
-
* format for
|
95
|
-
* currentSlide block ( e.g. 2/20 )
|
96
|
-
*/
|
97
|
-
|
98
|
-
#currentSlide { position: fixed;
|
99
|
-
left: 45%; bottom: 1em;
|
100
|
-
width: 10%;
|
101
|
-
z-index: 10;
|
102
|
-
text-align: center;
|
103
|
-
font-size: 0.8em;
|
104
|
-
}
|
105
|
-
|
106
|
-
#currentSlide :link,
|
107
|
-
#currentSlide :visited { text-decoration: none; }
|
108
|
-
|
109
|
-
|
data/templates/s6/screen.css
DELETED
@@ -1,50 +0,0 @@
|
|
1
|
-
/*********************************
|
2
|
-
* CSS @media screen (not projection or print)
|
3
|
-
*
|
4
|
-
* 1) projection -> slideshow mode (display one slide at-a-time; hide all others)
|
5
|
-
* 2) screen -> outline mode (display all slides-at-once on screen)
|
6
|
-
* 3) print -> print (and print preview)
|
7
|
-
*
|
8
|
-
* toogle between slideshow/outline mode using t-key
|
9
|
-
*/
|
10
|
-
|
11
|
-
|
12
|
-
/****
|
13
|
-
* hide layout stuff (header, footer, navLinks, navList etc.)
|
14
|
-
*/
|
15
|
-
|
16
|
-
.layout * { display: none; }
|
17
|
-
|
18
|
-
.projection { display: none; }
|
19
|
-
|
20
|
-
/*************
|
21
|
-
* make toggle button visible and reposition to upper right corner *
|
22
|
-
* note: toogle button is nested inside #controls > #navLinks > #toogle
|
23
|
-
*/
|
24
|
-
|
25
|
-
#controls,
|
26
|
-
#navLinks,
|
27
|
-
#toggle { display: block;
|
28
|
-
visibility: visible;
|
29
|
-
margin: 0; padding: 0;
|
30
|
-
}
|
31
|
-
|
32
|
-
#toggle { position: fixed;
|
33
|
-
top: 0; right: 0;
|
34
|
-
padding: 0.5em;
|
35
|
-
border-left: 1px solid;
|
36
|
-
border-bottom: 1px solid;
|
37
|
-
background: white;
|
38
|
-
}
|
39
|
-
|
40
|
-
|
41
|
-
/*************
|
42
|
-
* making the outline look pretty-ish
|
43
|
-
*/
|
44
|
-
|
45
|
-
#slide1, #slide1 h1, #slide1 h2, #slide1 h3, #slide1 h4 {border: none; margin: 0;}
|
46
|
-
#slide1 h1 {padding-top: 1.5em;}
|
47
|
-
|
48
|
-
.slide { margin: 1.5em 0 0; border-top: 1px solid #888; }
|
49
|
-
.slide h1 { border-bottom: 1px solid #AAA; }
|
50
|
-
|
data/templates/slides.html.erb
DELETED
@@ -1,55 +0,0 @@
|
|
1
|
-
<!DOCTYPE html>
|
2
|
-
<html>
|
3
|
-
<head>
|
4
|
-
<meta http-equiv="content-type" content="text/html;charset=utf-8">
|
5
|
-
<title><%= @headers['title'] %></title>
|
6
|
-
|
7
|
-
<meta name="generator" content="<%= @headers['generator'] %>">
|
8
|
-
<meta name="author" content="<%= @headers['author']%>" >
|
9
|
-
|
10
|
-
<!-- helper/macro that lets you add (CSS3) gradient using headers
|
11
|
-
see http://slideshow.rubyforge.org/themes.html
|
12
|
-
|
13
|
-
<%= gradient_from_headers() %> -->
|
14
|
-
|
15
|
-
<!-- S6 style sheet links -->
|
16
|
-
<link rel="stylesheet" href="<%= "#{@name}.css" %>" media="projection" id="styleProjection">
|
17
|
-
<link rel="stylesheet" href="s6/screen.css" media="screen" id="styleScreen">
|
18
|
-
<link rel="stylesheet" href="s6/print.css" media="print">
|
19
|
-
|
20
|
-
<!-- S6 JS -->
|
21
|
-
<script src="s6/jquery.js"></script>
|
22
|
-
<script src="s6/jquery.slideshow.js"></script>
|
23
|
-
<script>
|
24
|
-
$(document).ready( function() {
|
25
|
-
Slideshow.init();
|
26
|
-
} );
|
27
|
-
|
28
|
-
<%= content_for :js %>
|
29
|
-
</script>
|
30
|
-
|
31
|
-
<!-- Better Browser Banner for Microsoft Internet Explorer (IE) -->
|
32
|
-
<!--[if IE]>
|
33
|
-
<script src="s6/jquery.microsoft.js"></script>
|
34
|
-
<![endif]-->
|
35
|
-
|
36
|
-
<%= content_for :head %>
|
37
|
-
|
38
|
-
</head>
|
39
|
-
<body>
|
40
|
-
|
41
|
-
<div class="layout">
|
42
|
-
<div id="header"></div>
|
43
|
-
<div id="footer">
|
44
|
-
<h1><%= @headers['footer'] %></h1>
|
45
|
-
<h2><%= @headers['subfooter'] %></h2>
|
46
|
-
</div>
|
47
|
-
</div>
|
48
|
-
|
49
|
-
<div class="presentation">
|
50
|
-
|
51
|
-
<%= @content %>
|
52
|
-
|
53
|
-
</div><!-- presentation -->
|
54
|
-
</body>
|
55
|
-
</html>
|
@@ -1,62 +0,0 @@
|
|
1
|
-
<!DOCTYPE html>
|
2
|
-
<html>
|
3
|
-
<head>
|
4
|
-
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
|
5
|
-
<title><%= @headers['title'] %></title>
|
6
|
-
|
7
|
-
<%= content_for :head %>
|
8
|
-
|
9
|
-
<style>
|
10
|
-
html, body { margin: 0; padding: 0; }
|
11
|
-
|
12
|
-
body { font-family: Verdana, Geneva, Arial, Helvetica, sans-serif; }
|
13
|
-
|
14
|
-
a:link, a:visited { color: black; }
|
15
|
-
|
16
|
-
h1 { font-size: 30pt; }
|
17
|
-
h2 { font-size: 28pt; }
|
18
|
-
h3 { font-size: 25pt; }
|
19
|
-
p, li, dt, dd, td, th { font-size: 18pt; }
|
20
|
-
|
21
|
-
pre { font-size: 14pt; }
|
22
|
-
pre.small { font-size: 11pt; }
|
23
|
-
|
24
|
-
pre.code {
|
25
|
-
background-color: azure;
|
26
|
-
padding: 5px;
|
27
|
-
}
|
28
|
-
|
29
|
-
ul { list-style-type: square; }
|
30
|
-
|
31
|
-
.center { text-align: center; }
|
32
|
-
|
33
|
-
.slide { page-break-after: always;
|
34
|
-
min-height: 100mm;
|
35
|
-
padding: 40px;
|
36
|
-
|
37
|
-
border: 1px dotted black;
|
38
|
-
|
39
|
-
/*
|
40
|
-
background: -moz-linear-gradient( top, maroon, red);
|
41
|
-
*/
|
42
|
-
}
|
43
|
-
|
44
|
-
<%= content_for :css %>
|
45
|
-
|
46
|
-
/*
|
47
|
-
for princexml (CSS3 paged media support)
|
48
|
-
@page { size: A4 landscape }
|
49
|
-
*/
|
50
|
-
</style>
|
51
|
-
|
52
|
-
</head>
|
53
|
-
<body>
|
54
|
-
|
55
|
-
<div class="presentation">
|
56
|
-
|
57
|
-
<%= @content %>
|
58
|
-
|
59
|
-
</div> <!-- presentation -->
|
60
|
-
</body>
|
61
|
-
</html>
|
62
|
-
|
data/templates/style.css.erb
DELETED
@@ -1,91 +0,0 @@
|
|
1
|
-
@import url(s6/projection.css); /* required to make the slide show run at all */
|
2
|
-
|
3
|
-
body { font-family: Verdana, Geneva, Arial, Helvetica, sans-serif; }
|
4
|
-
|
5
|
-
a:link, a:visited { color: black; }
|
6
|
-
|
7
|
-
.slide h1 { font-size: 30pt; }
|
8
|
-
|
9
|
-
.slide h1 { text-align: center; }
|
10
|
-
|
11
|
-
.slide h1.fullscreen { position: absolute;
|
12
|
-
top: 40%;
|
13
|
-
width: 100%; }
|
14
|
-
|
15
|
-
/* lets you create slides with no heading (because heading is hidden but gets included in toc) */
|
16
|
-
.slide h1.hidden { display: none; }
|
17
|
-
|
18
|
-
|
19
|
-
.slide h2 { font-size: 28pt; }
|
20
|
-
|
21
|
-
h3 { font-size: 25pt; }
|
22
|
-
|
23
|
-
/* todo: add special formating for .cover slide
|
24
|
-
lets you use h1(cover). for title/cover slide (a la S5 slide0) but more generic (not bound to 1st slide)
|
25
|
-
*/
|
26
|
-
|
27
|
-
.cover h1 { /* tbd */ }
|
28
|
-
.cover h2 { /* tbd */ }
|
29
|
-
|
30
|
-
/* todo: add special formating for h1, h2 in footer */
|
31
|
-
|
32
|
-
#footer h1 { /* tbd */ }
|
33
|
-
#footer h2 { /* tbd */ }
|
34
|
-
|
35
|
-
|
36
|
-
p, li, dt, dd, td, th { font-size: 18pt; }
|
37
|
-
|
38
|
-
ul { list-style-type: square; }
|
39
|
-
|
40
|
-
/**********************************/
|
41
|
-
/* general text-alignment classes */
|
42
|
-
|
43
|
-
.left { text-align: left; }
|
44
|
-
.center { text-align: center; }
|
45
|
-
.right { text-align: right; }
|
46
|
-
|
47
|
-
/**********************************/
|
48
|
-
/* general font-size classes */
|
49
|
-
|
50
|
-
.small { font-size: 97%; }
|
51
|
-
|
52
|
-
.x-small,
|
53
|
-
.smaller { font-size: 88%; }
|
54
|
-
|
55
|
-
.xx-small,
|
56
|
-
.smallest,
|
57
|
-
.tiny { font-size: 82%; }
|
58
|
-
|
59
|
-
|
60
|
-
|
61
|
-
pre { font-size: 16pt; }
|
62
|
-
|
63
|
-
.code {
|
64
|
-
background-color: azure;
|
65
|
-
padding: 5px;
|
66
|
-
}
|
67
|
-
|
68
|
-
.footnote a:first-of-type { text-decoration: none; }
|
69
|
-
|
70
|
-
|
71
|
-
p.small { font-size: 97%; }
|
72
|
-
|
73
|
-
p.x-small,
|
74
|
-
p.smaller,
|
75
|
-
p.footnote { font-size: 88%; }
|
76
|
-
|
77
|
-
p.xx-small,
|
78
|
-
p.smallest,
|
79
|
-
p.tiny { font-size: 82%; }
|
80
|
-
|
81
|
-
|
82
|
-
.help p,
|
83
|
-
.help td { font-size: 88%; }
|
84
|
-
|
85
|
-
|
86
|
-
.step { color: silver; }
|
87
|
-
/* or hide next steps e.g. .step { visibility: hidden; } */
|
88
|
-
.stepcurrent { color: black; }
|
89
|
-
|
90
|
-
|
91
|
-
<%= content_for :css %>
|
data/templates/welcome.text
DELETED
@@ -1,167 +0,0 @@
|
|
1
|
-
%%%%%%%%%%%%%%%%%%
|
2
|
-
%% Some Headers
|
3
|
-
|
4
|
-
Title: Slide Show (S9) 10-Minute Tutorial
|
5
|
-
|
6
|
-
|
7
|
-
%%%%%%%%%%%%%%
|
8
|
-
%% Let's go.
|
9
|
-
|
10
|
-
Slide Show (S9) 10-Minute Tutorial
|
11
|
-
==================================
|
12
|
-
|
13
|
-
Agenda
|
14
|
-
|
15
|
-
* What's Slide Show (S9)?
|
16
|
-
* Wiki-Style Markup Language - Markdown, Textile
|
17
|
-
* How it works - Just press F11!
|
18
|
-
* What's S5? What's S6?
|
19
|
-
* Gradient Themes Using "Loss-Free" Vector Graphics in S9
|
20
|
-
* Turn Your Online Wiki Pages into Slide Shows - Sputnik Case Study
|
21
|
-
|
22
|
-
|
23
|
-
What's Slide Show (S9)?
|
24
|
-
=======================
|
25
|
-
|
26
|
-
### What?
|
27
|
-
|
28
|
-
A Free Web Alternative to PowerPoint and KeyNote in Ruby
|
29
|
-
|
30
|
-
|
31
|
-
### Getting Started in 1-2-3 Easy Steps
|
32
|
-
|
33
|
-
* Step 1: Author your slides in plain text using a wiki-style markup language
|
34
|
-
* Step 2: Generate your slide show using the `slideshow` gem
|
35
|
-
* Step 3: Open up your slide show in your browser and hit the space bar to flip through your slides
|
36
|
-
* That's it. Showtime!
|
37
|
-
|
38
|
-
|
39
|
-
Wiki-Style Markup Language - Markdown
|
40
|
-
=====================================
|
41
|
-
|
42
|
-
Lets you create slide shows and author slides in plain text
|
43
|
-
using a wiki-style markup language that's easy-to-write and easy-to-read.
|
44
|
-
Sample:
|
45
|
-
|
46
|
-
```
|
47
|
-
What's Slide Show (S9)?
|
48
|
-
=======================
|
49
|
-
|
50
|
-
### What?
|
51
|
-
|
52
|
-
A Free Web Alternative to PowerPoint and KeyNote in Ruby
|
53
|
-
|
54
|
-
### Getting Started in 1-2-3 Easy Steps
|
55
|
-
|
56
|
-
- Step 1: Author your slides in plain text using a wiki-style markup language
|
57
|
-
- Step 2: Generate your slide show using the `slideshow` gem
|
58
|
-
- Step 3: Open up your slide show in your browser
|
59
|
-
- That's it. Showtime!
|
60
|
-
```
|
61
|
-
|
62
|
-
|
63
|
-
How it works - Just press F11!
|
64
|
-
==============================
|
65
|
-
|
66
|
-
The Slide Show (S9) Ruby gem turns your slides in plain text into a web page
|
67
|
-
that's an all-in-one-page handout and a live slide show all at once.
|
68
|
-
|
69
|
-
|
70
|
-
$ slideshow tutorial
|
71
|
-
|
72
|
-
=> Preparing slide show 'tutorial.html'...
|
73
|
-
=> Done.
|
74
|
-
|
75
|
-
|
76
|
-
Turn your web page into a slide show and your browser into full screen projection
|
77
|
-
with a single push button (F11). Hit the space bar or the right arrow, down arrow
|
78
|
-
or page down key to flip through your slides.
|
79
|
-
|
80
|
-
That's all. It's that simple.
|
81
|
-
|
82
|
-
|
83
|
-
Slide Show (S9) Template Pack Options
|
84
|
-
=====================================
|
85
|
-
|
86
|
-
{% left %}
|
87
|
-
|
88
|
-
### What's S5?
|
89
|
-
|
90
|
-
Simple Standards-based Slide Show System (S5) -Eric Meyer's (of CSS fame) public domain (free, open source) slide show package inspired by Opera Show and others
|
91
|
-
that works in all modern browsers (without any plugin required
|
92
|
-
because it includes its own slide show machinery in JavaScript).
|
93
|
-
|
94
|
-
(Use the `s5blank` or `s5themes` template pack to create S5 slide shows.)
|
95
|
-
|
96
|
-
{% end %}
|
97
|
-
|
98
|
-
{% right %}
|
99
|
-
|
100
|
-
### What's S6?
|
101
|
-
|
102
|
-
S6 started as a rewrite of Eric Meyer's S5 using the jQuery JavaScript library -- offering easier to understand and easier to extend code. Add plugins, effects and more. Contributions welcome!
|
103
|
-
|
104
|
-
(Use the `s6blank` or `s6syntax` template pack to create S6 slide shows.)
|
105
|
-
|
106
|
-
{% end %}
|
107
|
-
|
108
|
-
### What's Slidy? What's Slippy? What's Google HTML5 Slides?
|
109
|
-
|
110
|
-
Check the [Slide Show Template Gallery](http://slideshow.rubyforge.org/templates.html)
|
111
|
-
for more template packs and samples.
|
112
|
-
|
113
|
-
|
114
|
-
|
115
|
-
Gradient Themes Using "Loss-Free" Vector Graphics in S9
|
116
|
-
=======================================================
|
117
|
-
|
118
|
-
### CSS3 Background Gradients
|
119
|
-
|
120
|
-
Using modern browser such as Firefox (3.6+), Chrome and Safari you can
|
121
|
-
now theme your slide shows using using "loss-free" vector
|
122
|
-
graphics in plain old CSS. Thanks to gradient support in backgrounds in CSS3.
|
123
|
-
|
124
|
-
For example, the linear gradient from top to bottom with four color is defined
|
125
|
-
in CSS3 as:
|
126
|
-
|
127
|
-
```
|
128
|
-
.gradient_yellow_orange {
|
129
|
-
|
130
|
-
background: -webkit-gradient(linear, 0% 0%, 0% 100%,
|
131
|
-
from(yellow), to(orange),
|
132
|
-
color-stop(0.33,orange), color-stop(0.66,yellow));
|
133
|
-
|
134
|
-
background: -moz-linear-gradient(top, yellow, orange, yellow, orange);
|
135
|
-
}
|
136
|
-
```
|
137
|
-
|
138
|
-
Using Slide Show (S9) you can use the `gradient` helper that
|
139
|
-
generates the CSS3 for you:
|
140
|
-
|
141
|
-
```
|
142
|
-
{{{{ gradient yellow orange yellow orange }}
|
143
|
-
```
|
144
|
-
|
145
|
-
|
146
|
-
Turn Your Online Wiki Pages into Slide Shows - Sputnik Case Study
|
147
|
-
=================================================================
|
148
|
-
|
149
|
-
Inspired by the Slide Show (S9) Ruby gem - Yuri Takhteyev has
|
150
|
-
added S9-style slide shows
|
151
|
-
to [Sputnik](http://sputnik.freewisdom.org/en/Slideshow_Demo) - a wiki in Lua.
|
152
|
-
|
153
|
-
Lets you author slide shows online in your browser.
|
154
|
-
It's - surprise, surpise - a wiki and, thus, lets you
|
155
|
-
work togther with others on a slide show,
|
156
|
-
track changes and versions, link and get linked, and much much more.
|
157
|
-
|
158
|
-
|
159
|
-
Thanks - Learn More - Questions? Comments?
|
160
|
-
==========================================
|
161
|
-
|
162
|
-
Gerald Bauer designed and developed the Slide Show (S9) Ruby gem.
|
163
|
-
Find out more @ [`slideshow.rubyforge.org`](http://slideshow.rubyforge.org)
|
164
|
-
|
165
|
-
Questions? Comments? Send them along
|
166
|
-
to the [Free Web Slide Show Alternatives - S5, S6, S9 And Friends - Forum/Mailing List](http://groups.google.com/group/webslideshow).
|
167
|
-
Thanks!
|