mirror_css/nes.css
1
0
Fork 0
mirror of https://github.com/nostalgic-css/NES.css.git synced 2025-09-02 18:42:47 +02:00
Code Issues Releases Wiki Activity

Added table new design with two classes, is -bordered that adds a border and is-centered that aligns all the table headers to the center. Updated index.html (docs).

Browse Source
This commit is contained in:
Igor Guastalla de Lima
2018-11-29 20:02:46 -02:00
parent eee2e0e113
commit 66bd33a590
2 changed files with 54 additions and 1 deletions
Download Patch File Download Diff File Expand all files Collapse all files

30
css/nes.css
View File

@@ -1068,4 +1068,32 @@ button,
box-shadow: 24px 6px #333,78px 6px #333,24px 12px #333,30px 12px #333,72px 12px #333,78px 12px #333,24px 18px #333,30px 18px #333,36px 18px #333,42px 18px #333,48px 18px #333,54px 18px #333,60px 18px #333,66px 18px #333,72px 18px #333,78px 18px #333,18px 24px #333,24px 24px #333,30px 24px #333,36px 24px #333,42px 24px #333,48px 24px #333,54px 24px #333,60px 24px #333,66px 24px #333,72px 24px #333,78px 24px #333,84px 24px #333,18px 30px #333,24px 30px #333,30px 30px #333,36px 30px #333,42px 30px #333,48px 30px #333,54px 30px #333,60px 30px #333,66px 30px #333,72px 30px #333,78px 30px #333,84px 30px #333,18px 36px #333,24px 36px #333,30px 36px #333,36px 36px #ffdec4,42px 36px #ffdec4,48px 36px #ffdec4,54px 36px #ffdec4,60px 36px #ffdec4,66px 36px #ffdec4,72px 36px #333,78px 36px #333,84px 36px #333,18px 42px #333,24px 42px #333,30px 42px #ffdec4,36px 42px #ffdec4,42px 42px #ffdec4,48px 42px #ffdec4,54px 42px #ffdec4,60px 42px #ffdec4,66px 42px #ffdec4,72px 42px #ffdec4,78px 42px #333,84px 42px #333,12px 48px #333,18px 48px #333,24px 48px #333,30px 48px #ffdec4,36px 48px #cb7066,42px 48px #ffdec4,48px 48px #ffdec4,54px 48px #ffdec4,60px 48px #ffdec4,66px 48px #cb7066,72px 48px #ffdec4,78px 48px #333,84px 48px #333,12px 54px #333,24px 54px #333,30px 54px #333,36px 54px #ffdec4,42px 54px #ffdec4,48px 54px #cb7066,54px 54px #cb7066,60px 54px #ffdec4,66px 54px #ffdec4,72px 54px #333,78px 54px #333,18px 60px #333,42px 60px #333,48px 60px #333,54px 60px #333,60px 60px #333,24px 66px #333,36px 66px #333,42px 66px #333,48px 66px #333,54px 66px #333,60px 66px #333,66px 66px #333,24px 72px #333,30px 72px #333,36px 72px #333,42px 72px #333,48px 72px #333,54px 72px #333,60px 72px #333,66px 72px #333,36px 78px #333,48px 78px #333,54px 78px #333,66px 78px #333,36px 84px #333,48px 84px #333,54px 84px #333,66px 84px #333,30px 90px #333,42px 90px #333,60px 90px #333,72px 90px #333;;
}
}
/*# sourceMappingURL=nes.css.map */
table.is-bordered {
box-shadow: 0 -4px #212529, 0 -8px #fff, 4px 0 #212529, 4px -4px #fff, 8px 0 #fff, 0 4px #212529, 0 8px #fff, -4px 0 #212529, -4px 4px #fff, -8px 0 #fff, -4px -4px #fff, 4px 4px #fff;
}
table.is-bordered th, table.is-bordered td {
padding: 8.5px;
}
table.is-centered th {
text-align: center;
}
table.is-bordered tr th {
box-shadow: 0 -4px #212529, 0 -8px #fff, 0px 0 #212529, 4px -4px #fff, 8px 0 #fff, 0 4px #212529, 0 8px #fff, -4px 0 #212529, -4px 4px #fff, -8px 0 #fff, -4px -4px #fff, 4px 4px #fff;
}
table.is-bordered tr th:last-child {
box-shadow: 0 -4px #212529, 0 -8px #fff, 4px 0 #212529, 4px -4px #fff, 8px 0 #fff, 0 4px #212529, 0 8px #fff, -4px 0 #212529, -4px 4px #fff, -8px 0 #fff, -4px -4px #fff, 4px 4px #fff;
}
table.is-bordered tr td {
box-shadow: 0px 4px #212529, 4px 6px #fff, 1px 0px #212529, 4px 4px #fff, 1px 0px #fff, -4px 4px #212529, 4px 4px #fff, -4px 0px #212529, -2px 8px #fff, 0px 4px #fff, 1px 0px #fff, 0px 0px #fff;
}
table.is-bordered tr td:last-child {
box-shadow: 0px 0px #212529, 0px -8px #fff, 4px 0px #212527, 4px 0px #fff, 8px 0px #fff, 0px 4px #212529, 0px -8px #fff, -4px 0px #212529, 0px 4px #fff, -4px 0px #fff, 8px 0px #fff, -4px 0px #fff;
}
/*# sourceMappingURL=nes.css.map */

25
index.html
View File

@@ -130,6 +130,31 @@
</div>
</section>
<section class="table container with-title">
<h2 class="title">Table</h2>
<table class="is-bordered is-centered" style="margin:15px 4px 5px 4px">
<thead>
<tr>
<th>Table.is-bordered</th>
<th>Table.is-centered</th>
<th>Good night</th>
</tr>
</thead>
<tbody>
<tr>
<td>Thou hast had a good morning</td>
<td>Thou hast had a good afternoon</td>
<td>Thou hast had a good night</td>
</tr>
<tr>
<td>Thou hast had a good morning</td>
<td>Thou hast had a good afternoon</td>
<td>Thou hast had a good night</td>
</tr>
</tbody>
</table>
</section>
<section class="container with-title">
<h2 class="title">Icons</h2>
<section class="container with-title">