datatable.css - www.codemadness.org - www.codemadness.org saait content files
(HTM) git clone git://git.codemadness.org/www.codemadness.org
(DIR) Log
(DIR) Files
(DIR) Refs
(DIR) README
(DIR) LICENSE
---
datatable.css (4072B)
---
1 table.datatable {
2 table-layout: fixed;
3 border-collapse: collapse;
4 }
5
6 table.datatable tr th {
7 -webkit-touch-callout: none;
8 -webkit-user-select: none;
9 -khtml-user-select: none;
10 -moz-user-select: none;
11 -ms-user-select: none;
12 user-select: none;
13 }
14
15 table.datatable tr td {
16 border: 1px solid #aaa;
17 padding: 0 3px 0 3px;
18 line-height: 25px;
19 }
20
21 table.datatable tr th {
22 border: 1px solid #aaa;
23 padding: 0 16px 0 3px;
24 line-height: 25px;
25 }
26
27 table.datatable thead td,
28 table.datatable thead th {
29 background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABMAAAATCAMAAABFjsb+AAAAVFBMVEX////c3Nzc3Nzc3Nzc3Nzc3Nzc3Nzc3Nzc3Nzc3Nzc3Nzc3Nzc3Nzc3Nzc3Nzc3Nzc3Nzc3Nzc3Nzc3Nzc3Nzc3Nzc3Nzc3Nzc3Nzc3Nzc3Nzc3NzIvRbaAAAAG3RSTlMAAPf5AQprKuOQBnX6nZFB7vI8Db64B2HbI1kLO0PyAAAAaklEQVQYGZXBxw3EABADMY1zzln993nwa38HmNQnQF43gALQdgWgAGXl6wYFst72kKHAONmeFxTWza/9UDjT5JU++u9Jk1d6Khy7X9uqwDLbnkYUyAbbfYYC3JerEhSAomsBBaCpc0Bf/AAeJAWLTmqG7wAAAABJRU5ErkJggg==");
30 background-position: right center;
31 background-repeat: no-repeat;
32 cursor: pointer;
33 }
34
35 table.datatable thead td,
36 table.datatable thead th,
37 table.datatable tfoot td,
38 table.datatable tfoot th {
39 background-color: #eee;
40 }
41
42 table.datatable thead tr td:hover,
43 table.datatable thead tr th:hover {
44 background-color: #ccc;
45 }
46
47 table.datatable thead .sort-asc {
48 background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABMAAAATCAYAAAByUDbMAAABIklEQVQ4y9WTL0gEQRTGf7Oji3/xEGwugj6xGsRmE4wG04UD4YqgxSDYLRtFMAnaTIeCySBosW02jUmzntxxKnI3lgvHMjt3e2rwKwPzPb75vnnvwS9Cda2IkwhYBW7YX3rylQbdtEYVu8BpCNs/cxYn0YjCNCzhmOK9blnwuQt8QgXNVcMSAtQtwxMBlXbs3DHL1SaLnRdvLZaBcj6xOIkKgdp0UZNalbLcOcXGA/aqLTvj4l6adjaEnZ7FprRe9/VlelBv8NdwjoYxpgicAx8ZabZE5CxNDGQ8ctE+hxzcLVDp+c9E5BNYAWop6hU4EJFa3jm7B9JRLoG7vtbJGDMHXAMCPANrIvLQ16KLyCNwCHwBRz4hXwM6cQLMA8f8W3wDnmNEHIbRWQMAAAAASUVORK5CYII=");
49 }
50
51 table.datatable thead .sort-desc {
52 background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABMAAAATCAYAAAByUDbMAAABGUlEQVQ4y82Uv0oDQRDGf3unGIOiWCtCnMpOuM7G0lbxFayENGnuEQSxEVMGBGsLS8EnEEHbwHigZyeIRCN6YbM21yiX+6OgLgwDM7PzfcN+s/BfjykqUNU60AcmRCTJq/VKAO6kfvtHzFR1GTgD5gEF1kXkpjIzVTVAK20EIEAzjVcecw3Y+BJrAquVxlTVaaCXA1QTkfeyzLZS/5ZhAJt/o7PG/pVGA7s06lJj3L+LWiuLpca8H9iTPAYP1p6Wfs0EDud8E2XlZj1z+zxkr7w0wiB+tO44K/U0dEeEQVxVZ50Zj4tPrHyugc73Fn33cmHK0H1xTNYNyatDRrEqXvQwiBPHQYrazmsEMFaknQTaQLfvOP/Vz/EDaOlUh4wYGM8AAAAASUVORK5CYII=");
53 }
54
55 table.datatable thead .sort-disabled {
56 background-image: none;
57 cursor: default;
58 }
59
60 table.datatable tbody tr:nth-child(2n+1) td {
61 background-color: #f9f9f9;
62 }
63
64 table.datatable tbody tr:hover td {
65 background-color: #ccc;
66 }
67
68 /* datatable lazy scroll styles below */
69 .datatable-lazyscroll-container {
70 overflow: hidden;
71 position: relative;
72 }
73
74 .datatable-lazyscroll-container table {
75 table-layout: fixed;
76 border-collapse: collapse;
77 width: 1px;
78 height: 1px;
79 }
80
81 .datatable-lazyscroll-headers {
82 overflow: hidden;
83 position: relative;
84 margin-right: 17px; /* fix scrollbar */
85 }
86
87 .datatable-lazyscroll-headers th {
88 height: 25px !important;
89 text-align: left;
90 }
91
92 .datatable-lazyscroll-body td {
93 overflow: hidden !important;
94 line-height: 25px !important;
95 margin: 0 !important;
96 padding-top: 0 !important;
97 padding-bottom: 0 !important;
98 }
99
100 .datatable-lazyscroll-body {
101 overflow-y: scroll;
102 overflow-x: auto;
103 position: relative;
104 }
105
106 .datatable-lazyscroll-headers th {
107 border-bottom: 0 !important;
108 }
109
110 .datatable-lazyscroll-container {
111 height: 608px;
112 }
113
114 .datatable-lazyscroll-body {
115 height: 580px;
116 }
117
118 .datatable-lazyscroll-container th {
119 width: 150px;
120 }
121
122 @media (prefers-color-scheme: dark) {
123 table.datatable tr th,
124 table.datatable tr td {
125 border-color: #777;
126 }
127 table.datatable thead td,
128 table.datatable thead th,
129 table.datatable tfoot td,
130 table.datatable tfoot th {
131 background-color: #111;
132 }
133 table.datatable thead tr td:hover,
134 table.datatable thead tr th:hover {
135 background-color: #333;
136 }
137 table.datatable tbody tr td {
138 background-color: #111;
139 }
140 table.datatable tbody tr:nth-child(2n+1) td {
141 background-color: #222;
142 }
143 table.datatable tbody tr:hover td {
144 background-color: #333;
145 }
146 }