siwi-table
Version:
table for siwi
153 lines (142 loc) • 3.82 kB
CSS
/**
* @author [siwi]
* @email [siwi@siwi.me]
* @create date 2017-04-28 05:24:08
* @modify date 2017-04-28 05:26:26
* @desc [variables for Siwi UI]
*/
/*--------------------------------------------------------
Base font-size
---------------------------------------------------------*/
/*--------------------------------------------------------
Layout And Grid
---------------------------------------------------------*/
/*--------------------------------------------------------
Media queries breakpoints
---------------------------------------------------------*/
/*--------------------------------------------------------
Site Colors
---------------------------------------------------------*/
/*--------------------- Colors ------------------------*/
/*------------------ Light Colors -------------------*/
/*------------------- Neutrals ---------------------*/
/*--------------- Colored Backgrounds ----------------*/
/*--------------------------------------------------------
Border
---------------------------------------------------------*/
/*--------------------------------------------------------
Button
---------------------------------------------------------*/
/*--------------------------------------------------------
Input
---------------------------------------------------------*/
/*--------------------------------------------------------
Animate
---------------------------------------------------------*/
/*--------------------------------------------------------
Shadow
---------------------------------------------------------*/
/*--------------------------------------------------------
Z-index
---------------------------------------------------------*/
.sw.table
{
width: 100%;
border-spacing: 0;
border-collapse: separate;
text-align: left;
color: #545454;
border: 1px solid rgba(34, 36, 38, .15);
border-radius: 3px;
background: #fff;
box-shadow: none;
}
.sw.table:first-child
{
margin-top: 0;
}
.sw.table::last-child
{
margin-bottom: 0;
}
.sw.table th,
.sw.table td
{
transition: background .1s ease, color .1s ease;
}
.sw.table tr td
{
padding: .5rem 1rem;
border-top: 1px solid rgba(34, 36, 38, .15);
}
.sw.table tr:first-child td
{
border-top: none;
}
.sw.table thead
{
box-shadow: none;
}
.sw.table thead th
{
font-weight: bold;
font-style: none;
padding: .6rem 1em;
cursor: auto;
text-align: inherit;
vertical-align: inherit;
text-transform: none;
color: #1b1c1d;
border-bottom: 1px solid rgba(34, 36, 38, .15);
border-left: none;
background: #f9fafb;
}
.sw.table thead tr > th:first-child
{
border-left: none;
}
.sw.table thead tr:first-child > th:first-child
{
border-radius: 3px 0 0 0;
}
.sw.table thead tr:first-child > th:last-child
{
border-radius: 0 3px 0 0;
}
.sw.table thead tr:first-child > th:only-child
{
border-radius: 3px 3px 0 0;
}
.sw.table tfoot
{
box-shadow: none;
}
.sw.table tfoot th
{
font-weight: normal;
font-style: normal;
padding: .78571429em .78571429em;
cursor: auto;
text-align: inherit;
vertical-align: middle;
text-transform: none;
color: rgba(0, 0, 0, .87);
border-top: 1px solid rgba(34, 36, 38, .15);
background: #f9fafb;
}
.sw.table tfoot tr > th:first-child
{
border-left: none;
}
.sw.table tfoot tr > th:first-child:first-child
{
border-radius: 0 0 0 3px;
}
.sw.table tfoot tr > th:first-child:last-child
{
border-radius: 0 0 3px 0;
}
.sw.table tfoot tr > th:first-child:only-child
{
border-radius: 0 0 3px 3px;
}