1
0
mirror of https://github.com/Chalarangelo/mini.css.git synced 2025-08-12 00:43:57 +02:00

Responsiveness for striped tables

This commit is contained in:
Angelos Chalaris
2016-11-22 00:13:06 +02:00
parent 42ee89f147
commit f3acf0b06d
5 changed files with 14 additions and 2 deletions

View File

@@ -939,6 +939,9 @@ table {
table.striped tr:nth-of-type(2n) > td {
background: #eeeeee; }
@media (max-width: 767px) {
table.striped:not(.preset) tr:nth-of-type(2n) {
background: #eeeeee; } }
.card {
display: -webkit-box;
-webkit-box-orient: vertical;

File diff suppressed because one or more lines are too long

View File

@@ -505,3 +505,4 @@
- Tested new `table` module functionality thoroughly. Everything seems to work like a charm, even if the implementation is a little bit fiddly due to flexbox playing some tricks.
- Updated a few colors for consistency.
- Added support for `striped` `table`s in the `table` module. Updated accordingly with variables and the likes.
- Added responsiveness for `striped` `table`s.

View File

@@ -171,7 +171,7 @@
<br>
<table class="horizontal">
<table class="horizontal striped">
<caption>Hacker List</caption>
<thead>
<tr>

View File

@@ -277,4 +277,12 @@ table.#{$table-striped-name} {
tr:nth-of-type(2n) > td {
background: $table-striped-alt-body-back-color;
}
}
// Responsiveness for striped tables.
@media (max-width: #{$table-mobile-breakpoint}) {
table.#{$table-striped-name}:not(.#{$table-not-responsive-name}) {
tr:nth-of-type(2n) {
background: $table-striped-alt-body-back-color;
}
}
}