From 224296f6950ce0e5b00ba88aacf54fe4c638f14a Mon Sep 17 00:00:00 2001 From: Mark Otto Date: Thu, 14 Mar 2013 13:29:43 -0700 Subject: [PATCH] Fixes #7281: make tables super specific for hovers and striping to avoid nesting issues --- docs/assets/css/bootstrap.css | 20 ++++++++++---------- less/tables.less | 13 +++++++------ 2 files changed, 17 insertions(+), 16 deletions(-) diff --git a/docs/assets/css/bootstrap.css b/docs/assets/css/bootstrap.css index d8a4517732..c5121d7cbf 100644 --- a/docs/assets/css/bootstrap.css +++ b/docs/assets/css/bootstrap.css @@ -967,13 +967,13 @@ th { border-top-right-radius: 4px; } -.table-striped tbody > tr:nth-child(odd) > td, -.table-striped tbody > tr:nth-child(odd) > th { +.table-striped > tbody > tr:nth-child(odd) > td, +.table-striped > tbody > tr:nth-child(odd) > th { background-color: #f9f9f9; } -.table-hover tbody tr:hover > td, -.table-hover tbody tr:hover > th { +.table-hover > tbody > tr:hover > td, +.table-hover > tbody > tr:hover > th { background-color: #f5f5f5; } @@ -988,27 +988,27 @@ table th[class^="span"] { float: none; } -.table tbody tr.success > td { +.table > tbody > tr.success > td { background-color: #dff0d8; } -.table tbody tr.error > td { +.table > tbody > tr.error > td { background-color: #f2dede; } -.table tbody tr.warning > td { +.table > tbody > tr.warning > td { background-color: #fcf8e3; } -.table-hover tbody tr.success:hover > td { +.table-hover > tbody > tr.success:hover > td { background-color: #d0e9c6; } -.table-hover tbody tr.error:hover > td { +.table-hover > tbody > tr.error:hover > td { background-color: #ebcccc; } -.table-hover tbody tr.warning:hover > td { +.table-hover > tbody > tr.warning:hover > td { background-color: #faf2cc; } diff --git a/less/tables.less b/less/tables.less index 6a4e5e4fda..05e67ec1c8 100644 --- a/less/tables.less +++ b/less/tables.less @@ -150,7 +150,7 @@ th { // Default zebra-stripe styles (alternating gray and transparent backgrounds) .table-striped { - tbody { + > tbody { > tr:nth-child(odd) > td, > tr:nth-child(odd) > th { background-color: @table-background-accent; @@ -162,11 +162,12 @@ th { // HOVER EFFECT // ------------ + // Placed here since it has to come after the potential zebra striping .table-hover { - tbody { - tr:hover > td, - tr:hover > th { + > tbody { + > tr:hover > td, + > tr:hover > th { background-color: @table-background-hover; } } @@ -192,7 +193,7 @@ table th[class^="span"] { // ----------------- // Exact selectors below required to override .table-striped -.table tbody tr { +.table > tbody > tr { &.success > td { background-color: @state-success-background; } @@ -205,7 +206,7 @@ table th[class^="span"] { } // Hover states for .table-hover -.table-hover tbody tr { +.table-hover > tbody > tr { &.success:hover > td { background-color: darken(@state-success-background, 5%); }