diff options
Diffstat (limited to 'deck.js/themes/style/web-2.0.scss')
| -rw-r--r-- | deck.js/themes/style/web-2.0.scss | 250 |
1 files changed, 250 insertions, 0 deletions
diff --git a/deck.js/themes/style/web-2.0.scss b/deck.js/themes/style/web-2.0.scss new file mode 100644 index 0000000..2b36fae --- /dev/null +++ b/deck.js/themes/style/web-2.0.scss @@ -0,0 +1,250 @@ +@mixin border-radius($r) { + -webkit-border-radius:$r; + -moz-border-radius:$r; + border-radius:$r; +} + +@mixin rotate($deg) { + -webkit-transform:rotate($deg); + -moz-transform:rotate($deg); + -ms-transform:rotate($deg); + -o-transform:rotate($deg); + transform:rotate($deg); +} + +@mixin box-shadow($x, $y, $blur, $color) { + -webkit-box-shadow:$x $y $blur $color; + -moz-box-shadow:$x $y $blur $color; + box-shadow:$x $y $blur $color; +} + + +.deck-container { + font-family: "Gill Sans", "Gill Sans MT", Calibri, sans-serif; + font-size:1.75em; + background: rgb(244,250,254); /* Old browsers */ + background: -moz-linear-gradient(top, rgba(244,250,254,1) 0%, rgba(204,240,240,1) 100%); /* FF3.6+ */ + 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+ */ + background: -webkit-linear-gradient(top, rgba(244,250,254,1) 0%,rgba(204,240,240,1) 100%); /* Chrome10+,Safari5.1+ */ + background: -o-linear-gradient(top, rgba(244,250,254,1) 0%,rgba(204,240,240,1) 100%); /* Opera11.10+ */ + background: -ms-linear-gradient(top, rgba(244,250,254,1) 0%,rgba(204,240,240,1) 100%); /* IE10+ */ + background: linear-gradient(top, rgba(244,250,254,1) 0%,rgba(204,240,240,1) 100%); /* W3C */ + background-attachment: fixed; + + > .slide { + text-shadow:1px 1px 1px rgba(255,255,255,.5); + + .deck-before, .deck-previous { + opacity:0.4; + + &:not(.deck-child-current) { + .deck-before, .deck-previous { + opacity:1; + } + } + } + + .deck-child-current { + opacity:1; + } + } + + .slide { + h1, h2, h3, h4, h5, h6 { + font-family: "Hoefler Text", Constantia, Palatino, "Palatino Linotype", "Book Antiqua", Georgia, serif; + } + + h1 { + color:#08455f; + } + + h2 { + color:#0b7495; + border-bottom:0; + + .cssreflections & { + line-height:1; + -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)); + -moz-box-reflect:below -0.5555em -moz-linear-gradient(top, transparent 0%, transparent 30%, rgba(255,255,255,.3) 100%); + } + } + + h3 { + color:#000; + } + + pre { + border-color:#cde; + background:#fff; + position:relative; + z-index:auto; + + .borderradius & { + @include border-radius(5px); + } + + /* http://nicolasgallagher.com/css-drop-shadows-without-images/ */ + .csstransforms.boxshadow & { + > :first-child:before { + content:""; + position:absolute; + z-index:-1; + background:#fff; + top:0; + bottom:0; + left:0; + right:0; + } + + &:before, &:after { + content:""; + position:absolute; + z-index:-2; + bottom:15px; + width:50%; + height:20%; + max-width:300px; + @include box-shadow(0, 15px, 10px, rgba(0, 0, 0, 0.7)); + } + + &:before { + left:10px; + @include rotate(-3deg); + } + + &:after { + right:10px; + @include rotate(3deg); + } + } + } + + code { + color:#789; + } + + blockquote { + font-family: "Hoefler Text", Constantia, Palatino, "Palatino Linotype", "Book Antiqua", Georgia, serif; + font-size:2em; + padding:1em 2em .5em 2em; + color:#000; + background:#fff; + position:relative; + border:1px solid #cde; + z-index:auto; + + .borderradius & { + @include border-radius(5px); + } + + .boxshadow & { + > :first-child:before { + content:""; + position:absolute; + z-index:-1; + background:#fff; + top:0; + bottom:0; + left:0; + right:0; + } + + &:after { + content:""; + position:absolute; + z-index:-2; + top: 10px; + bottom: 10px; + left: 0; + right: 50%; + -moz-border-radius: 10px / 100px; + border-radius: 10px / 100px; + @include box-shadow(0, 0, 15px, rgba(0,0,0,0.6)); + } + } + + p { + margin:0; + } + + cite { + font-size:.5em; + font-style:normal; + font-weight:bold; + color:#888; + } + + &:before { + content:"“"; + position:absolute; + top:0; + left:0; + font-size:5em; + line-height:1; + color:#ccf0f0; + z-index:1; + } + } + + ::-moz-selection{ background:#08455f; color:#fff; } + ::selection { background:#08455f; color:#fff; } + + a { + &, &:hover, &:focus, &:active, &:visited { + color:#599; + text-decoration:none; + } + + &:hover, &:focus { + text-decoration:underline; + } + } + } + + .deck-prev-link, .deck-next-link { + background:#fff; + opacity:0.5; + + &, &:hover, &:focus, &:active, &:visited { + color:#599; + } + + &:hover, &:focus { + opacity:1; + text-decoration:none; + } + } + + .deck-status { + font-size:0.6666em; + } + + &.deck-menu { + .slide { + background:transparent; + @include border-radius(5px); + + .rgba & { + background:rgba(0,0,0,.1); + } + + &.deck-current, .rgba &.deck-current, .no-touch &:hover { + background:#fff; + } + } + } + + .goto-form { + background:#fff; + border:1px solid #cde; + @include border-radius(5px); + + .boxshadow & { + -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; + -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; + 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; + } + } +} + + |