mirror of
https://github.com/codeninjasllc/codecombat.git
synced 2024-11-25 00:28:31 -05:00
164 lines
2.9 KiB
Sass
164 lines
2.9 KiB
Sass
@import "app/styles/bootstrap/variables"
|
|
|
|
#options-view
|
|
|
|
//- Volume slider
|
|
|
|
#volume-group
|
|
position: relative
|
|
width: 100%
|
|
height: 25px
|
|
margin: 15px 0
|
|
|
|
& > *
|
|
position: absolute
|
|
|
|
.ui-slider
|
|
left: 40px
|
|
right: 40px
|
|
top: 4px
|
|
background-color: rgb(248,169,67)
|
|
border: 4px solid rgb(26,21,18)
|
|
height: 18px
|
|
border-radius: 18px
|
|
|
|
.ui-slider-handle
|
|
background-color: rgb(26,21,18)
|
|
width: 28px
|
|
height: 28px
|
|
border-radius: 28px
|
|
top: -9px
|
|
outline: 0
|
|
|
|
.glyphicon
|
|
font-size: 30px
|
|
top: -2px
|
|
color: rgb(26,21,18)
|
|
|
|
.glyphicon-volume-down
|
|
position: absolute
|
|
left: 0
|
|
|
|
.glyphicon-volume-up
|
|
position: absolute
|
|
right: -10px
|
|
|
|
|
|
//- header, horizontal rule
|
|
|
|
.hr
|
|
width: 100%
|
|
height: 10px
|
|
|
|
h3
|
|
margin-top: 5px
|
|
color: rgb(26,21,18)
|
|
|
|
|
|
//- All form groups
|
|
|
|
.form-group
|
|
font-size: 16px
|
|
color: rgb(51,51,51)
|
|
padding-top: 4px
|
|
padding-left: 40px
|
|
|
|
label
|
|
font-weight: normal
|
|
|
|
//- Check boxes
|
|
|
|
.form-group.checkbox
|
|
|
|
label
|
|
position: relative
|
|
|
|
input
|
|
display: none
|
|
|
|
& + .custom-checkbox
|
|
.glyphicon
|
|
display: none
|
|
|
|
&:checked + .custom-checkbox .glyphicon
|
|
display: inline
|
|
color: rgb(248,169,67)
|
|
text-align: center
|
|
text-shadow: 0 0 3px black, 0 0 3px black, 0 0 3px black
|
|
font-size: 14px
|
|
position: relative
|
|
top: -1px
|
|
|
|
.custom-checkbox
|
|
border-radius: 2px
|
|
height: 27px
|
|
width: 27px
|
|
border: 4px solid rgb(26,21,18)
|
|
position: absolute
|
|
background: rgb(228,217,196)
|
|
text-align: center
|
|
|
|
// this undoes the padding of the form groups
|
|
left: -40px
|
|
top: -4px
|
|
|
|
|
|
//- Select boxes
|
|
|
|
select
|
|
border: 3px solid black
|
|
text-transform: uppercase
|
|
|
|
//.form-group.radio-inline
|
|
// input
|
|
// margin-left: 0px
|
|
// margin-right: 5px
|
|
//
|
|
// .radio-inline-parent-label
|
|
// padding-left: 0
|
|
//
|
|
//
|
|
#player-avatar-container
|
|
position: relative
|
|
margin: 0 auto 40px
|
|
width: 230px
|
|
max-height: 230px
|
|
border-radius: 6px
|
|
|
|
img.profile-photo
|
|
width: 100%
|
|
border-radius: 6px
|
|
|
|
&.saving
|
|
opacity: 0.5
|
|
|
|
.profile-caption
|
|
background-color: rgba(0, 0, 0, 0.5)
|
|
color: white
|
|
border-bottom-right-radius: 6px
|
|
border-bottom-left-radius: 6px
|
|
position: absolute
|
|
width: 100%
|
|
bottom: 0px
|
|
left: 0px
|
|
text-align: center
|
|
border: 0
|
|
font-size: 18px
|
|
|
|
.editable-icon
|
|
display: block
|
|
position: absolute
|
|
right: 5px
|
|
top: 5px
|
|
font-size: 20px
|
|
color: $blue
|
|
opacity: 0.5
|
|
|
|
&:hover
|
|
cursor: pointer
|
|
box-shadow: 0px 0px 2px 1px $blue
|
|
|
|
.editable-icon
|
|
opacity: 1.0
|
|
cursor: pointer
|
|
|