From 6c5f4961caa11c682508eb511bf7c1ed505567e5 Mon Sep 17 00:00:00 2001 From: Eric Bidelman Date: Sun, 22 Apr 2012 10:31:40 -0700 Subject: image compress. reflect/center/more flexbox classes --- theme/css/default.css | 299 ++++++++++++++++++++++++++---------------------- theme/scss/_base.scss | 6 + theme/scss/default.scss | 16 ++- 3 files changed, 182 insertions(+), 139 deletions(-) (limited to 'theme') diff --git a/theme/css/default.css b/theme/css/default.css index 722620f..7cfbdb1 100644 --- a/theme/css/default.css +++ b/theme/css/default.css @@ -66,13 +66,13 @@ article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, /** * Base SlideDeck Styles */ -/* line 42, ../scss/_base.scss */ +/* line 48, ../scss/_base.scss */ html { height: 100%; overflow: hidden; } -/* line 47, ../scss/_base.scss */ +/* line 53, ../scss/_base.scss */ body { margin: 0; padding: 0; @@ -92,22 +92,22 @@ body { -o-transition: opacity 800ms ease-in 100ms; transition: opacity 800ms ease-in 100ms; } -/* line 63, ../scss/_base.scss */ +/* line 69, ../scss/_base.scss */ body.loaded { opacity: 1; } -/* line 68, ../scss/_base.scss */ +/* line 74, ../scss/_base.scss */ input, button { vertical-align: middle; } -/* line 72, ../scss/_base.scss */ +/* line 78, ../scss/_base.scss */ slides > slide[hidden] { display: none !important; } -/* line 76, ../scss/_base.scss */ +/* line 82, ../scss/_base.scss */ slides { width: 100%; height: 100%; @@ -125,7 +125,7 @@ slides { transform-style: preserve-3d; } -/* line 87, ../scss/_base.scss */ +/* line 93, ../scss/_base.scss */ slides > slide { display: block; position: absolute; @@ -346,31 +346,35 @@ slides > slide.backdrop:after, slides > slide.backdrop:before { slides > slide > hgroup + article { margin-top: 45px; } -/* line 213, ../scss/default.scss */ +/* line 214, ../scss/default.scss */ +slides > slide > hgroup + article.flexbox.vcenter, slides > slide > hgroup + article.flexbox.vleft, slides > slide > hgroup + article.flexbox.vright { + height: 80%; +} +/* line 219, ../scss/default.scss */ slides > slide > hgroup + article p { margin-bottom: 1em; } -/* line 218, ../scss/default.scss */ +/* line 224, ../scss/default.scss */ slides > slide > article:only-child { height: 100%; } -/* line 221, ../scss/default.scss */ +/* line 227, ../scss/default.scss */ slides > slide > article:only-child > iframe { height: 100%; } -/* line 227, ../scss/default.scss */ +/* line 233, ../scss/default.scss */ slides.layout-faux-widescreen > slide { padding: 40px 160px; } -/* line 236, ../scss/default.scss */ +/* line 242, ../scss/default.scss */ slides.layout-widescreen > slide, slides.layout-faux-widescreen > slide { margin-left: -550px; width: 1100px; } -/* line 241, ../scss/default.scss */ +/* line 247, ../scss/default.scss */ slides.layout-widescreen > slide.far-past, slides.layout-faux-widescreen > slide.far-past { display: block; @@ -386,26 +390,26 @@ slides.layout-faux-widescreen > slide.far-past { -o-transform: translate3d(-2260px, 0, 0); transform: translate3d(-2260px, 0, 0); } -/* line 248, ../scss/default.scss */ +/* line 254, ../scss/default.scss */ slides.layout-widescreen > slide.past, slides.layout-faux-widescreen > slide.past { display: block; opacity: 0; } -/* line 255, ../scss/default.scss */ +/* line 261, ../scss/default.scss */ slides.layout-widescreen > slide.current, slides.layout-faux-widescreen > slide.current { display: block; opacity: 1; } -/* line 262, ../scss/default.scss */ +/* line 268, ../scss/default.scss */ slides.layout-widescreen > slide.next, slides.layout-faux-widescreen > slide.next { display: block; opacity: 0; pointer-events: none; } -/* line 270, ../scss/default.scss */ +/* line 276, ../scss/default.scss */ slides.layout-widescreen > slide.far-next, slides.layout-faux-widescreen > slide.far-next { display: block; @@ -421,39 +425,39 @@ slides.layout-faux-widescreen > slide.far-next { -o-transform: translate3d(2260px, 0, 0); transform: translate3d(2260px, 0, 0); } -/* line 277, ../scss/default.scss */ +/* line 283, ../scss/default.scss */ slides.layout-widescreen #prev-slide-area, slides.layout-faux-widescreen #prev-slide-area { margin-left: -650px; } -/* line 281, ../scss/default.scss */ +/* line 287, ../scss/default.scss */ slides.layout-widescreen #next-slide-area, slides.layout-faux-widescreen #next-slide-area { margin-left: 550px; } -/* line 286, ../scss/default.scss */ +/* line 292, ../scss/default.scss */ b { font-weight: 600; } -/* line 290, ../scss/default.scss */ +/* line 296, ../scss/default.scss */ a { color: #2a7cdf; text-decoration: none; border-bottom: 1px solid rgba(42, 124, 223, 0.5); } -/* line 295, ../scss/default.scss */ +/* line 301, ../scss/default.scss */ a:hover { color: black !important; } -/* line 300, ../scss/default.scss */ +/* line 306, ../scss/default.scss */ h1, h2, h3 { font-weight: 600; } -/* line 304, ../scss/default.scss */ +/* line 310, ../scss/default.scss */ h2 { font-size: 45px; line-height: 45px; @@ -461,7 +465,7 @@ h2 { color: #515151; } -/* line 311, ../scss/default.scss */ +/* line 317, ../scss/default.scss */ h3 { font-size: 30px; letter-spacing: -1px; @@ -470,39 +474,39 @@ h3 { color: #797979; } -/* line 319, ../scss/default.scss */ +/* line 325, ../scss/default.scss */ ul { margin-left: 1.2em; margin-bottom: 1em; position: relative; } -/* line 324, ../scss/default.scss */ +/* line 330, ../scss/default.scss */ ul li { margin-bottom: 0.5em; } -/* line 327, ../scss/default.scss */ +/* line 333, ../scss/default.scss */ ul li ul { margin-left: 2em; margin-bottom: 0; } -/* line 331, ../scss/default.scss */ +/* line 337, ../scss/default.scss */ ul li ul li:before { content: '-'; font-weight: 600; } -/* line 338, ../scss/default.scss */ +/* line 344, ../scss/default.scss */ ul > li:before { content: '·'; margin-left: -1em; position: absolute; font-weight: 600; } -/* line 345, ../scss/default.scss */ +/* line 351, ../scss/default.scss */ ul ul { margin-top: .5em; } -/* line 352, ../scss/default.scss */ +/* line 358, ../scss/default.scss */ .highlight-code slide.current pre > * { opacity: 0.25; -webkit-transition: opacity 0.5s ease-in; @@ -511,12 +515,12 @@ ul ul { -o-transition: opacity 0.5s ease-in; transition: opacity 0.5s ease-in; } -/* line 356, ../scss/default.scss */ +/* line 362, ../scss/default.scss */ .highlight-code slide.current b { opacity: 1; } -/* line 361, ../scss/default.scss */ +/* line 367, ../scss/default.scss */ pre { font-family: 'Inconsolata', 'Courier New', monospace; font-size: 20px; @@ -533,7 +537,7 @@ pre { box-sizing: border-box; /*overflow: hidden;*/ } -/* line 375, ../scss/default.scss */ +/* line 381, ../scss/default.scss */ pre:after { content: attr(data-lang); background-color: #a9a9a9; @@ -546,14 +550,14 @@ pre:after { text-transform: uppercase; } -/* line 388, ../scss/default.scss */ +/* line 394, ../scss/default.scss */ code { font-size: 95%; font-family: 'Inconsolata', 'Courier New', monospace; color: black; } -/* line 394, ../scss/default.scss */ +/* line 400, ../scss/default.scss */ iframe { width: 100%; height: 530px; @@ -564,12 +568,12 @@ iframe { box-sizing: border-box; } -/* line 402, ../scss/default.scss */ +/* line 408, ../scss/default.scss */ dt { font-weight: bold; } -/* line 406, ../scss/default.scss */ +/* line 412, ../scss/default.scss */ button { display: inline-block; background: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(40%, #f9f9f9), color-stop(70%, #e3e3e3)); @@ -595,12 +599,12 @@ button { font-size: 10pt; } -/* line 420, ../scss/default.scss */ +/* line 426, ../scss/default.scss */ button:not(:disabled):hover { border-color: #515151; } -/* line 424, ../scss/default.scss */ +/* line 430, ../scss/default.scss */ button:not(:disabled):active { background: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(40%, #e3e3e3), color-stop(70%, #f9f9f9)); background: -webkit-linear-gradient(#e3e3e3 40%, #f9f9f9 70%); @@ -610,102 +614,102 @@ button:not(:disabled):active { background: linear-gradient(#e3e3e3 40%, #f9f9f9 70%); } -/* line 428, ../scss/default.scss */ +/* line 434, ../scss/default.scss */ :disabled { color: #a9a9a9; } -/* line 432, ../scss/default.scss */ +/* line 438, ../scss/default.scss */ .blue { color: #4387fd; } -/* line 435, ../scss/default.scss */ +/* line 441, ../scss/default.scss */ .blue2 { color: #3c8ef3; } -/* line 438, ../scss/default.scss */ +/* line 444, ../scss/default.scss */ .blue3 { color: #2a7cdf; } -/* line 441, ../scss/default.scss */ +/* line 447, ../scss/default.scss */ .yellow { color: #ffd14d; } -/* line 444, ../scss/default.scss */ +/* line 450, ../scss/default.scss */ .yellow2 { color: #f9cc46; } -/* line 447, ../scss/default.scss */ +/* line 453, ../scss/default.scss */ .yellow3 { color: #f6c000; } -/* line 450, ../scss/default.scss */ +/* line 456, ../scss/default.scss */ .green { color: #0da861; } -/* line 453, ../scss/default.scss */ +/* line 459, ../scss/default.scss */ .green2 { color: #00a86d; } -/* line 456, ../scss/default.scss */ +/* line 462, ../scss/default.scss */ .green3 { color: #009f5d; } -/* line 459, ../scss/default.scss */ +/* line 465, ../scss/default.scss */ .red { color: #f44a3f; } -/* line 462, ../scss/default.scss */ +/* line 468, ../scss/default.scss */ .red2 { color: #e0543e; } -/* line 465, ../scss/default.scss */ +/* line 471, ../scss/default.scss */ .red3 { color: #d94d3a; } -/* line 468, ../scss/default.scss */ +/* line 474, ../scss/default.scss */ .gray { color: #e6e6e6; } -/* line 471, ../scss/default.scss */ +/* line 477, ../scss/default.scss */ .gray2 { color: #a9a9a9; } -/* line 474, ../scss/default.scss */ +/* line 480, ../scss/default.scss */ .gray3 { color: #797979; } -/* line 477, ../scss/default.scss */ +/* line 483, ../scss/default.scss */ .gray4 { color: #515151; } -/* line 481, ../scss/default.scss */ +/* line 487, ../scss/default.scss */ .white { color: white !important; } -/* line 484, ../scss/default.scss */ +/* line 490, ../scss/default.scss */ .black { color: black !important; } -/* line 488, ../scss/default.scss */ +/* line 494, ../scss/default.scss */ .columns-2 { -webkit-column-count: 2; -moz-column-count: 2; @@ -713,7 +717,7 @@ button:not(:disabled):active { column-count: 2; } -/* line 492, ../scss/default.scss */ +/* line 498, ../scss/default.scss */ table { width: 100%; border-collapse: -moz-initial; @@ -721,16 +725,16 @@ table { border-spacing: 2px; border-bottom: 1px solid #797979; } -/* line 499, ../scss/default.scss */ +/* line 505, ../scss/default.scss */ table tr > td:first-child, table th { font-weight: 600; color: #515151; } -/* line 504, ../scss/default.scss */ +/* line 510, ../scss/default.scss */ table tr:nth-child(odd) { background-color: #e6e6e6; } -/* line 508, ../scss/default.scss */ +/* line 514, ../scss/default.scss */ table th { color: white; font-size: 18px; @@ -741,12 +745,12 @@ table th { background: -ms-linear-gradient(top, #4387fd 40%, #2a7cdf 80%) no-repeat; background: linear-gradient(top, #4387fd 40%, #2a7cdf 80%) no-repeat; } -/* line 514, ../scss/default.scss */ +/* line 520, ../scss/default.scss */ table td, table th { font-size: 18px; padding: 1em 0.5em; } -/* line 519, ../scss/default.scss */ +/* line 525, ../scss/default.scss */ table td.highlight { color: #515151; background: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(40%, #ffd14d), color-stop(80%, #f6c000)) no-repeat; @@ -756,31 +760,31 @@ table td.highlight { background: -ms-linear-gradient(top, #ffd14d 40%, #f6c000 80%) no-repeat; background: linear-gradient(top, #ffd14d 40%, #f6c000 80%) no-repeat; } -/* line 524, ../scss/default.scss */ +/* line 530, ../scss/default.scss */ table.rows { border-bottom: none; border-right: 1px solid #797979; } -/* line 530, ../scss/default.scss */ +/* line 536, ../scss/default.scss */ q { font-size: 45px; line-height: 72px; } -/* line 534, ../scss/default.scss */ +/* line 540, ../scss/default.scss */ q:before { content: '“'; position: absolute; margin-left: -0.5em; } -/* line 539, ../scss/default.scss */ +/* line 545, ../scss/default.scss */ q:after { content: '”'; position: absolute; margin-left: 0.1em; } -/* line 546, ../scss/default.scss */ +/* line 552, ../scss/default.scss */ slide.fill { background-repeat: no-repeat; -webkit-border-radius: 5px; @@ -795,34 +799,34 @@ slide.fill { } /* Size variants */ -/* line 555, ../scss/default.scss */ +/* line 561, ../scss/default.scss */ article.smaller p, article.smaller ul { font-size: 20px; line-height: 24px; letter-spacing: 0; } -/* line 561, ../scss/default.scss */ +/* line 567, ../scss/default.scss */ article.smaller table td, article.smaller table th { font-size: 14px; } -/* line 565, ../scss/default.scss */ +/* line 571, ../scss/default.scss */ article.smaller pre { font-size: 15px; line-height: 20px; letter-spacing: 0; } -/* line 570, ../scss/default.scss */ +/* line 576, ../scss/default.scss */ article.smaller q { font-size: 40px; line-height: 48px; } -/* line 574, ../scss/default.scss */ +/* line 580, ../scss/default.scss */ article.smaller q:before, article.smaller q:after { font-size: 60px; } /* Builds */ -/* line 583, ../scss/default.scss */ +/* line 589, ../scss/default.scss */ .build > * { -webkit-transition: opacity 0.5s ease-in-out 0.2s; -moz-transition: opacity 0.5s ease-in-out 0.2s; @@ -830,55 +834,55 @@ article.smaller q:before, article.smaller q:after { -o-transition: opacity 0.5s ease-in-out 0.2s; transition: opacity 0.5s ease-in-out 0.2s; } -/* line 587, ../scss/default.scss */ +/* line 593, ../scss/default.scss */ .build .to-build { opacity: 0; } -/* line 591, ../scss/default.scss */ +/* line 597, ../scss/default.scss */ .build .build-fade { opacity: 0.3; } -/* line 594, ../scss/default.scss */ +/* line 600, ../scss/default.scss */ .build .build-fade:hover { opacity: 1.0; } /* Pretty print */ -/* line 603, ../scss/default.scss */ +/* line 609, ../scss/default.scss */ .prettyprint .str, .prettyprint .atv { /* a markup attribute value */ color: #009f5d; } -/* line 607, ../scss/default.scss */ +/* line 613, ../scss/default.scss */ .prettyprint .kwd, .prettyprint .tag { /* a markup tag name */ color: #0066cc; } -/* line 610, ../scss/default.scss */ +/* line 616, ../scss/default.scss */ .prettyprint .com { /* a comment */ color: #797979; font-style: italic; } -/* line 614, ../scss/default.scss */ +/* line 620, ../scss/default.scss */ .prettyprint .lit { /* a literal value */ color: #7f0000; } -/* line 619, ../scss/default.scss */ +/* line 625, ../scss/default.scss */ .prettyprint .pun, .prettyprint .opn, .prettyprint .clo { color: #515151; } -/* line 625, ../scss/default.scss */ +/* line 631, ../scss/default.scss */ .prettyprint .typ, .prettyprint .atn, .prettyprint .dec, @@ -887,12 +891,12 @@ article.smaller q:before, article.smaller q:after { color: #d94d3a; } -/* line 628, ../scss/default.scss */ +/* line 634, ../scss/default.scss */ .prettyprint .pln { color: #515151; } -/* line 632, ../scss/default.scss */ +/* line 638, ../scss/default.scss */ .note { position: absolute; z-index: 100; @@ -940,7 +944,7 @@ article.smaller q:before, article.smaller q:after { -o-transition: all 0.4s ease-in-out; transition: all 0.4s ease-in-out; } -/* line 650, ../scss/default.scss */ +/* line 656, ../scss/default.scss */ .note > section { background: #fff; -webkit-border-radius: 5px; @@ -955,7 +959,7 @@ article.smaller q:before, article.smaller q:after { padding: 2em; } -/* line 667, ../scss/default.scss */ +/* line 673, ../scss/default.scss */ .with-notes.popup slides.layout-widescreen slide.next, .with-notes.popup slides.layout-faux-widescreen slide.next { -webkit-transform: translate3d(690px, 80px, 0) scale(0.35); @@ -964,7 +968,7 @@ article.smaller q:before, article.smaller q:after { -o-transform: translate3d(690px, 80px, 0) scale(0.35); transform: translate3d(690px, 80px, 0) scale(0.35); } -/* line 670, ../scss/default.scss */ +/* line 676, ../scss/default.scss */ .with-notes.popup slides.layout-widescreen slide .note, .with-notes.popup slides.layout-faux-widescreen slide .note { -webkit-transform: translate3d(300px, 800px, 0) scale(1.5); @@ -973,7 +977,7 @@ article.smaller q:before, article.smaller q:after { -o-transform: translate3d(300px, 800px, 0) scale(1.5); transform: translate3d(300px, 800px, 0) scale(1.5); } -/* line 676, ../scss/default.scss */ +/* line 682, ../scss/default.scss */ .with-notes.popup slide { overflow: visible; background: white; @@ -989,7 +993,7 @@ article.smaller q:before, article.smaller q:after { -o-transform-origin: 0 0; transform-origin: 0 0; } -/* line 683, ../scss/default.scss */ +/* line 689, ../scss/default.scss */ .with-notes.popup slide:not(.backdrop) { -webkit-transform: scale(0.6) translate3d(0.5em, 0.5em, 0); -moz-transform: scale(0.6) translate3d(0.5em, 0.5em, 0); @@ -1000,7 +1004,7 @@ article.smaller q:before, article.smaller q:after { -moz-box-shadow: 0 0 10px #797979; box-shadow: 0 0 10px #797979; } -/* line 688, ../scss/default.scss */ +/* line 694, ../scss/default.scss */ .with-notes.popup slide.backdrop { background-image: -webkit-gradient(radial, 50% 50%, 0, 50% 50%, 600, color-stop(0%, #b1dfff), color-stop(100%, #4387fd)); background-image: -webkit-radial-gradient(50% 50%, #b1dfff 0%, #4387fd 600px); @@ -1009,7 +1013,7 @@ article.smaller q:before, article.smaller q:after { background-image: -ms-radial-gradient(50% 50%, #b1dfff 0%, #4387fd 600px); background-image: radial-gradient(50% 50%, #b1dfff 0%, #4387fd 600px); } -/* line 694, ../scss/default.scss */ +/* line 700, ../scss/default.scss */ .with-notes.popup slide.next { -webkit-transform: translate3d(570px, 80px, 0) scale(0.35); -moz-transform: translate3d(570px, 80px, 0) scale(0.35); @@ -1018,11 +1022,11 @@ article.smaller q:before, article.smaller q:after { transform: translate3d(570px, 80px, 0) scale(0.35); opacity: 1 !important; } -/* line 698, ../scss/default.scss */ +/* line 704, ../scss/default.scss */ .with-notes.popup slide.next .note { display: none !important; } -/* line 704, ../scss/default.scss */ +/* line 710, ../scss/default.scss */ .with-notes.popup .note { width: 109%; height: 260px; @@ -1042,7 +1046,7 @@ article.smaller q:before, article.smaller q:after { -o-transition: opacity 400ms ease-in-out; transition: opacity 400ms ease-in-out; } -/* line 715, ../scss/default.scss */ +/* line 721, ../scss/default.scss */ .with-notes.popup .note > section { background: #fff; -webkit-border-radius: 5px; @@ -1061,7 +1065,7 @@ article.smaller q:before, article.smaller q:after { overflow: auto; padding: 1em; } -/* line 728, ../scss/default.scss */ +/* line 734, ../scss/default.scss */ .with-notes .note { opacity: 1; -webkit-transform: translateY(0); @@ -1072,7 +1076,7 @@ article.smaller q:before, article.smaller q:after { pointer-events: auto; } -/* line 735, ../scss/default.scss */ +/* line 741, ../scss/default.scss */ .source { font-size: 14px; color: #a9a9a9; @@ -1081,18 +1085,21 @@ article.smaller q:before, article.smaller q:after { left: 60px; } -/*.centered { +/* line 749, ../scss/default.scss */ +.centered { text-align: center; } +/* line 753, ../scss/default.scss */ .reflect { - -webkit-box-reflect: below 3px -webkit-linear-gradient(rgba(255,255,255,0) 85%, white 150%); - -moz-box-reflect: below 3px -moz-linear-gradient(rgba(255,255,255,0) 85%, white 150%); - -o-box-reflect: below 3px -o-linear-gradient(rgba(255,255,255,0) 85%, white 150%); - -ms-box-reflect: below 3px -ms-linear-gradient(rgba(255,255,255,0) 85%, white 150%); - box-reflect: below 3px linear-gradient(rgba(255,255,255,0) 85%, white 150%); -}*/ -/* line 755, ../scss/default.scss */ + -webkit-box-reflect: below 3px -webkit-linear-gradient(rgba(255, 255, 255, 0) 85%, white 150%); + -moz-box-reflect: below 3px -moz-linear-gradient(rgba(255, 255, 255, 0) 85%, white 150%); + -o-box-reflect: below 3px -o-linear-gradient(rgba(255, 255, 255, 0) 85%, white 150%); + -ms-box-reflect: below 3px -ms-linear-gradient(rgba(255, 255, 255, 0) 85%, white 150%); + box-reflect: below 3px linear-gradient(rgba(255, 255, 255, 0) 85%, #ffffff 150%); +} + +/* line 761, ../scss/default.scss */ .flexbox { display: -webkit-box !important; display: -moz-box !important; @@ -1101,7 +1108,7 @@ article.smaller q:before, article.smaller q:after { display: box !important; } -/* line 759, ../scss/default.scss */ +/* line 765, ../scss/default.scss */ .flexbox.vcenter { -webkit-box-orient: vertical; -moz-box-orient: vertical; @@ -1119,7 +1126,7 @@ article.smaller q:before, article.smaller q:after { width: 100%; } -/* line 765, ../scss/default.scss */ +/* line 771, ../scss/default.scss */ .flexbox.vleft { -webkit-box-orient: vertical; -moz-box-orient: vertical; @@ -1137,7 +1144,25 @@ article.smaller q:before, article.smaller q:after { width: 100%; } -/* line 771, ../scss/default.scss */ +/* line 777, ../scss/default.scss */ +.flexbox.vright { + -webkit-box-orient: vertical; + -moz-box-orient: vertical; + -ms-box-orient: vertical; + box-orient: vertical; + -webkit-box-align: end; + -moz-box-align: end; + -ms-box-align: end; + box-align: end; + -webkit-box-pack: center; + -moz-box-pack: center; + -ms-box-pack: center; + box-pack: center; + height: 100%; + width: 100%; +} + +/* line 783, ../scss/default.scss */ .auto-fadein { -webkit-transition: opacity 0.6s ease-in 1s; -moz-transition: opacity 0.6s ease-in 1s; @@ -1148,7 +1173,7 @@ article.smaller q:before, article.smaller q:after { } /* Clickable/tappable areas */ -/* line 777, ../scss/default.scss */ +/* line 789, ../scss/default.scss */ .slide-area { z-index: 1000; position: absolute; @@ -1162,59 +1187,59 @@ article.smaller q:before, article.smaller q:after { margin-top: -350px; } -/* line 794, ../scss/default.scss */ +/* line 806, ../scss/default.scss */ #prev-slide-area { margin-left: -550px; } -/* line 799, ../scss/default.scss */ +/* line 811, ../scss/default.scss */ #next-slide-area { margin-left: 450px; } /* ===== SLIDE CONTENT ===== */ -/* line 807, ../scss/default.scss */ +/* line 819, ../scss/default.scss */ .logoslide img { width: 383px; height: 92px; } -/* line 813, ../scss/default.scss */ +/* line 825, ../scss/default.scss */ .segue { padding: 60px 120px; } -/* line 816, ../scss/default.scss */ +/* line 828, ../scss/default.scss */ .segue h2 { color: #e6e6e6; font-size: 60px; } -/* line 820, ../scss/default.scss */ +/* line 832, ../scss/default.scss */ .segue h3 { color: #e6e6e6; line-height: 2.8; } -/* line 824, ../scss/default.scss */ +/* line 836, ../scss/default.scss */ .segue hgroup { position: absolute; bottom: 225px; } -/* line 830, ../scss/default.scss */ +/* line 842, ../scss/default.scss */ .thank-you-slide { background: #4387fd !important; color: white; } -/* line 834, ../scss/default.scss */ +/* line 846, ../scss/default.scss */ .thank-you-slide h2 { font-size: 60px; color: inherit; } -/* line 839, ../scss/default.scss */ +/* line 851, ../scss/default.scss */ .thank-you-slide article > p { margin-top: 2em; font-size: 20pt; } -/* line 844, ../scss/default.scss */ +/* line 856, ../scss/default.scss */ .thank-you-slide > p { position: absolute; bottom: 80px; @@ -1222,7 +1247,7 @@ article.smaller q:before, article.smaller q:after { line-height: 1.3; } -/* line 852, ../scss/default.scss */ +/* line 864, ../scss/default.scss */ aside.gdbar { height: 97px; width: 215px; @@ -1251,7 +1276,7 @@ aside.gdbar { transition: all 0.5s ease-out 0.5s; /* Better to transition only on background-size, but not sure how to do that with the mixin. */ } -/* line 863, ../scss/default.scss */ +/* line 875, ../scss/default.scss */ aside.gdbar.right { right: 0; left: -moz-initial; @@ -1264,7 +1289,7 @@ aside.gdbar.right { -o-transform: rotateZ(180deg); transform: rotateZ(180deg); } -/* line 870, ../scss/default.scss */ +/* line 882, ../scss/default.scss */ aside.gdbar.right img { -webkit-transform: rotateZ(180deg); -moz-transform: rotateZ(180deg); @@ -1272,13 +1297,13 @@ aside.gdbar.right img { -o-transform: rotateZ(180deg); transform: rotateZ(180deg); } -/* line 875, ../scss/default.scss */ +/* line 887, ../scss/default.scss */ aside.gdbar.bottom { top: -moz-initial; top: initial; bottom: 60px; } -/* line 881, ../scss/default.scss */ +/* line 893, ../scss/default.scss */ aside.gdbar img { width: 85px; height: 85px; @@ -1287,24 +1312,24 @@ aside.gdbar img { margin: 8px 15px; } -/* line 892, ../scss/default.scss */ +/* line 904, ../scss/default.scss */ .title-slide hgroup { bottom: 100px; } -/* line 895, ../scss/default.scss */ +/* line 907, ../scss/default.scss */ .title-slide hgroup h1 { font-size: 65px; line-height: 1.4; letter-spacing: -3px; color: #515151; } -/* line 902, ../scss/default.scss */ +/* line 914, ../scss/default.scss */ .title-slide hgroup h2 { font-size: 34px; color: #a9a9a9; font-weight: inherit; } -/* line 908, ../scss/default.scss */ +/* line 920, ../scss/default.scss */ .title-slide hgroup p { font-size: 20px; color: #797979; @@ -1312,11 +1337,11 @@ aside.gdbar img { margin-top: 2em; } -/* line 917, ../scss/default.scss */ +/* line 929, ../scss/default.scss */ .quote { color: #e6e6e6; } -/* line 920, ../scss/default.scss */ +/* line 932, ../scss/default.scss */ .quote .author { font-size: 24px; position: absolute; @@ -1324,12 +1349,12 @@ aside.gdbar img { line-height: 1.4; } -/* line 929, ../scss/default.scss */ +/* line 941, ../scss/default.scss */ [data-config-contact] a { color: white; border-bottom: none; } -/* line 933, ../scss/default.scss */ +/* line 945, ../scss/default.scss */ [data-config-contact] span { width: 115px; display: inline-block; diff --git a/theme/scss/_base.scss b/theme/scss/_base.scss index a3b00a8..ce9ee06 100644 --- a/theme/scss/_base.scss +++ b/theme/scss/_base.scss @@ -36,6 +36,12 @@ @include box-pack(center); } +@mixin flex-right-center { + @include box-orient(vertical); + @include box-align(end); + @include box-pack(center); +} + /** * Base SlideDeck Styles */ diff --git a/theme/scss/default.scss b/theme/scss/default.scss index 0cc6e47..df96778 100644 --- a/theme/scss/default.scss +++ b/theme/scss/default.scss @@ -210,6 +210,12 @@ slides > slide { > hgroup + article { margin-top: $article-content-top-padding; + &.flexbox { + &.vcenter, &.vleft, &.vright { + height: 80%; + } + } + p { margin-bottom: 1em; } @@ -740,7 +746,7 @@ article.smaller { left: $slide-left-right-padding; } -/*.centered { +.centered { text-align: center; } @@ -750,7 +756,7 @@ article.smaller { -o-box-reflect: below 3px -o-linear-gradient(rgba(255,255,255,0) 85%, white 150%); -ms-box-reflect: below 3px -ms-linear-gradient(rgba(255,255,255,0) 85%, white 150%); box-reflect: below 3px linear-gradient(rgba(255,255,255,0) 85%, white 150%); -}*/ +} .flexbox { @include flexbox; @@ -768,6 +774,12 @@ article.smaller { width: 100%; } +.flexbox.vright { + @include flex-right-center; + height: 100%; + width: 100%; +} + .auto-fadein { @include transition(opacity 0.6s ease-in 1s); opacity: 0; -- cgit v1.2.3