slider 0.1 → 0.2

Sign up to get free protection for your applications and to get access to all the features.
Files changed (44) hide show
  1. data/lib/slider/version.rb +1 -1
  2. data/templates/basic.erb +50 -0
  3. data/templates/basic/deck.js/core/deck.core.css +404 -0
  4. data/templates/basic/deck.js/core/deck.core.html +39 -0
  5. data/templates/basic/deck.js/core/deck.core.js +498 -0
  6. data/templates/basic/deck.js/core/deck.core.scss +447 -0
  7. data/templates/basic/deck.js/goto/deck.goto.css +41 -0
  8. data/templates/basic/deck.js/goto/deck.goto.html +7 -0
  9. data/templates/basic/deck.js/goto/deck.goto.js +134 -0
  10. data/templates/basic/deck.js/goto/deck.goto.scss +46 -0
  11. data/templates/basic/deck.js/hash/deck.hash.css +13 -0
  12. data/templates/basic/deck.js/hash/deck.hash.html +2 -0
  13. data/templates/basic/deck.js/hash/deck.hash.js +129 -0
  14. data/templates/basic/deck.js/hash/deck.hash.scss +15 -0
  15. data/templates/basic/deck.js/menu/deck.menu.css +47 -0
  16. data/templates/basic/deck.js/menu/deck.menu.js +183 -0
  17. data/templates/basic/deck.js/menu/deck.menu.scss +58 -0
  18. data/templates/basic/deck.js/navigation/deck.navigation.css +43 -0
  19. data/templates/basic/deck.js/navigation/deck.navigation.html +3 -0
  20. data/templates/basic/deck.js/navigation/deck.navigation.js +83 -0
  21. data/templates/basic/deck.js/navigation/deck.navigation.scss +56 -0
  22. data/templates/basic/deck.js/scale/deck.scale.css +16 -0
  23. data/templates/basic/deck.js/scale/deck.scale.js +155 -0
  24. data/templates/basic/deck.js/scale/deck.scale.scss +17 -0
  25. data/templates/basic/deck.js/status/deck.status.css +18 -0
  26. data/templates/basic/deck.js/status/deck.status.html +6 -0
  27. data/templates/basic/deck.js/status/deck.status.js +83 -0
  28. data/templates/basic/deck.js/status/deck.status.scss +22 -0
  29. data/templates/basic/deck.js/style/neon.css +114 -0
  30. data/templates/basic/deck.js/style/neon.scss +139 -0
  31. data/templates/basic/deck.js/style/swiss.css +76 -0
  32. data/templates/basic/deck.js/style/swiss.scss +91 -0
  33. data/templates/basic/deck.js/style/web-2.0.css +205 -0
  34. data/templates/basic/deck.js/style/web-2.0.scss +236 -0
  35. data/templates/basic/deck.js/transition/fade.css +44 -0
  36. data/templates/basic/deck.js/transition/fade.scss +70 -0
  37. data/templates/basic/deck.js/transition/horizontal-slide.css +79 -0
  38. data/templates/basic/deck.js/transition/horizontal-slide.scss +94 -0
  39. data/templates/basic/deck.js/transition/vertical-slide.css +97 -0
  40. data/templates/basic/deck.js/transition/vertical-slide.scss +116 -0
  41. data/templates/basic/jquery.min.js +4 -0
  42. data/templates/basic/modernizr.custom.js +4 -0
  43. data/templates/basic/railscasts.css +64 -0
  44. metadata +43 -1
@@ -0,0 +1,205 @@
1
+ @charset "UTF-8";
2
+ .deck-container {
3
+ font-family: "Gill Sans", "Gill Sans MT", Calibri, sans-serif;
4
+ font-size: 1.25em;
5
+ background: #f4fafe;
6
+ /* Old browsers */
7
+ background: -moz-linear-gradient(top, #f4fafe 0%, #ccf0f0 100%);
8
+ /* FF3.6+ */
9
+ background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #f4fafe), color-stop(100%, #ccf0f0));
10
+ /* Chrome,Safari4+ */
11
+ background: -webkit-linear-gradient(top, #f4fafe 0%, #ccf0f0 100%);
12
+ /* Chrome10+,Safari5.1+ */
13
+ background: -o-linear-gradient(top, #f4fafe 0%, #ccf0f0 100%);
14
+ /* Opera11.10+ */
15
+ background: -ms-linear-gradient(top, #f4fafe 0%, #ccf0f0 100%);
16
+ /* IE10+ */
17
+ background: linear-gradient(top, #f4fafe 0%, #ccf0f0 100%);
18
+ /* W3C */
19
+ background-attachment: fixed;
20
+ }
21
+ .deck-container > .slide {
22
+ text-shadow: 1px 1px 1px rgba(255, 255, 255, 0.5);
23
+ }
24
+ .deck-container .slide h1, .deck-container .slide h2, .deck-container .slide h3, .deck-container .slide h4, .deck-container .slide h5, .deck-container .slide h6 {
25
+ font-family: "Hoefler Text", Constantia, Palatino, "Palatino Linotype", "Book Antiqua", Georgia, serif;
26
+ }
27
+ .deck-container .slide h1 {
28
+ color: #08455f;
29
+ }
30
+ .deck-container .slide h2 {
31
+ color: #0b7495;
32
+ border-bottom: 0;
33
+ }
34
+ .cssreflections .deck-container .slide h2 {
35
+ line-height: 1;
36
+ -webkit-box-reflect: below -0.556em -webkit-gradient(linear, left top, left bottom, from(transparent), color-stop(0.3, transparent), color-stop(0.7, rgba(255, 255, 255, 0.1)), to(transparent));
37
+ -moz-box-reflect: below -0.556em -moz-linear-gradient(top, transparent 0%, transparent 30%, rgba(255, 255, 255, 0.3) 100%);
38
+ }
39
+ .deck-container .slide h3 {
40
+ color: #000;
41
+ }
42
+ .deck-container .slide pre {
43
+ border-color: #cde;
44
+ background: #fff;
45
+ position: relative;
46
+ z-index: auto;
47
+ /* http://nicolasgallagher.com/css-drop-shadows-without-images/ */
48
+ }
49
+ .borderradius .deck-container .slide pre {
50
+ -webkit-border-radius: 5px;
51
+ -moz-border-radius: 5px;
52
+ border-radius: 5px;
53
+ }
54
+ .csstransforms.boxshadow .deck-container .slide pre > :first-child:before {
55
+ content: "";
56
+ position: absolute;
57
+ z-index: -1;
58
+ background: #fff;
59
+ top: 0;
60
+ bottom: 0;
61
+ left: 0;
62
+ right: 0;
63
+ }
64
+ .csstransforms.boxshadow .deck-container .slide pre:before, .csstransforms.boxshadow .deck-container .slide pre:after {
65
+ content: "";
66
+ position: absolute;
67
+ z-index: -2;
68
+ bottom: 15px;
69
+ width: 50%;
70
+ height: 20%;
71
+ max-width: 300px;
72
+ -webkit-box-shadow: 0 15px 10px rgba(0, 0, 0, 0.7);
73
+ -moz-box-shadow: 0 15px 10px rgba(0, 0, 0, 0.7);
74
+ box-shadow: 0 15px 10px rgba(0, 0, 0, 0.7);
75
+ }
76
+ .csstransforms.boxshadow .deck-container .slide pre:before {
77
+ left: 10px;
78
+ -webkit-transform: rotate(-3deg);
79
+ -moz-transform: rotate(-3deg);
80
+ -ms-transform: rotate(-3deg);
81
+ -o-transform: rotate(-3deg);
82
+ transform: rotate(-3deg);
83
+ }
84
+ .csstransforms.boxshadow .deck-container .slide pre:after {
85
+ right: 10px;
86
+ -webkit-transform: rotate(3deg);
87
+ -moz-transform: rotate(3deg);
88
+ -ms-transform: rotate(3deg);
89
+ -o-transform: rotate(3deg);
90
+ transform: rotate(3deg);
91
+ }
92
+ .deck-container .slide code {
93
+ color: #789;
94
+ }
95
+ .deck-container .slide blockquote {
96
+ font-family: "Hoefler Text", Constantia, Palatino, "Palatino Linotype", "Book Antiqua", Georgia, serif;
97
+ font-size: 2em;
98
+ padding: 1em 2em .5em 2em;
99
+ color: #000;
100
+ background: #fff;
101
+ position: relative;
102
+ border: 1px solid #cde;
103
+ z-index: auto;
104
+ }
105
+ .borderradius .deck-container .slide blockquote {
106
+ -webkit-border-radius: 5px;
107
+ -moz-border-radius: 5px;
108
+ border-radius: 5px;
109
+ }
110
+ .boxshadow .deck-container .slide blockquote > :first-child:before {
111
+ content: "";
112
+ position: absolute;
113
+ z-index: -1;
114
+ background: #fff;
115
+ top: 0;
116
+ bottom: 0;
117
+ left: 0;
118
+ right: 0;
119
+ }
120
+ .boxshadow .deck-container .slide blockquote:after {
121
+ content: "";
122
+ position: absolute;
123
+ z-index: -2;
124
+ top: 10px;
125
+ bottom: 10px;
126
+ left: 0;
127
+ right: 50%;
128
+ -moz-border-radius: 10px/100px;
129
+ border-radius: 10px/100px;
130
+ -webkit-box-shadow: 0 0 15px rgba(0, 0, 0, 0.6);
131
+ -moz-box-shadow: 0 0 15px rgba(0, 0, 0, 0.6);
132
+ box-shadow: 0 0 15px rgba(0, 0, 0, 0.6);
133
+ }
134
+ .deck-container .slide blockquote p {
135
+ margin: 0;
136
+ }
137
+ .deck-container .slide blockquote cite {
138
+ font-size: .5em;
139
+ font-style: normal;
140
+ font-weight: bold;
141
+ color: #888;
142
+ }
143
+ .deck-container .slide blockquote:before {
144
+ content: "“";
145
+ position: absolute;
146
+ top: 0;
147
+ left: 0;
148
+ font-size: 5em;
149
+ line-height: 1;
150
+ color: #ccf0f0;
151
+ z-index: 1;
152
+ }
153
+ .deck-container .slide ::-moz-selection {
154
+ background: #08455f;
155
+ color: #fff;
156
+ }
157
+ .deck-container .slide ::selection {
158
+ background: #08455f;
159
+ color: #fff;
160
+ }
161
+ .deck-container .slide a, .deck-container .slide a:hover, .deck-container .slide a:focus, .deck-container .slide a:active, .deck-container .slide a:visited {
162
+ color: #599;
163
+ text-decoration: none;
164
+ }
165
+ .deck-container .slide a:hover, .deck-container .slide a:focus {
166
+ text-decoration: underline;
167
+ }
168
+ .deck-container .deck-prev-link, .deck-container .deck-next-link {
169
+ background: #fff;
170
+ opacity: 0.5;
171
+ }
172
+ .deck-container .deck-prev-link, .deck-container .deck-prev-link:hover, .deck-container .deck-prev-link:focus, .deck-container .deck-prev-link:active, .deck-container .deck-prev-link:visited, .deck-container .deck-next-link, .deck-container .deck-next-link:hover, .deck-container .deck-next-link:focus, .deck-container .deck-next-link:active, .deck-container .deck-next-link:visited {
173
+ color: #599;
174
+ }
175
+ .deck-container .deck-prev-link:hover, .deck-container .deck-prev-link:focus, .deck-container .deck-next-link:hover, .deck-container .deck-next-link:focus {
176
+ opacity: 1;
177
+ text-decoration: none;
178
+ }
179
+ .deck-container .deck-status {
180
+ font-size: 0.6666em;
181
+ }
182
+ .deck-container.deck-menu .slide {
183
+ background: transparent;
184
+ -webkit-border-radius: 5px;
185
+ -moz-border-radius: 5px;
186
+ border-radius: 5px;
187
+ }
188
+ .rgba .deck-container.deck-menu .slide {
189
+ background: rgba(0, 0, 0, 0.1);
190
+ }
191
+ .deck-container.deck-menu .slide.deck-current, .rgba .deck-container.deck-menu .slide.deck-current, .no-touch .deck-container.deck-menu .slide:hover {
192
+ background: #fff;
193
+ }
194
+ .deck-container .goto-form {
195
+ background: #fff;
196
+ border: 1px solid #cde;
197
+ -webkit-border-radius: 5px;
198
+ -moz-border-radius: 5px;
199
+ border-radius: 5px;
200
+ }
201
+ .boxshadow .deck-container .goto-form {
202
+ -webkit-box-shadow: 0 15px 10px -10px rgba(0, 0, 0, 0.5), 0 1px 4px rgba(0, 0, 0, 0.3), 0 0 40px rgba(0, 0, 0, 0.1) inset;
203
+ -moz-box-shadow: 0 15px 10px -10px rgba(0, 0, 0, 0.5), 0 1px 4px rgba(0, 0, 0, 0.3), 0 0 40px rgba(0, 0, 0, 0.1) inset;
204
+ box-shadow: 0 15px 10px -10px rgba(0, 0, 0, 0.5), 0 1px 4px rgba(0, 0, 0, 0.3), 0 0 40px rgba(0, 0, 0, 0.1) inset;
205
+ }
@@ -0,0 +1,236 @@
1
+ @mixin border-radius($r) {
2
+ -webkit-border-radius:$r;
3
+ -moz-border-radius:$r;
4
+ border-radius:$r;
5
+ }
6
+
7
+ @mixin rotate($deg) {
8
+ -webkit-transform:rotate($deg);
9
+ -moz-transform:rotate($deg);
10
+ -ms-transform:rotate($deg);
11
+ -o-transform:rotate($deg);
12
+ transform:rotate($deg);
13
+ }
14
+
15
+ @mixin box-shadow($x, $y, $blur, $color) {
16
+ -webkit-box-shadow:$x $y $blur $color;
17
+ -moz-box-shadow:$x $y $blur $color;
18
+ box-shadow:$x $y $blur $color;
19
+ }
20
+
21
+
22
+ .deck-container {
23
+ font-family: "Gill Sans", "Gill Sans MT", Calibri, sans-serif;
24
+ font-size:1.25em;
25
+ background: rgb(244,250,254); /* Old browsers */
26
+ background: -moz-linear-gradient(top, rgba(244,250,254,1) 0%, rgba(204,240,240,1) 100%); /* FF3.6+ */
27
+ background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(244,250,254,1)), color-stop(100%,rgba(204,240,240,1))); /* Chrome,Safari4+ */
28
+ background: -webkit-linear-gradient(top, rgba(244,250,254,1) 0%,rgba(204,240,240,1) 100%); /* Chrome10+,Safari5.1+ */
29
+ background: -o-linear-gradient(top, rgba(244,250,254,1) 0%,rgba(204,240,240,1) 100%); /* Opera11.10+ */
30
+ background: -ms-linear-gradient(top, rgba(244,250,254,1) 0%,rgba(204,240,240,1) 100%); /* IE10+ */
31
+ background: linear-gradient(top, rgba(244,250,254,1) 0%,rgba(204,240,240,1) 100%); /* W3C */
32
+ background-attachment: fixed;
33
+
34
+ > .slide {
35
+ text-shadow:1px 1px 1px rgba(255,255,255,.5);
36
+ }
37
+
38
+ .slide {
39
+ h1, h2, h3, h4, h5, h6 {
40
+ font-family: "Hoefler Text", Constantia, Palatino, "Palatino Linotype", "Book Antiqua", Georgia, serif;
41
+ }
42
+
43
+ h1 {
44
+ color:#08455f;
45
+ }
46
+
47
+ h2 {
48
+ color:#0b7495;
49
+ border-bottom:0;
50
+
51
+ .cssreflections & {
52
+ line-height:1;
53
+ -webkit-box-reflect:below -0.5555em -webkit-gradient(linear, left top, left bottom, from(transparent), color-stop(0.3, transparent), color-stop(0.7, rgba(255,255,255,.1)), to(transparent));
54
+ -moz-box-reflect:below -0.5555em -moz-linear-gradient(top, transparent 0%, transparent 30%, rgba(255,255,255,.3) 100%);
55
+ }
56
+ }
57
+
58
+ h3 {
59
+ color:#000;
60
+ }
61
+
62
+ pre {
63
+ border-color:#cde;
64
+ background:#fff;
65
+ position:relative;
66
+ z-index:auto;
67
+
68
+ .borderradius & {
69
+ @include border-radius(5px);
70
+ }
71
+
72
+ /* http://nicolasgallagher.com/css-drop-shadows-without-images/ */
73
+ .csstransforms.boxshadow & {
74
+ > :first-child:before {
75
+ content:"";
76
+ position:absolute;
77
+ z-index:-1;
78
+ background:#fff;
79
+ top:0;
80
+ bottom:0;
81
+ left:0;
82
+ right:0;
83
+ }
84
+
85
+ &:before, &:after {
86
+ content:"";
87
+ position:absolute;
88
+ z-index:-2;
89
+ bottom:15px;
90
+ width:50%;
91
+ height:20%;
92
+ max-width:300px;
93
+ @include box-shadow(0, 15px, 10px, rgba(0, 0, 0, 0.7));
94
+ }
95
+
96
+ &:before {
97
+ left:10px;
98
+ @include rotate(-3deg);
99
+ }
100
+
101
+ &:after {
102
+ right:10px;
103
+ @include rotate(3deg);
104
+ }
105
+ }
106
+ }
107
+
108
+ code {
109
+ color:#789;
110
+ }
111
+
112
+ blockquote {
113
+ font-family: "Hoefler Text", Constantia, Palatino, "Palatino Linotype", "Book Antiqua", Georgia, serif;
114
+ font-size:2em;
115
+ padding:1em 2em .5em 2em;
116
+ color:#000;
117
+ background:#fff;
118
+ position:relative;
119
+ border:1px solid #cde;
120
+ z-index:auto;
121
+
122
+ .borderradius & {
123
+ @include border-radius(5px);
124
+ }
125
+
126
+ .boxshadow & {
127
+ > :first-child:before {
128
+ content:"";
129
+ position:absolute;
130
+ z-index:-1;
131
+ background:#fff;
132
+ top:0;
133
+ bottom:0;
134
+ left:0;
135
+ right:0;
136
+ }
137
+
138
+ &:after {
139
+ content:"";
140
+ position:absolute;
141
+ z-index:-2;
142
+ top: 10px;
143
+ bottom: 10px;
144
+ left: 0;
145
+ right: 50%;
146
+ -moz-border-radius: 10px / 100px;
147
+ border-radius: 10px / 100px;
148
+ @include box-shadow(0, 0, 15px, rgba(0,0,0,0.6));
149
+ }
150
+ }
151
+
152
+ p {
153
+ margin:0;
154
+ }
155
+
156
+ cite {
157
+ font-size:.5em;
158
+ font-style:normal;
159
+ font-weight:bold;
160
+ color:#888;
161
+ }
162
+
163
+ &:before {
164
+ content:"“";
165
+ position:absolute;
166
+ top:0;
167
+ left:0;
168
+ font-size:5em;
169
+ line-height:1;
170
+ color:#ccf0f0;
171
+ z-index:1;
172
+ }
173
+ }
174
+
175
+ ::-moz-selection{ background:#08455f; color:#fff; }
176
+ ::selection { background:#08455f; color:#fff; }
177
+
178
+ a {
179
+ &, &:hover, &:focus, &:active, &:visited {
180
+ color:#599;
181
+ text-decoration:none;
182
+ }
183
+
184
+ &:hover, &:focus {
185
+ text-decoration:underline;
186
+ }
187
+ }
188
+ }
189
+
190
+ .deck-prev-link, .deck-next-link {
191
+ background:#fff;
192
+ opacity:0.5;
193
+
194
+ &, &:hover, &:focus, &:active, &:visited {
195
+ color:#599;
196
+ }
197
+
198
+ &:hover, &:focus {
199
+ opacity:1;
200
+ text-decoration:none;
201
+ }
202
+ }
203
+
204
+ .deck-status {
205
+ font-size:0.6666em;
206
+ }
207
+
208
+ &.deck-menu {
209
+ .slide {
210
+ background:transparent;
211
+ @include border-radius(5px);
212
+
213
+ .rgba & {
214
+ background:rgba(0,0,0,.1);
215
+ }
216
+
217
+ &.deck-current, .rgba &.deck-current, .no-touch &:hover {
218
+ background:#fff;
219
+ }
220
+ }
221
+ }
222
+
223
+ .goto-form {
224
+ background:#fff;
225
+ border:1px solid #cde;
226
+ @include border-radius(5px);
227
+
228
+ .boxshadow & {
229
+ -webkit-box-shadow: 0 15px 10px -10px rgba(0, 0, 0, 0.5), 0 1px 4px rgba(0, 0, 0, 0.3), 0 0 40px rgba(0, 0, 0, 0.1) inset;
230
+ -moz-box-shadow: 0 15px 10px -10px rgba(0, 0, 0, 0.5), 0 1px 4px rgba(0, 0, 0, 0.3), 0 0 40px rgba(0, 0, 0, 0.1) inset;
231
+ box-shadow: 0 15px 10px -10px rgba(0, 0, 0, 0.5), 0 1px 4px rgba(0, 0, 0, 0.3), 0 0 40px rgba(0, 0, 0, 0.1) inset;
232
+ }
233
+ }
234
+ }
235
+
236
+
@@ -0,0 +1,44 @@
1
+ .csstransitions.csstransforms .deck-container .slide {
2
+ -webkit-transition: opacity 500ms ease-in-out 0ms;
3
+ -moz-transition: opacity 500ms ease-in-out 0ms;
4
+ -ms-transition: opacity 500ms ease-in-out 0ms;
5
+ -o-transition: opacity 500ms ease-in-out 0ms;
6
+ transition: opacity 500ms ease-in-out 0ms;
7
+ }
8
+ .csstransitions.csstransforms .deck-container:not(.deck-menu) > .slide {
9
+ position: absolute;
10
+ top: 0;
11
+ left: 0;
12
+ -webkit-box-sizing: border-box;
13
+ -moz-box-sizing: border-box;
14
+ box-sizing: border-box;
15
+ width: 100%;
16
+ padding: 0 48px;
17
+ }
18
+ .csstransitions.csstransforms .deck-container:not(.deck-menu) > .slide .slide {
19
+ position: relative;
20
+ left: 0;
21
+ top: 0;
22
+ opacity: 0;
23
+ }
24
+ .csstransitions.csstransforms .deck-container:not(.deck-menu) > .slide .deck-before, .csstransitions.csstransforms .deck-container:not(.deck-menu) > .slide .deck-previous {
25
+ opacity: 0.4;
26
+ }
27
+ .csstransitions.csstransforms .deck-container:not(.deck-menu) > .slide .deck-current {
28
+ opacity: 1;
29
+ }
30
+ .csstransitions.csstransforms .deck-container:not(.deck-menu) > .deck-previous, .csstransitions.csstransforms .deck-container:not(.deck-menu) > .deck-before, .csstransitions.csstransforms .deck-container:not(.deck-menu) > .deck-next, .csstransitions.csstransforms .deck-container:not(.deck-menu) > .deck-after {
31
+ opacity: 0;
32
+ pointer-events: none;
33
+ }
34
+ .csstransitions.csstransforms .deck-container:not(.deck-menu) > .deck-before .slide, .csstransitions.csstransforms .deck-container:not(.deck-menu) > .deck-previous .slide {
35
+ visibility: visible;
36
+ }
37
+ .csstransitions.csstransforms .deck-container:not(.deck-menu) > .deck-child-current {
38
+ opacity: 1;
39
+ visibility: visible;
40
+ pointer-events: auto;
41
+ }
42
+ .csstransitions.csstransforms .deck-container:not(.deck-menu) > .deck-child-current .deck-next, .csstransitions.csstransforms .deck-container:not(.deck-menu) > .deck-child-current .deck-after {
43
+ visibility: hidden;
44
+ }