codecombat/app/styles/game-menu/inventory-view.sass

105 lines
No EOL
1.8 KiB
Sass

$selected-area-height: 150px
@import "../bootstrap/mixins"
//#inventory-view *
#inventory-view
position: relative
height: 600px
+user-select(none)
h3
margin: 0
#equipped
width: 75%
position: absolute
left: 0
top: 0
bottom: $selected-area-height + 10
right: 0
overflow: scroll
.item-slot.disabled
opacity: 0.5
.panel
text-align: center
width: 31.3%
margin: 5px 2% 5px 0
float: left
cursor: pointer
.panel-heading
padding: 5px
.panel-info .panel-body
background-color: #e0f0f5
.panel-body
height: 50px
padding: 5px
overflow: scroll
font-size: 12px
#available-equipment
width: 25%
position: absolute
right: 0
top: 0
bottom: $selected-area-height + 10
overflow: scroll
h3
margin-bottom: 5px
.list-group-item.active
background-color: #e0f0f5
.list-group-item.equipped
display: none
.item-view
cursor: pointer
#selected-items
position: absolute
height: $selected-area-height
left: 0
right: 0
bottom: 0
text-align: center
#selected-equipped-item, #selected-available-item
text-align: left
position: absolute
bottom: 0
top: 0
overflow: scroll
padding: 10px
height: 100%
width: 49%
img
width: 100px
height: 100px
.item-info
margin-left: 110px
#selected-equipped-item
left: 0
#selected-available-item
right: 0
$swap-item-height: 40px
#swap-button
position: relative
top: ($selected-area-height / 2) - ($swap-item-height / 2)
height: $swap-item-height
font-size: 24px
line-height: 24px
display: inline-block