68 lines
1.1 KiB
Plaintext
Raw Normal View History

const inventory-slot-size = 64px
2017-10-04 11:39:59 +00:00
.inventory
display grid
grid-gap 0.25rem
grid-template-columns repeat(auto-fit, inventory-slot-size)
grid-auto-rows inventory-slot-size
justify-content center
width 100%
max-width 450px
margin 0 auto
.inventory-slot
ui-element
position relative
display flex
align-items center
justify-content center
2017-10-06 10:44:55 +00:00
font-size 2.5rem
[draggable="true"]
:hover
cursor pointer
2018-04-08 20:10:45 +00:00
.shop-item-icon
2017-10-06 10:44:55 +00:00
animation hover-item 1s infinite ease-in-out
2017-10-04 11:39:59 +00:00
.icon
margin 0
pointer-events none
2017-10-06 10:44:55 +00:00
// [data-item-id="pro-account-3"]
2018-04-08 20:10:45 +00:00
// .shop-item-icon
2017-10-06 10:44:55 +00:00
// opacity 0.7
// [data-item-id="pro-account-6"]
2018-04-08 20:10:45 +00:00
// .shop-item-icon
2017-10-06 10:44:55 +00:00
// opacity 0.8
// [data-item-id="pro-account-12"]
2018-04-08 20:10:45 +00:00
// .shop-item-icon
2017-10-06 10:44:55 +00:00
// opacity 0.9
// [data-item-id="pro-account-24"]
2018-04-08 20:10:45 +00:00
// .shop-item-icon
2017-10-06 10:44:55 +00:00
// opacity 1.0
animation hover-item
0%
transform rotateZ(0)
20%
transform rotateZ(5deg)
80%
transform rotateZ(-5deg)
100%
transform rotateZ(0)
2017-10-04 11:39:59 +00:00
.inventory-slot-quantity
position absolute
bottom 0.25rem
right 0.25rem
font-size 0.8rem
line-height 1em
opacity 0.5
pointer-events none
.drag-enter
border-style dashed