Style tables, different header bg, alternate row color and border

This commit is contained in:
Mathieu David 2016-02-05 18:09:35 +01:00
parent f6be4a7d7e
commit 7364d41f0c
7 changed files with 106 additions and 42 deletions

View File

@ -27,12 +27,14 @@ h5 {
} }
table { table {
margin: 0 auto; margin: 0 auto;
} border-collapse: collapse;
table thead td {
font-weight: 700;
} }
table td { table td {
padding: 3px 20px; padding: 3px 20px;
border: 1px solid;
}
table thead td {
font-weight: 700;
} }
.sidebar { .sidebar {
position: absolute; position: absolute;
@ -296,14 +298,6 @@ table td {
.light { .light {
color: #333; color: #333;
background-color: #fff; background-color: #fff;
/*
table {
thead td {
color: $table-header-fg;
backrgound: $table-header-bg;
}
}
*/
/* Inline code */ /* Inline code */
} }
.light .content .header:link, .light .content .header:link,
@ -375,6 +369,21 @@ table td {
border-top: 0.1em solid #e1edf1; border-top: 0.1em solid #e1edf1;
border-bottom: 0.1em solid #e1edf1; border-bottom: 0.1em solid #e1edf1;
} }
.light table td {
border-color: #f2f2f2;
}
.light table tbody tr:nth-child(2n) {
background: #f7f7f7;
}
.light table thead {
background: #ccc;
}
.light table thead td {
border: none;
}
.light table thead tr {
border: 1px #ccc solid;
}
.light :not(pre) > .hljs { .light :not(pre) > .hljs {
display: inline-block; display: inline-block;
vertical-align: middle; vertical-align: middle;
@ -404,14 +413,6 @@ table td {
.coal { .coal {
color: #98a3ad; color: #98a3ad;
background-color: #141617; background-color: #141617;
/*
table {
thead td {
color: $table-header-fg;
backrgound: $table-header-bg;
}
}
*/
/* Inline code */ /* Inline code */
} }
.coal .content .header:link, .coal .content .header:link,
@ -483,6 +484,21 @@ table td {
border-top: 0.1em solid #2c2f44; border-top: 0.1em solid #2c2f44;
border-bottom: 0.1em solid #2c2f44; border-bottom: 0.1em solid #2c2f44;
} }
.coal table td {
border-color: #1f2223;
}
.coal table tbody tr:nth-child(2n) {
background: #1b1d1e;
}
.coal table thead {
background: #3f4649;
}
.coal table thead td {
border: none;
}
.coal table thead tr {
border: 1px #3f4649 solid;
}
.coal :not(pre) > .hljs { .coal :not(pre) > .hljs {
display: inline-block; display: inline-block;
vertical-align: middle; vertical-align: middle;
@ -512,14 +528,6 @@ table td {
.navy { .navy {
color: #bcbdd0; color: #bcbdd0;
background-color: #161923; background-color: #161923;
/*
table {
thead td {
color: $table-header-fg;
backrgound: $table-header-bg;
}
}
*/
/* Inline code */ /* Inline code */
} }
.navy .content .header:link, .navy .content .header:link,
@ -591,6 +599,21 @@ table td {
border-top: 0.1em solid #2f333f; border-top: 0.1em solid #2f333f;
border-bottom: 0.1em solid #2f333f; border-bottom: 0.1em solid #2f333f;
} }
.navy table td {
border-color: #1f2331;
}
.navy table tbody tr:nth-child(2n) {
background: #1b1f2b;
}
.navy table thead {
background: #39415b;
}
.navy table thead td {
border: none;
}
.navy table thead tr {
border: 1px #39415b solid;
}
.navy :not(pre) > .hljs { .navy :not(pre) > .hljs {
display: inline-block; display: inline-block;
vertical-align: middle; vertical-align: middle;
@ -620,14 +643,6 @@ table td {
.rust { .rust {
color: #262625; color: #262625;
background-color: #e1e1db; background-color: #e1e1db;
/*
table {
thead td {
color: $table-header-fg;
backrgound: $table-header-bg;
}
}
*/
/* Inline code */ /* Inline code */
} }
.rust .content .header:link, .rust .content .header:link,
@ -699,6 +714,21 @@ table td {
border-top: 0.1em solid #b8b8b1; border-top: 0.1em solid #b8b8b1;
border-bottom: 0.1em solid #b8b8b1; border-bottom: 0.1em solid #b8b8b1;
} }
.rust table td {
border-color: #d7d7cf;
}
.rust table tbody tr:nth-child(2n) {
background: #dbdbd4;
}
.rust table thead {
background: #b3a497;
}
.rust table thead td {
border: none;
}
.rust table thead tr {
border: 1px #b3a497 solid;
}
.rust :not(pre) > .hljs { .rust :not(pre) > .hljs {
display: inline-block; display: inline-block;
vertical-align: middle; vertical-align: middle;

View File

@ -22,7 +22,14 @@ h4, h5 { margin-top: 2em }
table { table {
margin: 0 auto; margin: 0 auto;
border-collapse: collapse;
thead td { font-weight: 700; } td {
td { padding: 3px 20px; } padding: 3px 20px;
border: 1px solid;
}
thead {
td { font-weight: 700; }
}
} }

View File

@ -79,14 +79,25 @@
border-bottom: .1em solid $quote-border; border-bottom: .1em solid $quote-border;
} }
/*
table { table {
thead td {
color: $table-header-fg; td {
backrgound: $table-header-bg; border-color: $table-border-color;
}
// Alternate background colors for rows
tbody tr:nth-child(2n) {
background: $table-alternate-bg;
}
thead {
background: $table-header-bg;
td { border: none; }
tr { border: 1px $table-header-bg solid; }
} }
} }
*/
/* Inline code */ /* Inline code */
:not(pre) > .hljs { :not(pre) > .hljs {

View File

@ -21,4 +21,8 @@ $theme-hover = #1f2124
$quote-bg = #242637 $quote-bg = #242637
$quote-border = lighten($quote-bg, 5%) $quote-border = lighten($quote-bg, 5%)
$table-border-color = lighten($bg, 5%)
$table-header-bg = lighten($bg, 20%)
$table-alternate-bg = lighten($bg, 3%)
@import 'base' @import 'base'

View File

@ -21,4 +21,8 @@ $theme-hover = #e6e6e6
$quote-bg = #f2f7f9 $quote-bg = #f2f7f9
$quote-border = darken($quote-bg, 5%) $quote-border = darken($quote-bg, 5%)
$table-border-color = darken($bg, 5%)
$table-header-bg = darken($bg, 20%)
$table-alternate-bg = darken($bg, 3%)
@import 'base' @import 'base'

View File

@ -21,4 +21,8 @@ $theme-hover = #282e40
$quote-bg = #262933 $quote-bg = #262933
$quote-border = lighten($quote-bg, 5%) $quote-border = lighten($quote-bg, 5%)
$table-border-color = lighten($bg, 5%)
$table-header-bg = lighten($bg, 20%)
$table-alternate-bg = lighten($bg, 3%)
@import 'base' @import 'base'

View File

@ -21,4 +21,8 @@ $theme-hover = #99908a
$quote-bg = #c1c1bb $quote-bg = #c1c1bb
$quote-border = darken($quote-bg, 5%) $quote-border = darken($quote-bg, 5%)
$table-border-color = darken($bg, 5%)
$table-header-bg = #b3a497
$table-alternate-bg = darken($bg, 3%)
@import 'base' @import 'base'