codecombat/app/styles/play/modal/play-achievements-modal.sass
2014-11-22 20:56:46 -08:00

88 lines
1.4 KiB
Sass

@import "app/styles/mixins"
#play-achievements-modal
.modal-dialog
width: 800px
.modal-header
padding-bottom: 20px
img.icon
float: left
width: 40px
margin-right: 10px
//- Unachieved Panels
.panel
margin: 5px 0
position: relative
border: 2px solid rgb(75,75,75)
padding: 2px
@include opacity(0.75)
h3
margin: 0 0 0 50px
color: rgb(75,75,75)
p
margin: 0 0 0 50px
color: rgb(75,75,75)
.panel-body
padding: 5px 150px 5px 5px
//border: 2px solid rgb(150,150,150) // Chloe's suggestion to not have this
.created
position: absolute
right: 10px
top: 5px
color: rgb(75,75,75)
font-size: 12px
//- Achieved Panels
.panel.earned
background: rgb(50,40,33)
border: 5px solid rgb(26,21,17)
padding: 0
@include opacity(1)
h3
color: white
p
color: rgb(203,170,148)
.panel-body
border: 2px solid rgb(75,62,51)
.created
color: rgb(255,189,68)
//- Rewards
.rewards
position: absolute
right: .2em
//bottom: 10px
top: 29px
.label
font-size: 18px
margin-left: 5px
color: rgb(50,40,33)
background: rgb(203,170,148)
.gems
background: #94ccc7
.worth
background: #d8c488
img
width: 12px
height: 12px