assets/main/sass/components/_table.scss

   1 ///
   2 /// Editorial by HTML5 UP
   3 /// html5up.net | @ajlkn
   4 /// Free for personal and commercial use under the CCA 3.0 license (html5up.net/license)
   5 ///
   6
   7 /* Table */
   8
   9         .table-wrapper {
  10                 -webkit-overflow-scrolling: touch;
  11                 overflow-x: auto;
  12         }
  13
  14         table {
  15                 margin: 0 0 _size(element-margin) 0;
  16                 width: 100%;
  17
  18                 tbody {
  19                         tr {
  20                                 border: solid 1px _palette(border);
  21                                 border-left: 0;
  22                                 border-right: 0;
  23
  24                                 &:nth-child(2n + 1) {
  25                                         background-color: _palette(border-bg);
  26                                 }
  27                         }
  28                 }
  29
  30                 td {
  31                         padding: 0.75em 0.75em;
  32                 }
  33
  34                 th {
  35                         color: _palette(fg-bold);
  36                         font-size: 0.9em;
  37                         font-weight: _font(weight-bold);
  38                         padding: 0 0.75em 0.75em 0.75em;
  39                         text-align: left;
  40                 }
  41
  42                 thead {
  43                         border-bottom: solid 2px _palette(border);
  44                 }
  45
  46                 tfoot {
  47                         border-top: solid 2px _palette(border);
  48                 }
  49
  50                 &.alt {
  51                         border-collapse: separate;
  52
  53                         tbody {
  54                                 tr {
  55                                         td {
  56                                                 border: solid 1px _palette(border);
  57                                                 border-left-width: 0;
  58                                                 border-top-width: 0;
  59
  60                                                 &:first-child {
  61                                                         border-left-width: 1px;
  62                                                 }
  63                                         }
  64
  65                                         &:first-child {
  66                                                 td {
  67                                                         border-top-width: 1px;
  68                                                 }
  69                                         }
  70                                 }
  71                         }
  72
  73                         thead {
  74                                 border-bottom: 0;
  75                         }
  76
  77                         tfoot {
  78                                 border-top: 0;
  79                         }
  80                 }
  81         }