habitica/public/css/alerts.styl

102 lines
No EOL
1.9 KiB
Stylus

.new-stuff
position: fixed
text-align: center
top: 0
left: 0
width: 100%
height: 0
z-index: 1010
.new-stuff> .alert
border-top: 0
border-radius: 0 0 4px 4px
padding-right: 14px
display: inline-block
.wide-popover
max-width: 400px
// variables
gpColor = #FBEFC0
gpText = #786938
hpColor = #f2dede
hpText = #b94a48
lvlColor = #d9edf7
lvlText = #3a87ad
xpColor = #DCC0FB
xpText = #635673
deathColor = #4E4E4E
deathText = #ABABAB
mpColor = #c7d3e9
mpText = #003aa1
critColor = #ffe3bf
critText = #dc5000
borderDarken = 20%
// alert styles
.alert-gp
background-color: gpColor
border-color: darken(gpColor,borderDarken)
color: gpText
.alert-hp
background-color: hpColor
border-color: darken(hpColor,borderDarken)
color: hpText
.alert-lvl
background-color: lvlColor
border-color: darken(lvlColor,borderDarken)
color: lvlText
.alert-xp
background-color: xpColor
border-color: darken(xpColor,borderDarken)
color: xpText
.alert-death
background-color: deathColor
border-color: deathColor
color: deathText
.alert-mp
background-color: mpColor
border-color: darken(mpColor,borderDarken)
color: mpText
.alert-crit
background-color: critColor
border-color: darken(critColor,borderDarken)
color: critText
// alert icons
.icon-gold
background: url("/bower_components/habitrpg-shared/img/coin_single_gold.png") no-repeat
background-position: center center
background-size: 18px
width: 14px
height: 14px
.icon-silver
background: url("/bower_components/habitrpg-shared/img/coin_single_silver.png") no-repeat
background-position: center center
background-size: 18px
width: 14px
height: 14px
.icon-death
background: url("/bower_components/habitrpg-shared/img/sprites/dead.png") no-repeat
background-position: center center
background-size: 14px
width: 14px
height: 14px
.undo-button
z-index: 3000
position:absolute
left:5px
top:5px