123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407 |
- .rc-picker {
- position: relative;
- display: inline-flex;
- }
- .rc-picker-rtl {
- direction: rtl;
- }
- .rc-picker-focused {
- border: 1px solid blue;
- }
- .rc-picker-invalid {
- box-shadow: 0 0 2px red;
- }
- .rc-picker-panels {
- display: flex;
- flex-wrap: nowrap;
- }
- .rc-picker-panel {
- display: inline-block;
- vertical-align: top;
- background: #fff0ff;
- border: 1px solid #666;
- }
- .rc-picker-panel-focused {
- border-color: blue;
- }
- .rc-picker-panel-rtl {
- direction: rtl;
- }
- .rc-picker-decade-panel,
- .rc-picker-year-panel,
- .rc-picker-month-panel,
- .rc-picker-week-panel,
- .rc-picker-date-panel,
- .rc-picker-time-panel {
- display: flex;
- flex-direction: column;
- }
- .rc-picker-decade-panel table,
- .rc-picker-year-panel table,
- .rc-picker-month-panel table,
- .rc-picker-week-panel table,
- .rc-picker-date-panel table,
- .rc-picker-time-panel table {
- text-align: center;
- border-collapse: collapse;
- }
- .rc-picker-header {
- display: flex;
- }
- .rc-picker-header > * {
- flex: none;
- }
- .rc-picker-header-view {
- flex: auto;
- text-align: center;
- }
- .rc-picker-header-view > button {
- padding: 0;
- border: 0;
- }
- .rc-picker-cell {
- color: #aaa;
- }
- .rc-picker-cell-disabled {
- opacity: 0.2;
- }
- .rc-picker-cell-inner {
- display: inline-block;
- box-sizing: border-box;
- width: 100%;
- height: 20px;
- margin: 0;
- padding: 0;
- font-size: 12px;
- line-height: 20px;
- background: transparent;
- border: 0;
- border: none;
- outline: none;
- cursor: pointer;
- transition: background 0.3s, border 0.3s;
- }
- .rc-picker-cell-inner:hover {
- background: rgba(0, 0, 255, 0.3);
- }
- .rc-picker-cell-in-view {
- color: #333;
- }
- .rc-picker-cell-in-range > .rc-picker-cell-inner {
- background: rgba(0, 0, 255, 0.05);
- }
- .rc-picker-cell-hover > .rc-picker-cell-inner {
- background: orange;
- }
- .rc-picker-cell-range-hover-start,
- .rc-picker-cell-range-hover-end,
- .rc-picker-cell-range-hover {
- position: relative;
- }
- .rc-picker-cell-range-hover-start::after,
- .rc-picker-cell-range-hover-end::after,
- .rc-picker-cell-range-hover::after {
- position: absolute;
- top: 3px;
- right: 0;
- bottom: 0;
- left: 0;
- border: 1px solid green;
- border-right: 0;
- border-left: 0;
- content: '';
- pointer-events: none;
- }
- .rc-picker-cell-range-hover-start::after {
- border-left: 1px solid green !important;
- }
- .rc-picker-cell-range-hover-end::after {
- border-right: 1px solid green !important;
- }
- .rc-picker-cell-today > .rc-picker-cell-inner {
- border: 1px solid blue;
- }
- .rc-picker-cell-range-start > .rc-picker-cell-inner,
- .rc-picker-cell-range-end > .rc-picker-cell-inner,
- .rc-picker-cell-selected > .rc-picker-cell-inner {
- background: rgba(0, 0, 255, 0.2);
- }
- .rc-picker-presets {
- background: #ccccff;
- }
- .rc-picker-presets ul {
- margin: 0;
- padding: 0;
- list-style: none;
- }
- .rc-picker-footer,
- .rc-picker-picker-footer {
- background: green;
- }
- .rc-picker-ranges {
- margin: 0;
- padding: 0;
- overflow: hidden;
- list-style: none;
- }
- .rc-picker-ranges > li {
- display: inline-block;
- }
- .rc-picker-ok {
- float: right;
- }
- .rc-picker-year-panel .rc-picker-cell-inner,
- .rc-picker-month-panel .rc-picker-cell-inner {
- width: 80px;
- }
- .rc-picker-week-panel-row:hover .rc-picker-cell {
- background: red;
- }
- .rc-picker-week-panel-row-selected .rc-picker-cell {
- background: rgba(0, 0, 255, 0.3);
- }
- .rc-picker-week-panel-row-range-hover .rc-picker-cell {
- background: rgba(0, 255, 0, 0.1);
- }
- .rc-picker-week-panel-row-range-start .rc-picker-cell,
- .rc-picker-week-panel-row-range-end .rc-picker-cell {
- background: rgba(0, 255, 0, 0.3);
- }
- .rc-picker-week-panel .rc-picker-cell,
- .rc-picker-week-panel .rc-picker-cell-inner {
- width: 20px;
- }
- .rc-picker-week-panel .rc-picker-cell-week {
- color: #999;
- font-weight: bold;
- font-size: 12px;
- }
- .rc-picker-week-panel .rc-picker-cell:hover > .rc-picker-cell-inner,
- .rc-picker-week-panel .rc-picker-cell-selected > .rc-picker-cell-inner {
- background: transparent;
- }
- .rc-picker-date-panel .rc-picker-cell-inner {
- width: 20px;
- }
- .rc-picker-time-panel {
- width: auto;
- }
- .rc-picker-time-panel .rc-picker-content {
- position: relative;
- display: flex;
- max-height: 200px;
- direction: ltr;
- }
- .rc-picker-time-panel-column-title {
- font-size: 14px;
- line-height: 20px;
- }
- .rc-picker-time-panel-column {
- flex: auto;
- width: 50px;
- margin: 0;
- padding: 0 0 180px;
- overflow-x: hidden;
- overflow-y: hidden;
- font-size: 12px;
- text-align: left;
- list-style: none;
- transition: background 0.3s;
- }
- .rc-picker-time-panel-column-active {
- background: rgba(0, 0, 255, 0.1);
- }
- .rc-picker-time-panel-column:hover {
- overflow-y: auto;
- }
- .rc-picker-time-panel-column > li {
- width: 50px;
- margin: 0;
- padding: 0;
- cursor: pointer;
- }
- .rc-picker-time-panel-column > li.rc-picker-time-panel-cell-disabled {
- opacity: 0.5;
- }
- .rc-picker-time-panel-column > li.rc-picker-time-panel-cell-selected {
- background: rgba(0, 0, 255, 0.5);
- }
- .rc-picker-time-panel-column > li .rc-picker-time-panel-cell-inner {
- display: block;
- width: 100%;
- height: 20px;
- margin: 0;
- color: #333;
- line-height: 20px;
- text-align: center;
- }
- .rc-picker-panel-rtl .rc-picker-time-panel-column > li .rc-picker-time-panel-cell-inner {
- padding: 0 12px 0 0;
- text-align: right;
- }
- .rc-picker-datetime-panel {
- display: flex;
- }
- .rc-picker-datetime-panel .rc-picker-time-panel {
- border-left: 1px solid #999;
- }
- .rc-picker-datetime-panel .rc-picker-date-panel,
- .rc-picker-datetime-panel .rc-picker-time-panel {
- transition: opacity 0.3s;
- }
- .rc-picker-datetime-panel-active .rc-picker-date-panel,
- .rc-picker-datetime-panel-active .rc-picker-time-panel {
- opacity: 0.3;
- }
- .rc-picker-datetime-panel-active .rc-picker-date-panel-active,
- .rc-picker-datetime-panel-active .rc-picker-time-panel-active {
- opacity: 1;
- }
- .rc-picker-input {
- position: relative;
- display: inline-flex;
- width: 100%;
- }
- .rc-picker-rtl .rc-picker-input {
- text-align: right;
- }
- .rc-picker-input-active > input {
- background: rgba(0, 0, 255, 0.05);
- }
- .rc-picker-input > input {
- width: 100%;
- }
- .rc-picker-input > input::-moz-placeholder {
- opacity: 1;
- }
- .rc-picker-input > input::placeholder {
- color: #bfbfbf;
- }
- .rc-picker-input > input:placeholder-shown {
- text-overflow: ellipsis;
- }
- .rc-picker-input-placeholder > input {
- color: #bfbfbf;
- }
- .rc-picker-clear {
- position: absolute;
- top: 0;
- inset-inline-end: 4px;
- cursor: pointer;
- }
- .rc-picker-clear-btn::after {
- content: '×';
- }
- .rc-picker-dropdown {
- position: absolute;
- box-shadow: 0 0 1px red;
- pointer-events: none;
- }
- .rc-picker-dropdown-range {
- padding: 10px 0;
- }
- .rc-picker-dropdown-hidden {
- display: none;
- }
- .rc-picker-dropdown-rtl {
- direction: rtl;
- }
- .rc-picker-dropdown-placement-topLeft .rc-picker-range-arrow,
- .rc-picker-dropdown-placement-topRight .rc-picker-range-arrow {
- bottom: 6px;
- transform: rotate(135deg);
- }
- .rc-picker-dropdown-placement-bottomLeft .rc-picker-range-arrow,
- .rc-picker-dropdown-placement-bottomRight .rc-picker-range-arrow {
- top: 6px;
- transform: rotate(-45deg);
- }
- .rc-picker-dropdown .rc-picker-range-arrow {
- position: absolute;
- z-index: 1;
- width: 10px;
- height: 10px;
- transition: all 0.3s;
- }
- .rc-picker-dropdown .rc-picker-range-arrow::before,
- .rc-picker-dropdown .rc-picker-range-arrow::after {
- position: absolute;
- top: 50%;
- inset-inline-start: 50%;
- box-sizing: border-box;
- transform: translate(-50%, -50%);
- content: '';
- }
- .rc-picker-dropdown-rtl.rc-picker-dropdown .rc-picker-range-arrow::before,
- .rc-picker-dropdown-rtl.rc-picker-dropdown .rc-picker-range-arrow::after {
- transform: translate(50%, -50%);
- }
- .rc-picker-dropdown .rc-picker-range-arrow::before {
- width: 10px;
- height: 10px;
- border: 5px solid blue;
- border-color: blue blue transparent transparent;
- }
- .rc-picker-dropdown .rc-picker-range-arrow::after {
- width: 8px;
- height: 8px;
- border: 4px solid blue;
- border-color: #fff0ff #fff0ff transparent transparent;
- }
- .rc-picker-range {
- position: relative;
- display: inline-flex;
- }
- .rc-picker-range-wrapper {
- display: flex;
- }
- .rc-picker-range .rc-picker-active-bar {
- bottom: 0;
- height: 3px;
- background: green;
- opacity: 0;
- transition: all 0.3s;
- pointer-events: none;
- }
- .rc-picker-range.rc-picker-focused .rc-picker-active-bar {
- opacity: 1;
- }
- .rc-picker-panel-container {
- display: inline-block;
- vertical-align: top;
- transition: margin 0.3s;
- pointer-events: all;
- }
- .rc-picker-panel-layout {
- display: flex;
- flex-wrap: nowrap;
- align-items: stretch;
- }
- .rc-picker-selector {
- width: 100%;
- }
- .rc-picker-selection-overflow {
- display: flex;
- flex-wrap: wrap;
- box-sizing: border-box;
- width: 100%;
- border: 1px solid green;
- min-height: 1em;
- }
- .rc-picker-selection-overflow-item {
- flex: none;
- max-width: 100%;
- }
- .rc-picker-selection-item {
- border: 1px solid blue;
- }
- .rc-picker-selection-placeholder {
- pointer-events: none;
- position: absolute;
- left: 0;
- top: 0;
- }
- .rc-picker-multiple-input {
- width: 10px;
- opacity: 0.1;
- }
|