Fediversity/fediversity_website_archive
Archived
7
0
Fork 0
forked from laurens/fediversity_website
Code Pull requests Activity

Opmaak voor tabellen

Browse source
This commit is contained in:
Michael Boelen 2023-05-15 13:11:28 +02:00
parent 670ee0037c
commit a1655b7525
1 changed files with 112 additions and 0 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

112
themes/nluug/assets/scss/styles.scss
View file

@ -393,3 +393,115 @@ img {
display: inline; display: inline;
} }
/* Table Styles */
.table-wrapper{
margin: 10px 10px 30px;
box-shadow: 0px 10px 20px rgba( 0, 0, 0, 0.2 );
}
.fl-table {
border-radius: 5px;
font-size: 12px;
font-weight: normal;
border: none;
border-collapse: collapse;
width: 100%;
max-width: 100%;
background-color: white;
}
.fl-table td, .fl-table th {
//text-align: center;
padding: 8px;
}
.fl-table td {
border-right: 1px solid #f8f8f8;
font-size: 12px;
}
.fl-table tbody tr th {
text-align: left;
}
.fl-table thead th {
color: #ffffff;
background: #324960;
}
.fl-table thead th:nth-child(odd) {
color: #ffffff;
background: #324960;
}
.fl-table tr:nth-child(even) {
background: #F8F8F8;
}
/* Responsive */
@media (max-width: 767px) {
.fl-table {
display: block;
width: 100%;
}
.table-wrapper:before{
content: "Scroll horizontally >";
display: block;
text-align: right;
font-size: 11px;
color: white;
padding: 0 0 10px;
}
.fl-table thead, .fl-table tbody, .fl-table thead th {
display: block;
}
.fl-table thead th:last-child{
border-bottom: none;
}
.fl-table thead {
float: left;
}
.fl-table tbody {
width: auto;
position: relative;
overflow-x: auto;
}
.fl-table td, .fl-table th {
padding: 20px .625em .625em .625em;
height: 60px;
vertical-align: middle;
box-sizing: border-box;
overflow-x: hidden;
overflow-y: auto;
width: 120px;
font-size: 13px;
text-overflow: ellipsis;
}
.fl-table thead th {
text-align: left;
border-bottom: 1px solid #f7f7f9;
}
.fl-table tbody tr {
display: table-cell;
}
.fl-table tbody tr:nth-child(odd) {
background: none;
}
.fl-table tr:nth-child(even) {
background: transparent;
}
.fl-table tr td:nth-child(odd) {
background: #F8F8F8;
border-right: 1px solid #E6E4E4;
}
.fl-table tr td:nth-child(even) {
border-right: 1px solid #E6E4E4;
}
.fl-table tbody td {
display: block;
text-align: center;
}
}