0
0
mirror of https://github.com/twbs/bootstrap.git synced 2024-11-29 11:24:18 +01:00

adding table variables

This commit is contained in:
Mark Otto 2012-03-05 22:47:39 -08:00
parent ac6eff280d
commit d98a2e9234
4 changed files with 38 additions and 12 deletions

Binary file not shown.

View File

@ -1078,6 +1078,7 @@ table {
max-width: 100%; max-width: 100%;
border-collapse: collapse; border-collapse: collapse;
border-spacing: 0; border-spacing: 0;
background-color: transparent;
} }
.table { .table {
width: 100%; width: 100%;
@ -1088,7 +1089,7 @@ table {
line-height: 18px; line-height: 18px;
text-align: left; text-align: left;
vertical-align: top; vertical-align: top;
border-top: 1px solid #ddd; border-top: 1px solid #dddddd;
} }
.table th { .table th {
font-weight: bold; font-weight: bold;
@ -1100,13 +1101,13 @@ table {
border-top: 0; border-top: 0;
} }
.table tbody + tbody { .table tbody + tbody {
border-top: 2px solid #ddd; border-top: 2px solid #dddddd;
} }
.table-condensed th, .table-condensed td { .table-condensed th, .table-condensed td {
padding: 4px 5px; padding: 4px 5px;
} }
.table-bordered { .table-bordered {
border: 1px solid #ddd; border: 1px solid #dddddd;
border-left: 0; border-left: 0;
border-collapse: separate; border-collapse: separate;
*border-collapse: collapsed; *border-collapse: collapsed;
@ -1115,11 +1116,11 @@ table {
border-radius: 4px; border-radius: 4px;
} }
.table-bordered th, .table-bordered td { .table-bordered th, .table-bordered td {
border-left: 1px solid #ddd; border-left: 1px solid #dddddd;
} }
.table-bordered thead:first-child tr:first-child th, .table-bordered tbody:first-child tr:first-child th, .table-bordered tbody:first-child tr:first-child td { .table-bordered thead:first-child tr:first-child th, .table-bordered tbody:first-child tr:first-child th, .table-bordered tbody:first-child tr:first-child td {
border-top: 0; border-top: 0;
border-bottom: 1px solid #ddd; border-bottom: 1px solid #dddddd;
} }
.table-bordered thead:first-child tr:first-child th:first-child, .table-bordered tbody:first-child tr:first-child td:first-child { .table-bordered thead:first-child tr:first-child th:first-child, .table-bordered tbody:first-child tr:first-child td:first-child {
-webkit-border-radius: 4px 0 0 0; -webkit-border-radius: 4px 0 0 0;

View File

@ -11,6 +11,7 @@ table {
max-width: 100%; max-width: 100%;
border-collapse: collapse; border-collapse: collapse;
border-spacing: 0; border-spacing: 0;
background-color: @tableBackground;
} }
// BASELINE STYLES // BASELINE STYLES
@ -26,7 +27,7 @@ table {
line-height: @baseLineHeight; line-height: @baseLineHeight;
text-align: left; text-align: left;
vertical-align: top; vertical-align: top;
border-top: 1px solid #ddd; border-top: 1px solid @tableBorder;
} }
th { th {
font-weight: bold; font-weight: bold;
@ -42,7 +43,7 @@ table {
} }
// Account for multiple tbody instances // Account for multiple tbody instances
tbody + tbody { tbody + tbody {
border-top: 2px solid #ddd; border-top: 2px solid @tableBorder;
} }
} }
@ -63,21 +64,21 @@ table {
// ---------------- // ----------------
.table-bordered { .table-bordered {
border: 1px solid #ddd; border: 1px solid @tableBorder;
border-left: 0; border-left: 0;
border-collapse: separate; // Done so we can round those corners! border-collapse: separate; // Done so we can round those corners!
*border-collapse: collapsed; // IE7 can't round corners anyway *border-collapse: collapsed; // IE7 can't round corners anyway
.border-radius(4px); .border-radius(4px);
th, th,
td { td {
border-left: 1px solid #ddd; border-left: 1px solid @tableBorder;
} }
// Prevent a double border // Prevent a double border
thead:first-child tr:first-child th, thead:first-child tr:first-child th,
tbody:first-child tr:first-child th, tbody:first-child tr:first-child th,
tbody:first-child tr:first-child td { tbody:first-child tr:first-child td {
border-top: 0; border-top: 0;
border-bottom: 1px solid #ddd; border-bottom: 1px solid @tableBorder;
} }
// For first th or td in the first row in the first thead or tbody // For first th or td in the first row in the first thead or tbody
thead:first-child tr:first-child th:first-child, thead:first-child tr:first-child th:first-child,
@ -108,7 +109,7 @@ table {
tbody { tbody {
tr:nth-child(odd) td, tr:nth-child(odd) td,
tr:nth-child(odd) th { tr:nth-child(odd) th {
background-color: #f9f9f9; background-color: @tableBackgroundAccent;
} }
} }
} }
@ -120,7 +121,7 @@ table {
.table { .table {
tbody tr:hover td, tbody tr:hover td,
tbody tr:hover th { tbody tr:hover th {
background-color: #f5f5f5; background-color: @tableBackgroundHover;
} }
} }

View File

@ -7,7 +7,9 @@
// GLOBAL VALUES // GLOBAL VALUES
// -------------------------------------------------- // --------------------------------------------------
// Grays // Grays
// -------------------------
@black: #000; @black: #000;
@grayDarker: #222; @grayDarker: #222;
@grayDark: #333; @grayDark: #333;
@ -16,7 +18,9 @@
@grayLighter: #eee; @grayLighter: #eee;
@white: #fff; @white: #fff;
// Accent colors // Accent colors
// -------------------------
@blue: #049cdb; @blue: #049cdb;
@blueDark: #0064cd; @blueDark: #0064cd;
@green: #46a546; @green: #46a546;
@ -26,15 +30,21 @@
@pink: #c3325f; @pink: #c3325f;
@purple: #7a43b6; @purple: #7a43b6;
// Scaffolding // Scaffolding
// -------------------------
@bodyBackground: @white; @bodyBackground: @white;
@textColor: @grayDark; @textColor: @grayDark;
// Links // Links
// -------------------------
@linkColor: #08c; @linkColor: #08c;
@linkColorHover: #069; @linkColorHover: #069;
// Typography // Typography
// -------------------------
@baseFontSize: 13px; @baseFontSize: 13px;
@baseFontFamily: "Helvetica Neue", Helvetica, Arial, sans-serif; @baseFontFamily: "Helvetica Neue", Helvetica, Arial, sans-serif;
@baseLineHeight: 18px; @baseLineHeight: 18px;
@ -44,7 +54,17 @@
@headingsFontWeight: normal; // instead of browser default, bold @headingsFontWeight: normal; // instead of browser default, bold
@headingsColor: ''; // empty to use BS default, @textColor @headingsColor: ''; // empty to use BS default, @textColor
// Tables
// -------------------------
@tableBackground: transparent; // overall background-color
@tableBackgroundAccent: #f9f9f9; // for striping
@tableBackgroundHover: #f5f5f5; // for hover
@tableBorder: #ddd; // table and cell border
// Buttons // Buttons
// -------------------------
@btnBackground: @white; @btnBackground: @white;
@btnBackgroundHighlight: darken(@white, 10%); @btnBackgroundHighlight: darken(@white, 10%);
@btnBorder: #ccc; @btnBorder: #ccc;
@ -67,13 +87,17 @@
@btnInverseBackground: @gray; @btnInverseBackground: @gray;
@btnInverseBackgroundHighlight: @grayDarker; @btnInverseBackgroundHighlight: @grayDarker;
// Forms // Forms
// -------------------------
@inputBackground: @white; @inputBackground: @white;
@inputBorder: #ccc; @inputBorder: #ccc;
@inputDisabledBackground: @grayLighter; @inputDisabledBackground: @grayLighter;
// Dropdowns // Dropdowns
// -------------------------
@dropdownBackground: @white; @dropdownBackground: @white;
@dropdownLinkColor: @grayDark; @dropdownLinkColor: @grayDark;
@dropdownLinkColorHover: @white; @dropdownLinkColorHover: @white;