impress/app/stylesheets/static/_donate.sass

142 lines
3.4 KiB
Sass

@import "compass/css3/gradient"
@import "compass/css3/text-shadow"
body.static-donate
#title
margin-bottom: 0
h2
font-style: italic
font-weight: normal
#title, h2
float: left
h2
margin-bottom: .25em
.pledgie-link
+awesome-button
+loud-awesome-button-color
#pledgie-link-with-title
float: right
font-size: 150%
margin-top: .5em
padding: .75em
#campaign-progress-wrapper
+border-radius(8px)
background: #aaa
+linear-gradient(color-stops(#ccc, #aaa))
border: 4px solid $module-border-color
clear: both
margin-bottom: 1.5em
position: relative
visibility: hidden
#campaign-progress
background: $module-border-color
+linear-gradient(color-stops($module-border-color + #222, $module-border-color))
border-right: 1px solid $module-border-color
#campaign-progress-wrapper, #campaign-progress
height: 2.5em
#campaign-progress-label
+text-shadow(#777, -1px, -1px, 0)
color: white
font-size: 150%
left: 0
position: absolute
top: 0
text-align: center
width: 100%
$image-mode-preview-image-width: 300px
$image-mode-preview-image-border-width: 1px
$image-mode-preview-h-padding: 20px
$image-mode-preview-border-width: 1px
$image-mode-preview-right-margin: 20px
$image-mode-preview-width: $image-mode-preview-image-width + 2 * ($image-mode-preview-image-border-width + $image-mode-preview-h-padding + $image-mode-preview-border-width)
$image-mode-preview-outer-width: $image-mode-preview-width + $image-mode-preview-right-margin
#image-mode-data
clear: both
display: block
float: left
margin-right: $image-mode-preview-right-margin
width: $image-mode-preview-width
#image-mode-preview
border: $image-mode-preview-border-width solid $module-border-color
margin: 0 0 2em 0
padding:
top: $image-mode-preview-h-padding
right: $image-mode-preview-h-padding
bottom: $image-mode-preview-h-padding / 1.5
left: $image-mode-preview-h-padding
img
border: $image-mode-preview-border-width solid $module-border-color
margin-bottom: .5em
figcaption
display: block
font-family: Calligraffitti
font-size: 250%
text-align: center
#campaign-donors
display: none
margin-right: $image-mode-preview-right-margin
width: $image-mode-preview-width
ol
font-size: 85%
padding-left: 2em
span
color: $soft-text-color
float: right
$image-mode-description-width: $container-width - $image-mode-preview-outer-width
$image-mode-beta-h-padding: 15px
$image-mode-beta-border-width: 1px
$image-mode-beta-inner-width: $image-mode-description-width - 2 * ($image-mode-beta-h-padding + $image-mode-beta-border-width)
#image-mode-beta
+module
border-width: $image-mode-beta-border-width
display: block
float: left
margin-bottom: 1em
padding: ($image-mode-beta-h-padding / 1.5) $image-mode-beta-h-padding
text-align: center
width: $image-mode-beta-inner-width
header
display: block
font-weight: bold
p
font-family: $main-font
font-size: 75%
margin: 0
.pledgie-link
margin: .75em 0
#image-mode-description, #image-mode-comments
float: left
width: $image-mode-description-width
&.campaign-loaded
#campaign-progress-wrapper
visibility: visible
#campaign-donors
display: block