Fix: Pagination button hover issue (#1227)

This commit is contained in:
Shailesh Parmar 2021-11-17 18:02:34 +05:30 committed by GitHub
parent 325992d086
commit 6cb628c8eb
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
2 changed files with 15 additions and 8 deletions

View File

@ -23,20 +23,27 @@
margin-bottom: 1rem;
}
.tw-link:hover {
.button-text:hover .tw-link {
text-decoration: none !important;
}
.pagination > .disabled > .tw-link {
.disabled {
cursor: not-allowed;
}
.button-text:not(.disabled) {
cursor: pointer;
}
.pagination > .disabled > .tw-link {
color: #7147e8;
}
.pagination > .disabled > .tw-link:hover,
.pagination > .disabled > .tw-link:focus {
cursor: not-allowed;
.pagination > .disabled:hover > .tw-link,
.pagination > .disabled:focus > .tw-link {
color: white;
}
.pagination > li > .tw-link:hover,
.pagination > li > .tw-link:focus {
.pagination > .button-text:hover > .tw-link,
.pagination > .button-text:focus > .tw-link {
color: white;
}

View File

@ -32,7 +32,7 @@ const Pagination: React.FC<PaginationProps> = ({
hideFirstLastPages
activePage={currentPage}
disabledClass="tw-opacity-60 disabled"
itemClass="tw-border tw-border-primary tw-text-blue-500 tw-rounded tw-px-3 tw-py-1.5 tw-text-sm tw-mx-2 hover:tw-bg-primary "
itemClass="tw-border tw-border-primary tw-text-blue-500 tw-rounded tw-px-3 tw-py-1.5 tw-text-sm tw-mx-2 hover:tw-bg-primary button-text"
itemsCountPerPage={sizePerPage}
linkClass="tw-text-primary tw-font-medium tw-link"
nextPageText={