Improve option group styling and provide a bit of scope to keep styles from "leaking"
Showing
1 changed file
with
49 additions
and
21 deletions
| ... | @@ -1282,57 +1282,85 @@ h6.fieldset-heading { | ... | @@ -1282,57 +1282,85 @@ h6.fieldset-heading { |
| 1282 | font-size: 10px !important; | 1282 | font-size: 10px !important; |
| 1283 | } | 1283 | } |
| 1284 | 1284 | ||
| 1285 | .remove-group, .remove-option { | 1285 | .list-plain { |
| 1286 | float: right; | 1286 | list-style: none; |
| 1287 | margin-right: 15px; | ||
| 1288 | } | 1287 | } |
| 1289 | 1288 | ||
| 1290 | .ui-state-highlight { | 1289 | .block { |
| 1291 | height: 30px; | 1290 | display: block; |
| 1292 | } | 1291 | } |
| 1293 | 1292 | ||
| 1294 | .child-option-groups { | 1293 | .input-spaced { |
| 1295 | margin-left: 20px; | 1294 | margin-bottom: 15px; |
| 1296 | } | 1295 | } |
| 1297 | 1296 | ||
| 1298 | .plain { | 1297 | .label-vertical { |
| 1299 | list-style: none; | 1298 | display: block; |
| 1300 | } | 1299 | } |
| 1301 | 1300 | ||
| 1302 | .ui-sortable-helper { | 1301 | .ui-sortable-helper { |
| 1303 | opacity: 0.5; | 1302 | opacity: 0.5; |
| 1304 | } | 1303 | } |
| 1305 | 1304 | ||
| 1306 | .sortable .sortable-placeholder { | 1305 | .ui-state-highlight { |
| 1307 | height: 30px; | 1306 | height: 30px; |
| 1308 | } | 1307 | } |
| 1309 | 1308 | ||
| 1310 | .sortable { | 1309 | .option-groups-region .remove-group, |
| 1310 | .option-groups-region .remove-option { | ||
| 1311 | float: right; | ||
| 1312 | } | ||
| 1313 | |||
| 1314 | .option-groups-region .remove-option { | ||
| 1315 | margin-top: 4px; | ||
| 1316 | } | ||
| 1317 | |||
| 1318 | .option-groups-region .sortable .sortable-placeholder { | ||
| 1319 | height: 30px; | ||
| 1320 | } | ||
| 1321 | |||
| 1322 | .option-groups-region .sortable { | ||
| 1311 | margin-left: 0; | 1323 | margin-left: 0; |
| 1312 | } | 1324 | } |
| 1313 | 1325 | ||
| 1314 | .sortable li { | 1326 | .option-groups-region .sortable li { |
| 1315 | width: 100%; | ||
| 1316 | background-color: #ccc; | 1327 | background-color: #ccc; |
| 1317 | border: 1px solid #aaa; | 1328 | border: 1px solid #aaa; |
| 1318 | overflow: hidden; | 1329 | padding-left: 5px; |
| 1330 | padding-right: 5px; | ||
| 1319 | } | 1331 | } |
| 1320 | 1332 | ||
| 1321 | .accordion-header { | 1333 | .option-groups-region .accordion-header { |
| 1334 | overflow: hidden; | ||
| 1322 | display: block; | 1335 | display: block; |
| 1323 | width: 98%; | 1336 | width: 96%; |
| 1324 | min-height: 30px; | ||
| 1325 | cursor: move; | 1337 | cursor: move; |
| 1338 | margin-top: 0 !important; | ||
| 1339 | padding: 10px; | ||
| 1340 | } | ||
| 1341 | |||
| 1342 | .option-groups-region .accordion-content { | ||
| 1326 | margin: 0 !important; | 1343 | margin: 0 !important; |
| 1327 | padding: 10px 10px 0 10px; | 1344 | padding: 0; |
| 1328 | } | 1345 | } |
| 1329 | 1346 | ||
| 1330 | .accordion-header, .accordion-content { | 1347 | .option-groups-region .accordion-content .field { |
| 1331 | margin-left: 10px; | 1348 | margin: 0; |
| 1349 | padding-left: 13px !important; | ||
| 1350 | } | ||
| 1351 | |||
| 1352 | .option-groups-region .accordion-content .field-option { | ||
| 1353 | padding: 10px !important; | ||
| 1354 | } | ||
| 1355 | |||
| 1356 | .option-groups-region div input[type=text], | ||
| 1357 | .option-groups-region div textarea { | ||
| 1358 | width: 78%; | ||
| 1332 | } | 1359 | } |
| 1333 | 1360 | ||
| 1334 | .group-title:hover { | 1361 | .option-groups-region .group-title:hover { |
| 1335 | cursor: pointer; | 1362 | cursor: pointer; |
| 1363 | color: rgb(33, 117, 155); | ||
| 1336 | } | 1364 | } |
| 1337 | 1365 | ||
| 1338 | .dragged { | 1366 | .dragged { | ... | ... |
-
Please register or sign in to post a comment