various-ui/styles/time-picker.css

This is a test version of the Vue 3 component library

.ui-time-picker{cursor:pointer;position:relative}.ui-time-picker .ui-form-control{display:flex;align-items:center}.ui-time-picker .ui-form-control .ui-time-context{flex:1;width:0;color:var(--uioption-form-font-color);cursor:pointer;border:0;padding:0;text-align:center}.ui-time-picker .ui-form-control .ui-time-rect{width:16px;height:2px;margin:0 var(--uisize-spacing-x);background-color:var(--uicolor-font-2)}.ui-time-picker .ui-form-candidates.ui-form-candidates-detach{left:50%;transform:translateX(-50%)}.ui-time-picker.ui-active .ui-form-control,.ui-time-picker:hover .ui-form-control{border-color:var(--uioption-form-active-color)}.ui-form-candidates .ui-form-candidate-container .ui-time-picker-candidates{display:flex;padding:var(--uisize-spacing-y) var(--uisize-spacing-x)}.ui-form-candidates .ui-form-candidate-container .ui-time-picker-candidates .ui-time-picker-candidate{text-align:center}.ui-form-candidates .ui-form-candidate-container .ui-time-picker-candidates .ui-time-picker-candidate .ui-candidate-name{margin-bottom:4px}.ui-form-candidates .ui-form-candidate-container .ui-time-picker-candidates .ui-time-picker-candidate .ui-candidate-controls{border:1px solid var(--uicolor-font-4);display:flex;position:relative;border-radius:2px}.ui-form-candidates .ui-form-candidate-container .ui-time-picker-candidates .ui-time-picker-candidate .ui-candidate-controls .ui-simplebar-content{padding:90px 0}.ui-form-candidates .ui-form-candidate-container .ui-time-picker-candidates .ui-time-picker-candidate .ui-candidate-controls .ui-simplebar-content .ui-candidate{width:48px;cursor:pointer;font-size:12px}.ui-form-candidates .ui-form-candidate-container .ui-time-picker-candidates .ui-time-picker-candidate .ui-candidate-controls .ui-simplebar-content .ui-candidate:hover{background-color:var(--uicolor-font-5)}.ui-form-candidates .ui-form-candidate-container .ui-time-picker-candidates .ui-time-picker-candidate .ui-candidate-controls .ui-simplebar-content .ui-candidate.ui-active{color:var(--uicolor-font-1);font-weight:700}.ui-form-candidates .ui-form-candidate-container .ui-time-picker-candidates .ui-time-picker-candidate .ui-candidate-controls .ui-candidate-division{top:50%;left:10%;width:80%;height:28px;border:solid var(--uicolor-font-4);z-index:1;position:absolute;transform:translateY(-50%);border-width:1px 0 1px 0}.ui-form-candidates .ui-form-candidate-container .ui-time-picker-candidates .ui-time-picker-candidate .ui-simplebar-slideway{width:8px;background-color:var(--uicolor-font-4-05)}.ui-form-candidates .ui-form-candidate-container .ui-time-picker-candidates .ui-time-picker-candidate .ui-simplebar-slideway .ui-simplebar-bar{border-radius:9999px;border-color:var(--uicolor-font-4-05)}.ui-form-candidates .ui-form-candidate-container .ui-time-picker-candidates .ui-time-picker-candidate:not(:first-child){margin-left:8px}