Created
March 26, 2013 18:55
-
-
Save duboisp/5248113 to your computer and use it in GitHub Desktop.
See https://github.com/wet-boew/wet-boew/pull/1656 When compiled, it's work on firefox but not in IE
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| /* | |
| * Web Experience Toolkit (WET) / Boîte à outils de l'expérience Web (BOEW) | |
| * wet-boew.github.com/wet-boew/License-eng.txt / wet-boew.github.com/wet-boew/Licence-fra.txt | |
| */ | |
| /* IE7 hacks - should be in an IE7 only .css */ | |
| .ie7 { | |
| ol.wet-boew-zebra { | |
| > { | |
| li { | |
| padding-left: 10px; | |
| list-style: decimal inside; | |
| } | |
| } | |
| ol { | |
| li { | |
| list-style: lower-alpha outside; | |
| } | |
| ol { | |
| li { | |
| list-style: lower-roman outside; | |
| } | |
| } | |
| } | |
| } | |
| } | |
| /* In separate CSS because IE have conflit when it's combined with the CSS3 nthChild instruction */ | |
| .wet-boew-zebra { | |
| /* List Zebra */ | |
| li { | |
| &.list-even { | |
| @extend %zebra-list-even; | |
| } | |
| &.list-odd { | |
| @extend %zebra-list-odd; | |
| } | |
| &.list-hover { | |
| @extend %zebra-list-hover; | |
| } | |
| } | |
| /* Style Alterwg (Alternate White and Gray stripe) */ | |
| &.alterwg { | |
| li { | |
| &.list-even { | |
| background-color: #ddd; | |
| } | |
| &.list-odd { | |
| background-color: #fff; | |
| } | |
| } | |
| } | |
| /* Traditionel Table Zebra Stripping */ | |
| &.colzebra { | |
| colgroup { | |
| col { | |
| &.table-odd { | |
| @extend %zebra-table-odd; | |
| } | |
| } | |
| } | |
| } | |
| &.rowzebra { | |
| tbody { | |
| tr { | |
| &.table-odd { | |
| @extend %zebra-table-odd; | |
| } | |
| } | |
| } | |
| } | |
| &.columnhighlight { | |
| colgroup { | |
| col.table-hover { | |
| background-color: #eee; | |
| } | |
| &.table-summary col.table-hover { | |
| @extend %zebra-table-summary-hover; | |
| } | |
| } | |
| } | |
| &.rowhover, &.rowtdhover { | |
| tbody, tfoot { | |
| tr.table-hover, | |
| tr.table-hover td.table-keycell, | |
| tr.table-hover td.table-desccell, | |
| tr.table-hover td.table-layoutCell, | |
| tr.table-hover th.table-layoutCell { | |
| background-color: #eee; | |
| } | |
| /* Hover for summary rows */ | |
| tr.table-summary.table-hover, | |
| tr.table-summary.table-hover td.table-keycell, | |
| tr.table-summary.table-hover td.table-desccell, | |
| tr.table-summary.table-hover td.table-layoutCell, | |
| tr.table-summary.table-hover th.table-layoutCell { | |
| @extend %zebra-table-summary-hover; | |
| } | |
| } | |
| } | |
| } |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| /* | |
| * Web Experience Toolkit (WET) / Boîte à outils de l'expérience Web (BOEW) | |
| * wet-boew.github.com/wet-boew/License-eng.txt / wet-boew.github.com/wet-boew/Licence-fra.txt | |
| */ | |
| %zebra-border-none { | |
| border: none; | |
| } | |
| %zebra-list-style-type-none { | |
| list-style-type: none; | |
| } | |
| %zebra-list-hover { | |
| background-color: #f0fcff; | |
| } | |
| %zebra-list-odd { | |
| background-color: #eee; | |
| } | |
| %zebra-list-even { | |
| background-color: #ddd; | |
| } | |
| %zebra-table-odd { | |
| background-color: #f0fcff; | |
| } | |
| %zebra-table-summary-hover { | |
| background-color: #f0fcff; | |
| } | |
| ul { | |
| &.wet-boew-zebra { | |
| li { | |
| @extend %zebra-list-style-type-none; | |
| li { | |
| @extend %zebra-list-style-type-none; | |
| } | |
| } | |
| } | |
| } | |
| ol, ul { | |
| &.wet-boew-zebra { | |
| margin: 5px 0 10px 0; | |
| li { | |
| margin-bottom: 2px; | |
| margin-right: 0; | |
| padding: 10px; | |
| } | |
| } | |
| } | |
| ol { | |
| &.wet-boew-zebra { | |
| padding: 0; | |
| list-style-type: decimal; | |
| counter-reset: li; | |
| > { | |
| li { | |
| /* Make room for the number you add with :before */ | |
| padding-left: 2em; | |
| position: relative; | |
| list-style: none; | |
| &:before { | |
| /* Add the number using the counter and increment */ | |
| content: counter(li) '. '; | |
| counter-increment: li; | |
| position: absolute; | |
| left: 5px; | |
| } | |
| } | |
| } | |
| ol { | |
| li { | |
| padding-left: 0; | |
| &:before { | |
| content: normal; | |
| } | |
| } | |
| } | |
| } | |
| } | |
| .module-comment ol.wet-boew-zebra, ol.wet-boew-zebra.module-comment, ol.wet-boew-zebra.list-bullet-none { | |
| > { | |
| li { | |
| &:before { | |
| content: normal; | |
| counter-increment: none; | |
| position: static; | |
| left: auto; | |
| } | |
| } | |
| } | |
| } | |
| .module-comment ol.wet-boew-zebra, ol.wet-boew-zebra.module-comment { | |
| ol { | |
| li { | |
| @extend %zebra-list-style-type-none; | |
| } | |
| ol { | |
| li { | |
| @extend %zebra-list-style-type-none; | |
| } | |
| } | |
| } | |
| } | |
| dl { | |
| &.wet-boew-zebra { | |
| margin-left: 0; | |
| } | |
| } | |
| .wet-boew-zebra { | |
| /* Definition list */ | |
| dl, dd { | |
| margin-left: 0; | |
| } | |
| dd { | |
| padding: 10px; | |
| } | |
| dt { | |
| padding: 10px; | |
| font-weight: 700; | |
| margin-top: 2px; | |
| } | |
| dt, dd, > li { | |
| border: 1px solid #CCC; | |
| } | |
| dt, dd { | |
| &.list-even { | |
| @extend %zebra-list-even; | |
| } | |
| &.list-odd { | |
| @extend %zebra-list-odd; | |
| } | |
| &.list-hover { | |
| @extend %zebra-list-hover; | |
| } | |
| } | |
| /* Ordered and Unordered list */ | |
| > li { | |
| &:nth-child(2n) { | |
| @extend %zebra-list-even; | |
| } | |
| &:nth-child(2n + 1) { | |
| @extend %zebra-list-odd; | |
| } | |
| &:hover { | |
| @extend %zebra-list-hover; | |
| } | |
| } | |
| /* Style Alterwg (Alternate White and Gray stripe) */ | |
| &.alterwg { | |
| dt, dd, > li { | |
| @extend %zebra-border-none; | |
| } | |
| > li { | |
| &:nth-child(2n) { | |
| background-color: #ddd; | |
| } | |
| &:nth-child(2n + 1) { | |
| background-color: #fff; | |
| } | |
| } | |
| dt, dd { | |
| &.list-even { | |
| background-color: #ddd; | |
| } | |
| &.list-odd { | |
| background-color: #fff; | |
| } | |
| } | |
| &.zebra-hover { | |
| li, dt, dd { | |
| &.list-hover, &:hover { | |
| @extend %zebra-list-hover; | |
| } | |
| } | |
| } | |
| } | |
| /* Option about to apply no Margin on a Zebra list */ | |
| &.nomargin { | |
| margin: 0; | |
| } | |
| /* | |
| * | |
| * Table Zebra Stripping | |
| * | |
| * */ | |
| /* Scope of cells */ | |
| td { | |
| &.table-keycell { | |
| padding: 8px; | |
| } | |
| &.table-desccell { | |
| font-style: italic; | |
| padding: 8px; | |
| } | |
| } | |
| td, th { | |
| &.table-layoutCell { | |
| background-color: #fff; | |
| } | |
| } | |
| /* Summary Group Styling */ | |
| tr.table-summary, tbody.table-summary tr, | |
| colgroup col.table-summary, colgroup.table-summary, | |
| tfoot tr, td.table-summary { | |
| background-color: #eee; /* Summary Row/Col highligth */ | |
| } | |
| /* Delimiter between table group */ | |
| tbody, tfoot { | |
| &.table-rowgroupmarker { | |
| border-top: solid black 2px; | |
| } | |
| } | |
| colgroup { | |
| &.table-colgroupmarker { | |
| border-left: solid black 2px; | |
| } | |
| } | |
| /* Traditionel Table Zebra Stripping */ | |
| &.colzebra { | |
| colgroup { | |
| col { | |
| &:nth-child(2n) { | |
| @extend %zebra-table-odd; | |
| } | |
| } | |
| } | |
| } | |
| &.rowzebra { | |
| tbody { | |
| tr { | |
| &:nth-child(2n) { | |
| @extend %zebra-table-odd; | |
| } | |
| } | |
| } | |
| } | |
| /* Column Effect */ | |
| &.columnhighlight { | |
| colgroup { | |
| col.table-hover { | |
| background-color: #eee; | |
| } | |
| &.table-summary col.table-hover { | |
| @extend %zebra-table-summary-hover; | |
| } | |
| } | |
| th.table-hover { | |
| background-color: #ccc; | |
| } | |
| &.table-accent th.table-hover { | |
| background-color: #555; | |
| } | |
| &.table-medium th.table-hover { | |
| background-color: #222; | |
| } | |
| &.table-dark th.table-hover { | |
| background-color: #666; | |
| } | |
| &.table-simplify th.table-hover { | |
| background-color: transparent; | |
| } | |
| } | |
| /* Row Effect */ | |
| &.rowtdhover { | |
| tbody, tfoot { | |
| tr:hover, /*tr.table-hover,*/ tr.table-hover td, | |
| tr:hover td.table-keycell, tr.table-hover td.table-keycell, | |
| tr:hover td.table-desccell, tr.table-hover td.table-desccell, | |
| tr:hover td.table-layoutCell, tr.table-hover td.table-layoutCell, | |
| tr:hover th.table-layoutCell, tr.table-hover th.table-layoutCell { | |
| background-color: #eee; | |
| } | |
| /* Hover for summary rows */ | |
| tr.table-summary:hover, tr.table-summary.table-hover td, | |
| tr.table-summary:hover td.table-keycell, tr.table-summary.table-hover td.table-keycell, | |
| tr.table-summary:hover td.table-desccell, tr.table-summary.table-hover td.table-desccell, | |
| tr.table-summary:hover td.table-layoutCell, tr.table-summary.table-hover td.table-layoutCell, | |
| tr.table-summary:hover th.table-layoutCell, tr.table-summary.table-hover th.table-layoutCell { | |
| @extend %zebra-table-summary-hover; | |
| } | |
| } | |
| } | |
| &.rowhover { | |
| tbody, tfoot { | |
| tr:hover, /*tr.table-hover,*/ tr.table-hover td, | |
| tr:hover td.table-keycell, tr.table-hover td.table-keycell, | |
| tr:hover td.table-desccell, tr.table-hover td.table-desccell, | |
| tr:hover td.table-layoutCell, tr.table-hover td.table-layoutCell, | |
| tr:hover th.table-layoutCell, tr.table-hover th.table-layoutCell { | |
| background-color: #eee; | |
| } | |
| /* Hover for summary rows */ | |
| tr.table-summary:hover, tr.table-summary.table-hover td, | |
| tr.table-summary:hover td.table-keycell, tr.table-summary.table-hover td.table-keycell, | |
| tr.table-summary:hover td.table-desccell, tr.table-summary.table-hover td.table-desccell, | |
| tr.table-summary:hover td.table-layoutCell, tr.table-summary.table-hover td.table-layoutCell, | |
| tr.table-summary:hover th.table-layoutCell, tr.table-summary.table-hover th.table-layoutCell { | |
| @extend %zebra-table-summary-hover; | |
| } | |
| tr:hover th, tr.table-hover th { | |
| background-color: #ccc; | |
| } | |
| /* | |
| * Uncomment to have white cell at the mouse intersection | |
| tr:hover td:hover { | |
| background-color: #fff; | |
| } | |
| */ | |
| } | |
| &.table-accent tbody, &.table-accent tfoot { | |
| tr:hover th, tr.table-hover th { | |
| background-color: #555; | |
| } | |
| } | |
| &.table-medium tbody, &.table-medium tfoot { | |
| tr:hover th, tr.table-hover th { | |
| background-color: #222; | |
| } | |
| } | |
| &.table-dark tbody, &.table-dark tfoot { | |
| tr:hover th, tr.table-hover th { | |
| background-color: #666; | |
| } | |
| } | |
| &.table-simplify tbody tr th, &.table-simplify tfoot tr th { | |
| background-color: transparent; | |
| } | |
| } | |
| } |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment