vue-amazing-ui/es/pagination/Pagination.css

An Amazing Vue3 UI Components Library, Using TypeScript.

.pagination-wrap[data-v-48ee7a20]{display:flex;align-items:center;gap:8px;font-size:14px;color:#000000e0;line-height:1.57142857}.pagination-wrap .pagination-total-text[data-v-48ee7a20]{display:inline-flex;align-items:center;height:32px}.pagination-wrap .pagination-item[data-v-48ee7a20]{display:inline-flex;justify-content:center;align-items:center;padding:0 6px;min-width:32px;height:32px;border:1px solid #d9d9d9;border-radius:6px;background:#fff;cursor:pointer;outline:0;-webkit-user-select:none;user-select:none;transition:all .3s}.pagination-wrap .pagination-item[data-v-48ee7a20]:hover{color:var(--pagination-primary-color);border-color:var(--pagination-primary-color)}.pagination-wrap .pagination-item[data-v-48ee7a20]:focus-visible{outline:2px solid var(--pagination-primary-color-focus-visible);outline-offset:1px;transition:outline-offset 0s,outline 0s}.pagination-wrap .pagination-prev[data-v-48ee7a20],.pagination-wrap .pagination-next[data-v-48ee7a20]{display:inline-flex;align-items:center;justify-content:center;min-width:32px;height:32px;border:1px solid #d9d9d9;border-radius:6px;background:#fff;cursor:pointer;outline:0;-webkit-user-select:none;user-select:none;transition:all .3s}.pagination-wrap .pagination-prev .arrow-svg[data-v-48ee7a20],.pagination-wrap .pagination-next .arrow-svg[data-v-48ee7a20]{display:inline-block;font-size:12px;color:#000000a6;fill:currentColor;transition:color .3s}.pagination-wrap .pagination-prev[data-v-48ee7a20]:hover,.pagination-wrap .pagination-next[data-v-48ee7a20]:hover{border-color:var(--pagination-primary-color)}.pagination-wrap .pagination-prev:hover .arrow-svg[data-v-48ee7a20],.pagination-wrap .pagination-next:hover .arrow-svg[data-v-48ee7a20]{color:var(--pagination-primary-color)}.pagination-wrap .pagination-prev[data-v-48ee7a20]:focus-visible:not(.pagination-item-disabled),.pagination-wrap .pagination-next[data-v-48ee7a20]:focus-visible:not(.pagination-item-disabled){outline:2px solid var(--pagination-primary-color-focus-visible);outline-offset:1px;transition:outline-offset 0s,outline 0s}.pagination-wrap .pagination-item-active[data-v-48ee7a20]{color:var(--pagination-primary-color);border-color:var(--pagination-primary-color)}.pagination-wrap .pagination-item-disabled[data-v-48ee7a20]{color:#00000040;background:#fff;border-color:#d9d9d9;cursor:not-allowed}.pagination-wrap .pagination-item-disabled[data-v-48ee7a20]:hover{font-weight:400;color:#000000a6;border-color:#d9d9d9}.pagination-wrap .pagination-item-disabled:hover .arrow-svg[data-v-48ee7a20],.pagination-wrap .pagination-item-disabled .arrow-svg[data-v-48ee7a20]{color:#00000040}.pagination-wrap .pagintion-jump-prev[data-v-48ee7a20],.pagination-wrap .pagintion-jump-next[data-v-48ee7a20]{position:relative;display:inline-flex;align-items:center;min-width:32px;height:32px;border-radius:6px;cursor:pointer;outline:0}.pagination-wrap .pagintion-jump-prev .ellipsis-character[data-v-48ee7a20],.pagination-wrap .pagintion-jump-next .ellipsis-character[data-v-48ee7a20]{position:absolute;inset:0;margin:auto;color:#00000040;font-family:Arial,Helvetica,sans-serif;line-height:32px;letter-spacing:2px;text-align:center;text-indent:.13em;opacity:1;transition:all .3s}.pagination-wrap .pagintion-jump-prev .icon-svg[data-v-48ee7a20],.pagination-wrap .pagintion-jump-next .icon-svg[data-v-48ee7a20]{position:absolute;inset:0;margin:auto;display:inline-block;font-size:12px;color:var(--pagination-primary-color);fill:currentColor;opacity:0;pointer-events:none;transition:all .3s}.pagination-wrap .pagintion-jump-prev:hover .ellipsis-character[data-v-48ee7a20],.pagination-wrap .pagintion-jump-next:hover .ellipsis-character[data-v-48ee7a20]{opacity:0;pointer-events:none}.pagination-wrap .pagintion-jump-prev:hover .icon-svg[data-v-48ee7a20],.pagination-wrap .pagintion-jump-next:hover .icon-svg[data-v-48ee7a20]{opacity:1;pointer-events:auto}.pagination-wrap .pagintion-jump-prev[data-v-48ee7a20]:focus-visible,.pagination-wrap .pagintion-jump-next[data-v-48ee7a20]:focus-visible{outline:2px solid var(--pagination-primary-color-focus-visible);outline-offset:1px;transition:outline-offset 0s,outline 0s}.pagination-wrap .pagintion-jump-prev:focus-visible .ellipsis-character[data-v-48ee7a20],.pagination-wrap .pagintion-jump-next:focus-visible .ellipsis-character[data-v-48ee7a20]{opacity:0;pointer-events:none}.pagination-wrap .pagintion-jump-prev:focus-visible .icon-svg[data-v-48ee7a20],.pagination-wrap .pagintion-jump-next:focus-visible .icon-svg[data-v-48ee7a20]{opacity:1;pointer-events:auto}.pagination-wrap .pagination-options[data-v-48ee7a20]{display:inline-flex;gap:8px;margin-left:8px}.pagination-wrap .pagination-options .pagination-jump-page[data-v-48ee7a20]{display:inline-flex;gap:8px;align-items:center;vertical-align:bottom;height:32px}.pagination-left[data-v-48ee7a20]{justify-content:flex-start}.pagination-center[data-v-48ee7a20]{justify-content:center}.pagination-right[data-v-48ee7a20]{justify-content:flex-end}.pagination-small[data-v-48ee7a20]{gap:4px}.pagination-small .pagination-total-text[data-v-48ee7a20]{height:24px}.pagination-small .pagination-item[data-v-48ee7a20],.pagination-small .pagination-prev[data-v-48ee7a20],.pagination-small .pagination-next[data-v-48ee7a20],.pagination-small .pagintion-jump-prev[data-v-48ee7a20],.pagination-small .pagintion-jump-next[data-v-48ee7a20]{min-width:24px;height:24px}.pagination-small .pagintion-jump-prev .ellipsis-character[data-v-48ee7a20],.pagination-small .pagintion-jump-next .ellipsis-character[data-v-48ee7a20]{line-height:24px}.pagination-small .pagination-options[data-v-48ee7a20]{gap:4px;margin-left:4px}.pagination-small .pagination-options .pagination-jump-page[data-v-48ee7a20]{gap:4px;height:24px}.pagination-middle[data-v-48ee7a20]{gap:6px}.pagination-middle .pagination-total-text[data-v-48ee7a20]{height:28px}.pagination-middle .pagination-item[data-v-48ee7a20],.pagination-middle .pagination-prev[data-v-48ee7a20],.pagination-middle .pagination-next[data-v-48ee7a20],.pagination-middle .pagintion-jump-prev[data-v-48ee7a20],.pagination-middle .pagintion-jump-next[data-v-48ee7a20]{min-width:28px;height:28px}.pagination-middle .pagintion-jump-prev .ellipsis-character[data-v-48ee7a20],.pagination-middle .pagintion-jump-next .ellipsis-character[data-v-48ee7a20]{line-height:28px}.pagination-middle .pagination-options[data-v-48ee7a20]{gap:6px;margin-left:6px}.pagination-middle .pagination-options .pagination-jump-page[data-v-48ee7a20]{gap:6px;height:28px}.pagination-middle .pagination-options .pagination-jump-page[data-v-48ee7a20] .input-wrap .input-container{padding:3px 11px}.pagination-disabled .pagination-prev[data-v-48ee7a20],.pagination-disabled .pagination-next[data-v-48ee7a20]{color:#00000040;border-color:#00000040;cursor:not-allowed}.pagination-disabled .pagination-prev .arrow-svg[data-v-48ee7a20],.pagination-disabled .pagination-next .arrow-svg[data-v-48ee7a20]{color:#00000040}.pagination-disabled .pagination-prev[data-v-48ee7a20]:hover,.pagination-disabled .pagination-next[data-v-48ee7a20]:hover{border-color:#00000040}.pagination-disabled .pagination-prev:hover .arrow-svg[data-v-48ee7a20],.pagination-disabled .pagination-next:hover .arrow-svg[data-v-48ee7a20]{color:#00000040}.pagination-disabled .pagination-prev[data-v-48ee7a20]:focus-visible,.pagination-disabled .pagination-next[data-v-48ee7a20]:focus-visible{outline:0!important}.pagination-disabled .pagination-item[data-v-48ee7a20]{color:#00000040;border-color:#00000040;cursor:not-allowed}.pagination-disabled .pagination-item[data-v-48ee7a20]:hover{font-weight:400;color:#00000040;border-color:#00000040}.pagination-disabled .pagination-item[data-v-48ee7a20]:focus-visible{outline:0}.pagination-disabled .pagination-item-active[data-v-48ee7a20]{border-color:#d9d9d9;background-color:#00000026}.pagination-disabled .pagination-item-active[data-v-48ee7a20]:hover{font-weight:600;color:#00000040;border-color:#d9d9d9;background-color:#00000026}.pagination-disabled .pagintion-jump-prev[data-v-48ee7a20],.pagination-disabled .pagintion-jump-next[data-v-48ee7a20]{color:#00000040;cursor:not-allowed}.pagination-disabled .pagintion-jump-prev:hover .ellipsis-character[data-v-48ee7a20],.pagination-disabled .pagintion-jump-next:hover .ellipsis-character[data-v-48ee7a20]{opacity:1;pointer-events:none}.pagination-disabled .pagintion-jump-prev:hover .icon-svg[data-v-48ee7a20],.pagination-disabled .pagintion-jump-next:hover .icon-svg[data-v-48ee7a20]{opacity:0;pointer-events:none}.pagination-disabled .pagintion-jump-prev[data-v-48ee7a20]:focus-visible,.pagination-disabled .pagintion-jump-next[data-v-48ee7a20]:focus-visible{outline:0}.pagination-disabled .pagintion-jump-prev:focus-visible .ellipsis-character[data-v-48ee7a20],.pagination-disabled .pagintion-jump-next:focus-visible .ellipsis-character[data-v-48ee7a20]{opacity:1;pointer-events:none}.pagination-disabled .pagintion-jump-prev:focus-visible .icon-svg[data-v-48ee7a20],.pagination-disabled .pagintion-jump-next:focus-visible .icon-svg[data-v-48ee7a20]{opacity:0;pointer-events:none}.pagination-disabled .pagination-options[data-v-48ee7a20]{color:#00000040;cursor:not-allowed}.pagination-hidden[data-v-48ee7a20]{display:none}