node_modules/bulma/sass/elements/table.sass

   1 $table-color: $text-strong !default
   2 $table-background-color: $scheme-main !default
   3
   4 $table-cell-border: 1px solid $border !default
   5 $table-cell-border-width: 0 0 1px !default
   6 $table-cell-padding: 0.5em 0.75em !default
   7 $table-cell-heading-color: $text-strong !default
   8
   9 $table-head-cell-border-width: 0 0 2px !default
  10 $table-head-cell-color: $text-strong !default
  11 $table-foot-cell-border-width: 2px 0 0 !default
  12 $table-foot-cell-color: $text-strong !default
  13
  14 $table-head-background-color: transparent !default
  15 $table-body-background-color: transparent !default
  16 $table-foot-background-color: transparent !default
  17
  18 $table-row-hover-background-color: $scheme-main-bis !default
  19
  20 $table-row-active-background-color: $primary !default
  21 $table-row-active-color: $primary-invert !default
  22
  23 $table-striped-row-even-background-color: $scheme-main-bis !default
  24 $table-striped-row-even-hover-background-color: $scheme-main-ter !default
  25
  26 .table
  27   @extend %block
  28   background-color: $table-background-color
  29   color: $table-color
  30   td,
  31   th
  32     border: $table-cell-border
  33     border-width: $table-cell-border-width
  34     padding: $table-cell-padding
  35     vertical-align: top
  36     // Colors
  37     @each $name, $pair in $colors
  38       $color: nth($pair, 1)
  39       $color-invert: nth($pair, 2)
  40       &.is-#{$name}
  41         background-color: $color
  42         border-color: $color
  43         color: $color-invert
  44     // Modifiers
  45     &.is-narrow
  46       white-space: nowrap
  47       width: 1%
  48     &.is-selected
  49       background-color: $table-row-active-background-color
  50       color: $table-row-active-color
  51       a,
  52       strong
  53         color: currentColor
  54   th
  55     color: $table-cell-heading-color
  56     &:not([align])
  57       text-align: left
  58   tr
  59     &.is-selected
  60       background-color: $table-row-active-background-color
  61       color: $table-row-active-color
  62       a,
  63       strong
  64         color: currentColor
  65       td,
  66       th
  67         border-color: $table-row-active-color
  68         color: currentColor
  69   thead
  70     background-color: $table-head-background-color
  71     td,
  72     th
  73       border-width: $table-head-cell-border-width
  74       color: $table-head-cell-color
  75   tfoot
  76     background-color: $table-foot-background-color
  77     td,
  78     th
  79       border-width: $table-foot-cell-border-width
  80       color: $table-foot-cell-color
  81   tbody
  82     background-color: $table-body-background-color
  83     tr
  84       &:last-child
  85         td,
  86         th
  87           border-bottom-width: 0
  88   // Modifiers
  89   &.is-bordered
  90     td,
  91     th
  92       border-width: 1px
  93     tr
  94       &:last-child
  95         td,
  96         th
  97           border-bottom-width: 1px
  98   &.is-fullwidth
  99     width: 100%
 100   &.is-hoverable
 101     tbody
 102       tr:not(.is-selected)
 103         &:hover
 104           background-color: $table-row-hover-background-color
 105     &.is-striped
 106       tbody
 107         tr:not(.is-selected)
 108           &:hover
 109             background-color: $table-row-hover-background-color
 110             &:nth-child(even)
 111               background-color: $table-striped-row-even-hover-background-color
 112   &.is-narrow
 113     td,
 114     th
 115       padding: 0.25em 0.5em
 116   &.is-striped
 117     tbody
 118       tr:not(.is-selected)
 119         &:nth-child(even)
 120           background-color: $table-striped-row-even-background-color
 121
 122 .table-container
 123   @extend %block
 124   +overflow-touch
 125   overflow: auto
 126   overflow-y: hidden
 127   max-width: 100%