/** * Repeater Custom Control Style */ .customize-control-repeater .customize-control-title{ width: 96%; background: #787878; padding: 5px; border-radius: 2px; color: #fff; } .business-process-repeater-field-control{ background: #FFF; margin-bottom: 12px; display: block; } .business-process-repeater-footer{ margin-top: 15px; text-align: right; } .business-process-repeater-field-control:first-child .business-process-repeater-footer{ display: none; } .business-process-repeater-field-title{ padding: 13px 15px; line-height: 1; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; margin: 0; font-size: 1em; border: 1px solid #e5e5e5; cursor: move; position: relative; border-bottom: 0; } .business-process-repeater-field-title:after { content: "\f142"; font: 400 20px/1 dashicons; position: absolute; right: 0; top: 0; padding: 1px 2px 1px 0; margin-top: 10px; margin-right: 10px; -webkit-border-radius: 50%; border-radius: 50%; cursor: pointer; } .business-process-repeater-field-control.expanded .business-process-repeater-field-title:after{ content: "\f140"; } .business-process-repeater-fields{ padding: 0 10px 10px; border-top: none; line-height: 16px; border: 1px solid #e5e5e5; box-shadow: 0 1px 1px rgba(0,0,0,.04); display: none; } .business-process-repeater-fields .customize-control-title{ margin-top: 10px; } .business-process-repeater-field-control.expanded .business-process-repeater-fields{ display: block; } .business-process-add-control-field { float: right; } .business-process-add-control-field:before { content: "\f132"; display: inline-block; position: relative; left: -2px; top: -1px; font: 400 18px/1 dashicons; vertical-align: middle; } .business-process-fields textarea{ width: 100%; min-height: 100px; } .business-process-fields select{ width: 100%; min-width: none; } .business-process-type-checkbox{ margin-top: 10px; } .business-process-type-checkbox label{ line-height: 20px; display: block; margin-left: 24px; padding-top: 6px; } .business-process-type-checkbox input[type=checkbox]{ margin-right: 8px; margin-left: -24px; } .business-process-type-selector .selector-labels{ margin: 0 -5px; } .business-process-type-selector .selector-labels label{ display: inline-block; padding: 10px 5px 0; position: relative; max-width: 50%; box-sizing: border-box; -moz-box-sizing: border-box; -webkit-box-sizing: border-box; } .business-process-type-selector .selector-labels label img{ vertical-align: middle; } .business-process-type-selector .selector-labels label.selector-selected:after{ content: ""; height: 35px; width: 35px; right: 0; top: 0; position: absolute; background: url(assets/images/selected.png) no-repeat right top; } .business-process-type-radio .radio-labels label{ display: block; padding: 5px 0; } .onoffswitch { position: relative; width: 100px; margin-right: 15px; overflow: hidden; cursor: pointer; } .onoffswitch-inner { width: 200%; margin-left: -100%; -moz-transition: margin .3s ease-in 0s; -webkit-transition: margin .3s ease-in 0s; -o-transition: margin .3s ease-in 0s; transition: margin .3s ease-in 0s } .onoffswitch-inner > div { float: left; position: relative; width: 50%; height: 24px; padding: 0; line-height: 24px; font-size: 12px; color: #fff; font-weight: 700; -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box } .onoffswitch-inner .onoffswitch-active { background-color: #d4d4d4; color: #FFF } .onoffswitch-inner .onoffswitch-inactive { background-color: #d4d4d4; color: #FFF; text-align: right } .onoffswitch-switch { width: 50px; margin: 0; text-align: center; border: 0 solid #999; border-radius: 0; position: absolute; top: 0; bottom: 0 } .onoffswitch-active .onoffswitch-switch { background: #0073aa; left: 0 } .onoffswitch-inactive .onoffswitch-switch { background: #7D7D7D; right: 0 } .switch-on .onoffswitch-inner { margin-left: 0 } .customize-control-fields { padding: 5px; display: block; font-size: 14px; line-height: 24px; font-weight: 500; } .customize-control input[type=number] { width: 40%; } /** =============================================== Icon Picker ================================ **/ .business-process-icon-list { height: 200px; display: block; overflow-y: scroll; background: #fff; border: 1px solid #CCCCCC; width: 100%; } ul.business-process-icon-list li { display: block; float: left; padding: 14px; height: 19px; width: 19px; font-size: 19px; text-align: center; border-radius: 50%; } ul.business-process-icon-list li:hover { cursor: pointer; } .business-process-selected-icon span { margin-left: 10px; } .business-process-selected-icon { background: #0e90ad; padding: 10px; color: #fff; margin-bottom: 10px; font-size: 18px; }