2018-03-23 18:04:06 +00:00
|
|
|
const popular-company-height = 250px
|
|
|
|
|
2018-03-13 22:30:09 +00:00
|
|
|
.popular-companies
|
|
|
|
horizontal-wrap
|
|
|
|
justify-content space-evenly
|
|
|
|
|
|
|
|
.popular-company
|
2018-03-23 17:15:04 +00:00
|
|
|
vertical
|
2018-03-13 22:30:09 +00:00
|
|
|
width 100%
|
2018-03-23 17:15:04 +00:00
|
|
|
max-width 800px
|
2018-03-13 22:30:09 +00:00
|
|
|
margin 0
|
2018-03-23 18:04:06 +00:00
|
|
|
margin-bottom calc(content-padding / 2)
|
2018-03-13 22:30:09 +00:00
|
|
|
padding 0.5rem 0.75rem
|
2018-03-23 17:15:04 +00:00
|
|
|
overflow hidden
|
2018-03-13 22:30:09 +00:00
|
|
|
ui-element
|
|
|
|
|
2018-03-23 17:15:04 +00:00
|
|
|
.popular-company-header
|
|
|
|
flex 0.2
|
|
|
|
|
|
|
|
.popular-company-body
|
|
|
|
flex 0.6
|
|
|
|
|
|
|
|
.popular-company-footer
|
|
|
|
flex 0.2
|
|
|
|
|
2018-03-23 18:04:06 +00:00
|
|
|
.company-anime
|
|
|
|
flex-flow row
|
|
|
|
overflow hidden
|
|
|
|
|
|
|
|
.company-anime-item
|
|
|
|
opacity 0.75
|
|
|
|
|
|
|
|
:hover
|
|
|
|
opacity 1
|
|
|
|
|
2018-03-23 17:15:04 +00:00
|
|
|
.popular-company-description
|
|
|
|
clip-long-text
|
|
|
|
|
2018-03-13 22:30:09 +00:00
|
|
|
.popular-company-icon
|
|
|
|
//
|
|
|
|
|
|
|
|
.popular-company-name
|
|
|
|
clip-long-text
|
|
|
|
|
|
|
|
.popular-company-anime-preview
|
|
|
|
flex 1
|
|
|
|
|
|
|
|
> 900px
|
|
|
|
.popular-company
|
2018-03-23 18:04:06 +00:00
|
|
|
height popular-company-height
|
|
|
|
max-height popular-company-height
|
2018-03-13 22:30:09 +00:00
|
|
|
padding 0.75rem 1rem
|
2018-03-23 17:15:04 +00:00
|
|
|
margin calc(content-padding / 2)
|
|
|
|
|
|
|
|
.popular-company-header
|
|
|
|
font-size 1.2rem
|
2018-03-13 22:30:09 +00:00
|
|
|
|
2018-03-23 17:15:04 +00:00
|
|
|
.popular-company-description
|
|
|
|
white-space normal
|