@alifd/next/es/pagination/variable.css

A configurable component library for web built on React.

:root {
--pagination-item-split: 4px;
--pagination-item-padding: 10px;
--pagination-item-border-style: solid;
--pagination-item-border-width: 1px;
--pagination-item-corner: 3px;
--pagination-ellipsis-size: 12px;
--pagination-ellipsis-margin: 8px;
--pagination-current-font-size: 12px;
--pagination-total-font-size: 12px;
--pagination-jump-font-size: 12px;
--pagination-input-width: 36px;
--pagination-input-margin: 4px;
--pagination-size-selector-title-margin-right: 4px;
--pagination-size-selector-number-padding: 12px;
--pagination-large-item-split: 8px;
--pagination-large-item-padding: 15px;
--pagination-large-item-border-width: 1px;
--pagination-large-item-corner: 3px;
--pagination-large-ellipsis-size: 16px;
--pagination-large-current-font-size: 16px;
--pagination-large-total-font-size: 16px;
--pagination-large-input-width: 48px;
--pagination-large-jump-font-size: 16px;
--pagination-large-size-selector-number-padding: 16px;
--pagination-small-item-split: 4px;
--pagination-small-item-padding: 6px;
--pagination-small-item-border-width: 1px;
--pagination-small-item-corner: 3px;
--pagination-small-ellipsis-size: 12px;
--pagination-small-current-font-size: 12px;
--pagination-small-total-font-size: 12px;
--pagination-small-input-width: 28px;
--pagination-small-jump-font-size: 12px;
--pagination-small-size-selector-number-padding: 8px;
--pagination-ellipsis-color: #999999;
--pagination-current-color: #5584FF;
--pagination-total-color: #333333;
--pagination-jump-color: #999999;
--pagination-size-selector-title-color: #999999;
--pagination-size-selector-filter-color: #666666;
--pagination-size-selector-filter-current-color: #5584FF;
--pagination-item-border-color: #C4C6CF;
--pagination-item-shadow: none;
--pagination-item-color: #333333;
--pagination-item-bg: #FFFFFF;
--pagination-item-current-border-color: #5584FF;
--pagination-item-current-shadow: none;
--pagination-item-current-color: #FFFFFF;
--pagination-item-current-bg: #5584FF;
--pagination-item-hover-border-color: #A0A2AD;
--pagination-item-hover-shadow: none;
--pagination-item-hover-color: #333333;
--pagination-item-hover-bg: #F2F3F7;
--pagination-arrow-color: #666666;
--pagination-icon-prev-content: "\e61d";
--pagination-icon-next-content: "\e619";
--pagination-icon-ellipsis-content: "\e654";
--pagination-item-current-hover-border-color: transparent;
--pagination-item-current-hover-shadow: none;
--pagination-item-current-hover-color: #FFFFFF;
--pagination-item-current-hover-bg: #3E71F7;
--pagination-arrow-hover-color: #333333;
--pagination-arrow-hover-color-noboder: #5584FF;
}