diff options
Diffstat (limited to 'theme/sass')
-rw-r--r-- | theme/sass/default.scss | 43 |
1 files changed, 36 insertions, 7 deletions
diff --git a/theme/sass/default.scss b/theme/sass/default.scss index f1088ba..647671e 100644 --- a/theme/sass/default.scss +++ b/theme/sass/default.scss | |||
@@ -165,6 +165,10 @@ slides > slide { | |||
165 | @include transform(translate3d($translateX * 2, 0, 0)); | 165 | @include transform(translate3d($translateX * 2, 0, 0)); |
166 | } | 166 | } |
167 | 167 | ||
168 | &.dark { | ||
169 | background: $gray-4; | ||
170 | } | ||
171 | |||
168 | hgroup + article { | 172 | hgroup + article { |
169 | margin-top: 1.5em; | 173 | margin-top: 1.5em; |
170 | } | 174 | } |
@@ -603,22 +607,38 @@ input, button { | |||
603 | 607 | ||
604 | /* ===== SLIDE CONTENT ===== */ | 608 | /* ===== SLIDE CONTENT ===== */ |
605 | .logoslide { | 609 | .logoslide { |
606 | &.dark { | ||
607 | background: $gray-4; | ||
608 | } | ||
609 | |||
610 | img { | 610 | img { |
611 | width: 383px; | 611 | width: 383px; |
612 | height: 92px; | 612 | height: 92px; |
613 | } | 613 | } |
614 | } | 614 | } |
615 | 615 | ||
616 | .segue { | ||
617 | h2 { | ||
618 | color: $gray-1; | ||
619 | font-size: 60px; | ||
620 | } | ||
621 | h3 { | ||
622 | color: $gray-1; | ||
623 | line-height: 2.8; | ||
624 | } | ||
625 | hgroup { | ||
626 | opacity: 0; | ||
627 | @include transition(opacity 0.6s ease-in 1s); | ||
628 | |||
629 | &.on { | ||
630 | opacity: 1; | ||
631 | } | ||
632 | } | ||
633 | } | ||
634 | |||
616 | .thank-you-slide { | 635 | .thank-you-slide { |
617 | background: $brand-blue; | 636 | background: $brand-blue; |
618 | color: white; | 637 | color: white; |
619 | 638 | ||
620 | h1 { | 639 | h2 { |
621 | font-size: 60px; | 640 | font-size: 60px; |
641 | color: inherit; | ||
622 | } | 642 | } |
623 | 643 | ||
624 | section > p { | 644 | section > p { |
@@ -644,7 +664,7 @@ aside.gdbar { | |||
644 | @include background(linear-gradient(left, $gray-1, $gray-1) no-repeat); | 664 | @include background(linear-gradient(left, $gray-1, $gray-1) no-repeat); |
645 | @include background-size(100% 100%); | 665 | @include background-size(100% 100%); |
646 | background-size: 100% 100%; | 666 | background-size: 100% 100%; |
647 | @include transition(all 0.5s ease-out 0.6s); /* Better to transition only on background-size, but not sure how to do that with the mixin. */ | 667 | @include 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. */ |
648 | 668 | ||
649 | &.to-build { | 669 | &.to-build { |
650 | background-size: 0 100%; | 670 | background-size: 0 100%; |
@@ -654,7 +674,7 @@ aside.gdbar { | |||
654 | right: 0; | 674 | right: 0; |
655 | left: -moz-initial; | 675 | left: -moz-initial; |
656 | left: initial; | 676 | left: initial; |
657 | top: ($slide-height / 2) - 96; /* 96 is height of gray icon bar */ | 677 | top: ($slide-height / 2) - 96 + 10; /* 96 is height of gray icon bar */ |
658 | @include transform(rotateZ(180deg)); | 678 | @include transform(rotateZ(180deg)); |
659 | 679 | ||
660 | img { | 680 | img { |
@@ -672,6 +692,7 @@ aside.gdbar { | |||
672 | } | 692 | } |
673 | 693 | ||
674 | #title-slide { | 694 | #title-slide { |
695 | |||
675 | hgroup { | 696 | hgroup { |
676 | position: absolute; | 697 | position: absolute; |
677 | bottom: 150px; | 698 | bottom: 150px; |
@@ -697,3 +718,11 @@ aside.gdbar { | |||
697 | } | 718 | } |
698 | } | 719 | } |
699 | } | 720 | } |
721 | |||
722 | #title-slide, .thank-you-slide, .segue { | ||
723 | padding: $slide-left-right-padding $slide-left-right-padding * 2; | ||
724 | |||
725 | aside { | ||
726 | width: 215px; | ||
727 | } | ||
728 | } | ||