app/assets/stylesheets/application/components/_responsive_table.css.sass
@import application/variables
@import application/mixins
// a column representing 1 state
.af-rtable-column
padding: 5px
border: none
&:nth-child(2n)
background-color: transparentize($wellBackground, 0.5)
&:nth-child(2n+1)
background-color: transparentize($wellBackground, 0.8)
+respond-to(wide)
.af-rtable
display: table
position: relative
border-collapse: collapse
.af-rtable-column
display: table-cell
width: 10%
.af-rtable-cell
padding-bottom: 1ex
+respond-to(desktop)
.af-rtable-column
margin-bottom: $section_spacing
.af-rtable-cell
box-sizing: border-box
display: inline-block
width: 33%
padding: 1ex
+respond-to(tablet)
.af-rtable-column
margin-bottom: $section_spacing
.af-rtable-cell
box-sizing: border-box
display: inline-block
width: 49%
padding: 1ex