diff options
Diffstat (limited to 'theme/sass')
-rw-r--r-- | theme/sass/default.scss | 54 |
1 files changed, 28 insertions, 26 deletions
diff --git a/theme/sass/default.scss b/theme/sass/default.scss index a5d9c69..fb1fb75 100644 --- a/theme/sass/default.scss +++ b/theme/sass/default.scss | |||
@@ -107,7 +107,7 @@ slides > slide { | |||
107 | 107 | ||
108 | @include border-radius($slide-border-radius); | 108 | @include border-radius($slide-border-radius); |
109 | //@include box-shadow(5px 5px 20px $gray-4); | 109 | //@include box-shadow(5px 5px 20px $gray-4); |
110 | @include transition(all 0.6s ease-out); | 110 | @include transition(all 0.6s ease-in-out); |
111 | 111 | ||
112 | //$translateX: 1020px; | 112 | //$translateX: 1020px; |
113 | //$rotateY: 30deg; | 113 | //$rotateY: 30deg; |
@@ -161,7 +161,7 @@ slides > slide { | |||
161 | background: $gray-4; | 161 | background: $gray-4; |
162 | } | 162 | } |
163 | 163 | ||
164 | &:not(.fill):not(.nobackground) { | 164 | &:not(.nobackground) { |
165 | //background: white url(../../images/google_developers_icon_128.png) ($brand-small-icon-size * 2) 98% no-repeat; | 165 | //background: white url(../../images/google_developers_icon_128.png) ($brand-small-icon-size * 2) 98% no-repeat; |
166 | //@include background-size($brand-small-icon-size $brand-small-icon-size); | 166 | //@include background-size($brand-small-icon-size $brand-small-icon-size); |
167 | 167 | ||
@@ -201,7 +201,7 @@ slides > slide { | |||
201 | } | 201 | } |
202 | 202 | ||
203 | &.backdrop { | 203 | &.backdrop { |
204 | z-index: -1; | 204 | z-index: -10; |
205 | display: block !important; | 205 | display: block !important; |
206 | @include background(linear-gradient(white, white 85%, $gray-1)); | 206 | @include background(linear-gradient(white, white 85%, $gray-1)); |
207 | background-color: white; | 207 | background-color: white; |
@@ -407,7 +407,7 @@ dt { | |||
407 | button { | 407 | button { |
408 | display: inline-block; | 408 | display: inline-block; |
409 | @include background(linear-gradient(#F9F9F9 40%, #E3E3E3 70%)); | 409 | @include background(linear-gradient(#F9F9F9 40%, #E3E3E3 70%)); |
410 | border: 1px solid #999; | 410 | border: 1px solid $gray-2; |
411 | @include border-radius(3px); | 411 | @include border-radius(3px); |
412 | padding: 5px 8px; | 412 | padding: 5px 8px; |
413 | outline: none; | 413 | outline: none; |
@@ -415,18 +415,21 @@ button { | |||
415 | @include user-select(none); | 415 | @include user-select(none); |
416 | cursor: pointer; | 416 | cursor: pointer; |
417 | @include text-shadow(1px 1px #fff); | 417 | @include text-shadow(1px 1px #fff); |
418 | font-weight: 700; | ||
419 | font-size: 10pt; | 418 | font-size: 10pt; |
420 | } | 419 | } |
421 | 420 | ||
422 | button:hover { | 421 | button:not(:disabled):hover { |
423 | border-color: black; | 422 | border-color: $gray-4; |
424 | } | 423 | } |
425 | 424 | ||
426 | button:active { | 425 | button:not(:disabled):active { |
427 | @include background(linear-gradient(#E3E3E3 40%, #F9F9F9 70%)); | 426 | @include background(linear-gradient(#E3E3E3 40%, #F9F9F9 70%)); |
428 | } | 427 | } |
429 | 428 | ||
429 | :disabled { | ||
430 | color: $gray-2; | ||
431 | } | ||
432 | |||
430 | .blue { | 433 | .blue { |
431 | color: $brand-blue; | 434 | color: $brand-blue; |
432 | } | 435 | } |
@@ -476,6 +479,13 @@ button:active { | |||
476 | color: $gray-4; | 479 | color: $gray-4; |
477 | } | 480 | } |
478 | 481 | ||
482 | .white { | ||
483 | color: white !important; | ||
484 | } | ||
485 | .black { | ||
486 | color: black !important; | ||
487 | } | ||
488 | |||
479 | .columns-2 { | 489 | .columns-2 { |
480 | @include column-count(2); | 490 | @include column-count(2); |
481 | } | 491 | } |
@@ -535,25 +545,9 @@ q { | |||
535 | } | 545 | } |
536 | 546 | ||
537 | slide.fill { | 547 | slide.fill { |
548 | background-repeat: no-repeat; | ||
538 | @include border-radius($slide-border-radius); | 549 | @include border-radius($slide-border-radius); |
539 | 550 | @include background-size(cover); | |
540 | h3 { | ||
541 | background: rgba(255, 255, 255, .75); | ||
542 | padding-top: .2em; | ||
543 | padding-bottom: .3em; | ||
544 | margin-top: -.2em; | ||
545 | margin-left: -60px; | ||
546 | padding-left: 60px; | ||
547 | margin-right: -60px; | ||
548 | padding-right: 60px; | ||
549 | } | ||
550 | |||
551 | h4 { | ||
552 | display: inline; | ||
553 | position: absolute; | ||
554 | bottom: 50px; | ||
555 | padding: 15px; | ||
556 | } | ||
557 | } | 551 | } |
558 | 552 | ||
559 | /* Size variants */ | 553 | /* Size variants */ |
@@ -673,6 +667,14 @@ article.smaller { | |||
673 | } | 667 | } |
674 | } | 668 | } |
675 | 669 | ||
670 | .source { | ||
671 | font-size: 14px; | ||
672 | color: $gray-2; | ||
673 | position: absolute; | ||
674 | bottom: $slide-top-bottom-padding + 30px; | ||
675 | left: $slide-left-right-padding; | ||
676 | } | ||
677 | |||
676 | input, button { | 678 | input, button { |
677 | vertical-align: middle; | 679 | vertical-align: middle; |
678 | } | 680 | } |