impress/app/assets/stylesheets/partials/_campaign-progress.sass
Matchu 15002d19db Remove compass-rails
I wasn't sure what we were actually using it for, turns out it was mostly polyfills for CSS features that are very standard now!

I didn't audit these changes very carefully tbqh because they seemed pretty simple? Fingers crossed!
2023-10-23 19:05:09 -07:00

60 lines
No EOL
1.6 KiB
Sass

// 2015 campaign blue
// $campaign-border-color: #006
// $campaign-background-color: #eef
// $campaign-text-color: #004
// $campaign-link-color: $campaign-text-color + #222
$campaign-border-color: hsl(310, 60%, 40%)
$campaign-background-color: hsl(310, 60%, 97%)
$campaign-text-color: hsl(310, 60%, 20%)
$campaign-link-color: $campaign-text-color + #222
=campaign-progress
.campaign-progress-wrapper
border-radius: 8px
background: desaturate(lighten($campaign-border-color, 30%), 30%)
background-image: linear-gradient(color-stops(desaturate(lighten($campaign-border-color, 50%), 30%), desaturate(lighten($campaign-border-color, 30%), 30%)))
border: 4px solid $campaign-border-color
clear: both
margin-bottom: 1em
margin-top: .5em
position: relative
.button
+awesome-button
+awesome-button-color(#004)
font-size: 75%
margin-left: 1em
padding: .25em .75em
.campaign-progress
background: $campaign-border-color
background-image: linear-gradient(color-stops($campaign-border-color + #222, $campaign-border-color))
border-right: 1px solid $campaign-border-color
.campaign-progress-wrapper, .campaign-progress
height: 2.5em
.campaign-progress-label
text-shadow: 1px 1px 0 $campaign-border-color
color: white
font-size: 150%
left: 0
position: absolute
top: 0
text-align: center
width: 100%
a
color: inherit
display: block
text-decoration: none
.button
position: relative
top: -2px /* lame hack to align well with text; sigh */
&.campaign-loaded
.campaign-progress-wrapper
visibility: visible