1
0
Fork 0

add beige theme, move theme class from .reveal to document element, use log instead of alert to demonstrate custom events

This commit is contained in:
Hakim El Hattab 2012-07-12 23:08:21 -04:00
parent 5bc5435b61
commit 7366f607ce
4 changed files with 54 additions and 11 deletions

View file

@ -49,7 +49,7 @@ Reveal.initialize({
rollingLinks: true,
// UI style
theme: 'default', // default/neon
theme: 'default', // default/neon/beige
// Transition style
transition: 'default' // default/cube/page/concave/linear(2d)
@ -169,6 +169,7 @@ You can change the appearance of the speaker notes by editing the file at `plugi
- Folder structure updates for scalability (see /lib & /plugin)
- Slide notes by [rmurphey](https://github.com/rmurphey)
- Bumped up default font-size for code samples
- Added beige theme
#### 1.3
- Revised keyboard shortcuts, including ESC for overview, N for next, P for previous. Thanks [mahemoff](https://github.com/mahemoff)

View file

@ -849,22 +849,64 @@ body {
* NEON THEME
*********************************************/
.reveal.neon a,
.reveal.neon a:hover,
.reveal.neon .controls a.enabled {
.theme-neon .reveal a,
.theme-neon .reveal a:hover,
.theme-neon .reveal .controls a.enabled {
color: #5de048;
}
.reveal.neon .progress span,
.reveal.neon .roll span:after {
.theme-neon .reveal .progress span,
.theme-neon .reveal .roll span:after {
background: #5de048;
}
.reveal.neon a.image:hover img {
.theme-neon .reveal a.image:hover img {
border-color: #5de048;
}
/*********************************************
* BEIGE THEME
*********************************************/
.theme-beige body {
color: #333;
background: #f7f3de;
background: -moz-radial-gradient(center, ellipse cover, rgba(255,255,255,1) 0%, rgba(247,242,211,1) 100%);
background: -webkit-gradient(radial, center center, 0px, center center, 100%, color-stop(0%,rgba(255,255,255,1)), color-stop(100%,rgba(247,242,211,1)));
background: -webkit-radial-gradient(center, ellipse cover, rgba(255,255,255,1) 0%,rgba(247,242,211,1) 100%);
background: -o-radial-gradient(center, ellipse cover, rgba(255,255,255,1) 0%,rgba(247,242,211,1) 100%);
background: -ms-radial-gradient(center, ellipse cover, rgba(255,255,255,1) 0%,rgba(247,242,211,1) 100%);
background: radial-gradient(center, ellipse cover, rgba(255,255,255,1) 0%,rgba(247,242,211,1) 100%);
}
.theme-beige .reveal h1,
.theme-beige .reveal h2,
.theme-beige .reveal h3,
.theme-beige .reveal h4,
.theme-beige .reveal h5,
.theme-beige .reveal h6 {
color: #333;
text-shadow: none;
}
.theme-beige .reveal a,
.theme-beige .reveal a:hover,
.theme-beige .reveal .controls a.enabled {
color: #8b743d;
}
.theme-beige .reveal .progress span,
.theme-beige .reveal .roll span:after {
background: #8b743d;
}
.theme-beige .reveal a.image:hover img {
border-color: #8b743d;
}
/*********************************************
* OVERVIEW
*********************************************/

View file

@ -164,7 +164,7 @@
Additionally custom events can be triggered on a per slide basis by binding to the <code>data-state</code> name.
</p>
<pre><code contenteditable style="font-size: 18px; margin-top: 20px;">Reveal.addEventListener( 'customevent', function() {
alert( '"customevent" has fired' );
console.log( '"customevent" has fired' );
} );
</code></pre>
</section>
@ -271,7 +271,7 @@ function linkify( selector ) {
// Fires when a slide with data-state=customevent is activated
Reveal.addEventListener( 'customevent', function() {
alert( '"customevent" has fired' );
console.log( '"customevent" has fired' );
} );
// Fires each time a new slide is activated
@ -299,7 +299,7 @@ function linkify( selector ) {
rollingLinks: true,
// UI style
theme: query.theme || 'default', // default/neon
theme: query.theme || 'default', // default/neon/beige
// Transition style
transition: query.transition || 'default' // default/cube/page/concave/linear(2d)

View file

@ -139,7 +139,7 @@ var Reveal = (function(){
}
if( config.theme !== 'default' ) {
dom.wrapper.classList.add( config.theme );
document.documentElement.classList.add( 'theme-' + config.theme );
}
if( config.mouseWheel ) {