Wiki source code of CHOPlist
Version 39.1 by Marco Weber on 2026/10/05 15:19
Show last authors
| author | version | line-number | content |
|---|---|---|---|
| 1 | ```text | ||
| 2 | {{html clean="false"}} | ||
| 3 | <style> | ||
| 4 | |||
| 5 | /* ========================================================= | ||
| 6 | CHOP LiveData – Tabellenformatierung | ||
| 7 | ========================================================= */ | ||
| 8 | |||
| 9 | /* Gesamte Tabelle */ | ||
| 10 | table.layout-table-root.responsive-table { | ||
| 11 | width: 100%; | ||
| 12 | border-collapse: collapse; | ||
| 13 | table-layout: fixed; | ||
| 14 | } | ||
| 15 | |||
| 16 | /* ========================================================= | ||
| 17 | Kopfzeile | ||
| 18 | ========================================================= */ | ||
| 19 | |||
| 20 | table.layout-table-root.responsive-table thead th { | ||
| 21 | font-weight: bold; | ||
| 22 | font-size: 1.0em; | ||
| 23 | background-color: #00BFFF; | ||
| 24 | border: 1px solid #999; | ||
| 25 | padding: 7px 6px; | ||
| 26 | vertical-align: middle; | ||
| 27 | } | ||
| 28 | |||
| 29 | /* Eigentliche Spaltenbezeichnung */ | ||
| 30 | table.layout-table-root.responsive-table thead .property-name { | ||
| 31 | font-weight: bold; | ||
| 32 | } | ||
| 33 | |||
| 34 | /* Sortier-Button nicht unnötig hervorheben */ | ||
| 35 | table.layout-table-root.responsive-table thead .handle { | ||
| 36 | font-weight: bold; | ||
| 37 | } | ||
| 38 | |||
| 39 | /* ========================================================= | ||
| 40 | Filterzeile | ||
| 41 | ========================================================= */ | ||
| 42 | |||
| 43 | table.layout-table-root.responsive-table thead tr.column-filters th { | ||
| 44 | background-color: #fafafa; | ||
| 45 | border: 1px solid #bbb; | ||
| 46 | padding: 4px 5px; | ||
| 47 | } | ||
| 48 | |||
| 49 | /* Filter-Eingabefelder */ | ||
| 50 | table.layout-table-root.responsive-table .livedata-filter { | ||
| 51 | width: 100%; | ||
| 52 | box-sizing: border-box; | ||
| 53 | } | ||
| 54 | |||
| 55 | table.layout-table-root.responsive-table .filter-text, | ||
| 56 | table.layout-table-root.responsive-table .filter-date { | ||
| 57 | width: 100%; | ||
| 58 | box-sizing: border-box; | ||
| 59 | min-height: 28px; | ||
| 60 | } | ||
| 61 | |||
| 62 | /* Selectize-Filter */ | ||
| 63 | table.layout-table-root.responsive-table .selectize-control { | ||
| 64 | width: 100%; | ||
| 65 | } | ||
| 66 | |||
| 67 | table.layout-table-root.responsive-table .selectize-input { | ||
| 68 | min-height: 28px; | ||
| 69 | padding: 4px 6px; | ||
| 70 | box-sizing: border-box; | ||
| 71 | } | ||
| 72 | |||
| 73 | /* ========================================================= | ||
| 74 | Datenzellen | ||
| 75 | ========================================================= */ | ||
| 76 | |||
| 77 | table.layout-table-root.responsive-table tbody td { | ||
| 78 | border: 1px solid #bbb; | ||
| 79 | padding: 6px 6px; | ||
| 80 | vertical-align: top; | ||
| 81 | overflow-wrap: break-word; | ||
| 82 | word-wrap: break-word; | ||
| 83 | } | ||
| 84 | |||
| 85 | /* ========================================================= | ||
| 86 | Spaltenbreiten | ||
| 87 | ========================================================= */ | ||
| 88 | ```text | ||
| 89 | /* ========================================================= | ||
| 90 | Spaltenbreiten | ||
| 91 | Reihenfolge: | ||
| 92 | 1 code | ||
| 93 | 2 text_de | ||
| 94 | 3 text_fr | ||
| 95 | 4 text_it | ||
| 96 | 5 valid_start | ||
| 97 | 6 valid_end | ||
| 98 | 7 chop_like | ||
| 99 | 8 treat_cat | ||
| 100 | 9 topo_group | ||
| 101 | 10 chcr_only | ||
| 102 | ========================================================= */ | ||
| 103 | |||
| 104 | table.layout-table-root.responsive-table th:nth-child(1), | ||
| 105 | table.layout-table-root.responsive-table td:nth-child(1) { | ||
| 106 | width: 5%; | ||
| 107 | } | ||
| 108 | |||
| 109 | table.layout-table-root.responsive-table th:nth-child(2), | ||
| 110 | table.layout-table-root.responsive-table td:nth-child(2) { | ||
| 111 | width: 19%; | ||
| 112 | } | ||
| 113 | |||
| 114 | table.layout-table-root.responsive-table th:nth-child(3), | ||
| 115 | table.layout-table-root.responsive-table td:nth-child(3) { | ||
| 116 | width: 19%; | ||
| 117 | } | ||
| 118 | |||
| 119 | table.layout-table-root.responsive-table th:nth-child(4), | ||
| 120 | table.layout-table-root.responsive-table td:nth-child(4) { | ||
| 121 | width: 19%; | ||
| 122 | } | ||
| 123 | |||
| 124 | table.layout-table-root.responsive-table th:nth-child(5), | ||
| 125 | table.layout-table-root.responsive-table td:nth-child(5) { | ||
| 126 | width: 5%; | ||
| 127 | } | ||
| 128 | |||
| 129 | table.layout-table-root.responsive-table th:nth-child(6), | ||
| 130 | table.layout-table-root.responsive-table td:nth-child(6) { | ||
| 131 | width: 5%; | ||
| 132 | } | ||
| 133 | |||
| 134 | table.layout-table-root.responsive-table th:nth-child(7), | ||
| 135 | table.layout-table-root.responsive-table td:nth-child(7) { | ||
| 136 | width: 7%; | ||
| 137 | } | ||
| 138 | |||
| 139 | table.layout-table-root.responsive-table th:nth-child(8), | ||
| 140 | table.layout-table-root.responsive-table td:nth-child(8) { | ||
| 141 | width: 7%; | ||
| 142 | } | ||
| 143 | |||
| 144 | table.layout-table-root.responsive-table th:nth-child(9), | ||
| 145 | table.layout-table-root.responsive-table td:nth-child(9) { | ||
| 146 | width: 7%; | ||
| 147 | } | ||
| 148 | |||
| 149 | table.layout-table-root.responsive-table th:nth-child(10), | ||
| 150 | table.layout-table-root.responsive-table td:nth-child(10) { | ||
| 151 | width: 7%; | ||
| 152 | } | ||
| 153 | |||
| 154 | /* ========================================================= | ||
| 155 | Ausrichtung | ||
| 156 | ========================================================= */ | ||
| 157 | |||
| 158 | /* Code */ | ||
| 159 | table.layout-table-root.responsive-table td[data-title="code"] { | ||
| 160 | text-align: center; | ||
| 161 | } | ||
| 162 | |||
| 163 | /* Datumsfelder */ | ||
| 164 | table.layout-table-root.responsive-table td[data-title="valid_start"], | ||
| 165 | table.layout-table-root.responsive-table td[data-title="valid_end"] { | ||
| 166 | text-align: center; | ||
| 167 | white-space: nowrap; | ||
| 168 | } | ||
| 169 | |||
| 170 | /* Kleine Klassifikationsfelder */ | ||
| 171 | table.layout-table-root.responsive-table td[data-title="chop_like"], | ||
| 172 | table.layout-table-root.responsive-table td[data-title="treat_cat"], | ||
| 173 | table.layout-table-root.responsive-table td[data-title="topo_group"], | ||
| 174 | table.layout-table-root.responsive-table td[data-title="chcr_only"] { | ||
| 175 | text-align: center; | ||
| 176 | } | ||
| 177 | |||
| 178 | /* ========================================================= | ||
| 179 | Header-Ausrichtung | ||
| 180 | ========================================================= */ | ||
| 181 | |||
| 182 | table.layout-table-root.responsive-table th[data-title="code"], | ||
| 183 | table.layout-table-root.responsive-table th[data-title="valid_start"], | ||
| 184 | table.layout-table-root.responsive-table th[data-title="valid_end"], | ||
| 185 | table.layout-table-root.responsive-table th[data-title="chop_like"], | ||
| 186 | table.layout-table-root.responsive-table th[data-title="treat_cat"], | ||
| 187 | table.layout-table-root.responsive-table th[data-title="topo_group"], | ||
| 188 | table.layout-table-root.responsive-table th[data-title="chcr_only"] { | ||
| 189 | text-align: center; | ||
| 190 | } | ||
| 191 | |||
| 192 | </style> | ||
| 193 | {{/html}} | ||
| 194 | |||
| 195 | {{liveData | ||
| 196 | id="choplist" | ||
| 197 | properties="code,text_de,text_fr,text_it,valid_start,valid_end,chop_like,treat_cat,topo_group,chcr_only" | ||
| 198 | source="liveTable" | ||
| 199 | sourceParameters="className=CHOPlist.Code.CHOPlistClass&translationPrefix=choplist.livetable." | ||
| 200 | sort="code:asc" | ||
| 201 | limit="15" | ||
| 202 | layouts="table" | ||
| 203 | showPageSizeDropdown="true" | ||
| 204 | pageSizes="15,25,50,100" | ||
| 205 | }} |