32720c56a6
Many tables in kfet app templates become sortable: account list, negative account list, article list, article inventory list, article supplier list, article category list, checkout list, checkout statement list, inventory list, inventory details, order list, order creation, order details. This is achieved thanks to the jQuery plugin 'tablesorter': https://mottie.github.io/tablesorter/docs/ - Affected tables also got sticky headers (it stays visible on scroll). - Dates format are modified in order to ease the date sorting with the plugin (it avoids writing a custom parser, or an extractor from additional hidden element in the table cells). - Tables whose content is classified by category (of articles) now uses several tbodies. This has minor effects on the tables style. - Tags of the header help signs become 'i', instead of 'span', in order to avoid weird spacing.
122 lines
1.6 KiB
CSS
122 lines
1.6 KiB
CSS
/* General ------------------------- */
|
|
|
|
body {
|
|
margin-top:50px;
|
|
font-family:Roboto;
|
|
background:#ddd;
|
|
}
|
|
|
|
.glyphicon + span, span + .glyphicon {
|
|
margin-left: 10px;
|
|
}
|
|
|
|
/* Titles */
|
|
|
|
h1,h2,h3,h4,h5,h6 {
|
|
font-family:"Roboto Slab";
|
|
}
|
|
|
|
/* Links */
|
|
|
|
a {
|
|
color:#C8202E;
|
|
}
|
|
|
|
a:focus, a:hover {
|
|
color:#C8102E;
|
|
}
|
|
|
|
/* Inputs */
|
|
|
|
:focus {
|
|
outline:none;
|
|
}
|
|
|
|
textarea {
|
|
font-family:'Roboto Mono';
|
|
border-radius:0 !important;
|
|
}
|
|
|
|
/* Lists */
|
|
|
|
ul, ol {
|
|
padding-left: 30px;
|
|
}
|
|
|
|
ul {
|
|
list-style-type: square;
|
|
}
|
|
|
|
/* Tables */
|
|
|
|
.table {
|
|
margin-bottom:0;
|
|
border-bottom:1px solid #ddd;
|
|
width:100%;
|
|
background-color: #FFF;
|
|
}
|
|
|
|
.table td {
|
|
vertical-align:middle !important;
|
|
}
|
|
|
|
.table td.no-padding {
|
|
padding:0;
|
|
}
|
|
|
|
.table thead {
|
|
background:#c8102e;
|
|
color:#fff;
|
|
font-weight:bold;
|
|
font-size:16px;
|
|
}
|
|
|
|
.table thead td {
|
|
padding:8px !important;
|
|
}
|
|
|
|
.table thead .sm-padding {
|
|
padding:3px !important;
|
|
}
|
|
|
|
.table tr.section {
|
|
background: #c63b52 !important;
|
|
color:#fff;
|
|
font-weight:bold;
|
|
}
|
|
|
|
.table tr.section td {
|
|
border-top:0;
|
|
font-size:16px;
|
|
padding:8px 30px;
|
|
}
|
|
|
|
.table tr.more td {
|
|
padding: 0;
|
|
}
|
|
|
|
.table-responsive {
|
|
border: 0;
|
|
margin-bottom: 0;
|
|
}
|
|
|
|
/* Toggle on hover ----------------- */
|
|
|
|
.toggle:not(:hover) .hover {
|
|
display: none;
|
|
}
|
|
|
|
.toggle:hover .base {
|
|
display: none;
|
|
}
|
|
|
|
/* Spinning animation -------------- */
|
|
|
|
.glyphicon.spinning {
|
|
animation: spin 1s infinite linear;
|
|
}
|
|
|
|
@keyframes spin {
|
|
from { transform: scale(1) rotate(0deg); }
|
|
to { transform: scale(1) rotate(360deg); }
|
|
}
|