-
Notifications
You must be signed in to change notification settings - Fork 15
/
_table.sass
151 lines (137 loc) · 3.19 KB
/
_table.sass
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
// Tables
//
// Located in `wyrm_core/_tables.sass`. Table classes are additive so you can mix and match as you need.
//
// Markup:
// <table class="wy-table {$modifiers}">
// <thead>
// <tr>
// <th>Game</th>
// <th>Developer</th>
// <th>Description</th>
// </tr>
// </thead>
// <tbody>
// <tr>
// <td>
// Baldur's Gate II
// </td>
// <td>
// Bioware
// </td>
// <td>
// Boo has a space hamster. Imoen whines a bunch.
// </td>
// </tr>
// <tr>
// <td>
// Icewind Dale II
// </td>
// <td>
// Black Isle
// </td>
// <td>
// Fly around on an airship, then kill tons of ice monsters.
// </td>
// </tr>
// <tr>
// <td>
// Temple of Elemental Evil
// </td>
// <td>
// Trokia
// </td>
// <td>
// Turn based! Do everything 10 times slower.
// </td>
// </tr>
// </tbody>
// </table>
//
// .full-width - 100% width
// .wy-table-bordered - Border the table itself.
// .wy-table-bordered-rows - Border just the rows.
// .wy-table-bordered-all - Border the columns, rows, and the table.
// .wy-table-striped - Alternating row colors.
//
// Styleguide 3
.wy-table
border-collapse: collapse
border-spacing: 0
empty-cells: show
margin-bottom: $base-line-height
caption
color: #000
font: italic 85%/1 arial, sans-serif
padding: 1em 0
text-align: center
td, th
font-size: $table-font-size
margin: 0
overflow: visible
padding: $table-padding-size
td:first-child, th:first-child
border-left-width: 0
thead
color: #000
text-align: left
vertical-align: bottom
white-space: nowrap
th
font-weight: $base-font-family-bold
border-bottom: solid 2px $table-border-color
td
background-color: transparent
vertical-align: middle
.wy-table td p
line-height: $base-line-height * .75
&:last-child
margin-bottom: 0
.wy-table .wy-table-cell-min
width: 1%
padding-right: 0
input[type=checkbox], input[type=checkbox]
margin: 0
.wy-table-secondary
color: $text-medium
font-size: 90%
.wy-table-tertiary
color: $text-medium
font-size: 80%
// Striped
.wy-table-odd td, .wy-table-striped tr:nth-child(2n-1) td
background-color: $table-stripe-color
.wy-table-backed
background-color: $table-stripe-color
/* BORDERED TABLES
.wy-table-bordered-all
border: 1px solid $table-border-color
td
border-bottom: 1px solid $table-border-color
border-left: 1px solid $table-border-color
tbody > tr:last-child td
border-bottom-width: 0
.wy-table-bordered
border: 1px solid $table-border-color
.wy-table-bordered-rows
td
border-bottom: 1px solid $table-border-color
tbody > tr:last-child td
border-bottom-width: 0
.wy-table-horizontal
tbody > tr:last-child td
border-bottom-width: 0
td, th
border-width: 0 0 1px 0
border-bottom: 1px solid $table-border-color
tbody > tr:last-child td
border-bottom-width: 0
/* RESPONSIVE TABLES
.wy-table-responsive
margin-bottom: $base-line-height
max-width: 100%
overflow: auto
table
margin-bottom: 0 !important
td, th
white-space: nowrap