codecombat/app/styles/courses/hero-select-modal.sass
phoenixeliot 870ae9a8a1 Add hero selector for courses mode
Use selected hero in Course mode play

Show selected hero on Courses (in progress)

Add hero select modal

Use short names, only show warriors

Use box-shadow instead of borders

Add tests for HeroSelectModal

Refactor modal opening test

Address code review feedback
2016-06-03 13:40:41 -07:00

40 lines
744 B
Sass

@import "app/styles/style-flat-variables"
#hero-select-modal
.modal-dialog
width: auto
max-width: 900px
.modal-header, .modal-body:not(.secret), .modal-footer
display: flex
flex-direction: column
align-items: center
.modal-footer
margin: 30px
h4
max-width: 500px
.hero-list
display: flex
flex-wrap: wrap
justify-content: center
margin-bottom: -50px
.hero-option
display: flex
flex-direction: column
align-items: center
margin: 0 50px 50px
.hero-avatar
margin: 6px
background-color: #f8f8f8
box-shadow: 0 0 0 1px gray
.current .hero-avatar
box-shadow: 0 0 0 6px gray
.selected .hero-avatar
box-shadow: 0 0 0 6px $gold