@dialpad/dialtone-css
Version:
Dialpad's design system
47 lines (42 loc) • 1.28 kB
text/less
//
// DIALTONE
// COMPONENTS: Pagination
//
// These are the styles for Pagination component.
//
// TABLE OF CONTENTS
// • BASE STYLE
// • PREV & NEXT BUTTONS
// • SEPARATOR
//
// ============================================================================
// $ BASE STYLE
// ----------------------------------------------------------------------------
.d-pagination {
display: flex;
flex-direction: row;
grid-gap: var(--dt-space-300);
align-items: center;
}
// ============================================================================
// $ PREV & NEXT BUTTONS
// ----------------------------------------------------------------------------
.d-pagination__button {
padding-right: var(--dt-space-400);
padding-left: var(--dt-space-400);
&:disabled {
color: var(--dt-color-foreground-secondary-inverted);
background-color: var(--dt-color-neutral-transparent);
}
}
// ============================================================================
// $ SEPARATOR
// ----------------------------------------------------------------------------
.d-pagination__separator {
align-self: flex-end;
}
.d-pagination__separator-icon {
width: var(--dt-size-550);
color: var(--dt-color-foreground-tertiary);
text-align: center;
}