.dynamic-array-widget .array-item { display: flex; align-items: center; margin-bottom: 15px; } .dynamic-array-widget .remove_sign { width: 10px; height: 2px; background: #a41515; border-radius: 1px; } .dynamic-array-widget .remove { height: 15px; display: flex; align-items: center; margin-left: 5px; } .dynamic-array-widget .remove:hover { cursor: pointer; } /* Selector */ .selector { display: flex; width: 100%; height: 45vh; } .selector .selector-filter { display: flex; align-items: center; } .selector .selector-filter label { margin: 0 8px 0 0; } .selector .selector-filter input { width: auto; min-height: 0; flex: 1 1; } .selector-available, .selector-chosen { width: auto; flex: 1 1; display: flex; flex-direction: column; } .selector select { width: 100%; flex: 1 0 auto; margin-bottom: 5px; } .selector ul.selector-chooser { width: 26px; height: 52px; padding: 2px 0; margin: auto 15px; border-radius: 20px; transform: translateY(-10px); list-style: none; } .selector-add, .selector-remove { width: 20px; height: 20px; background-size: 20px auto; } .selector-add { background-position: 0 -120px; } .selector-remove { background-position: 0 -80px; } a.selector-chooseall, a.selector-clearall { align-self: center; } .stacked { flex-direction: column; max-width: 480px; } .stacked > * { flex: 0 1 auto; } .stacked select { margin-bottom: 0; } .stacked .selector-available, .stacked .selector-chosen { width: auto; } .stacked ul.selector-chooser { width: 52px; height: 26px; padding: 0 2px; margin: 15px auto; transform: none; } .stacked .selector-chooser li { padding: 3px; } .stacked .selector-add, .stacked .selector-remove { background-size: 20px auto; } .stacked .selector-add { background-position: 0 -40px; } .stacked .active.selector-add { background-position: 0 -60px; } .stacked .selector-remove { background-position: 0 0; } .stacked .active.selector-remove { background-position: 0 -20px; } .help-tooltip, .selector .help-icon { display: none; } form .form-row p.datetime { width: 100%; } .datetime input { width: 50%; max-width: 120px; } .datetime span { font-size: 13px; } .datetime .timezonewarning { display: block; font-size: 11px; color: #999; } .datetimeshortcuts { color: #ccc; } .inline-group { overflow: auto; } .selector-add, .selector-remove { width: 16px; height: 16px; display: block; text-indent: -3000px; overflow: hidden; cursor: default; opacity: 0.3; } .active.selector-add, .active.selector-remove { opacity: 1; } .active.selector-add:hover, .active.selector-remove:hover { cursor: pointer; } .selector-add { background: url(../admin/img/selector-icons.svg) 0 -96px no-repeat; } .active.selector-add:focus, .active.selector-add:hover { background-position: 0 -112px; } .selector-remove { background: url(../admin/img/selector-icons.svg) 0 -64px no-repeat; }