mirror of
https://github.com/bitsocialnet/5chan.git
synced 2026-08-03 07:41:04 +02:00
style(board-pagination): complete styling
This commit is contained in:
@@ -46,6 +46,8 @@
|
|||||||
overflow: hidden;
|
overflow: hidden;
|
||||||
list-style: none;
|
list-style: none;
|
||||||
background-color: var(--pagelist-background-color);
|
background-color: var(--pagelist-background-color);
|
||||||
|
border-right: 1px solid var(--pagelist-item-border-color);
|
||||||
|
border-bottom: 1px solid var(--pagelist-item-border-color);
|
||||||
}
|
}
|
||||||
|
|
||||||
.footerPageItem {
|
.footerPageItem {
|
||||||
@@ -97,7 +99,7 @@
|
|||||||
background: transparent;
|
background: transparent;
|
||||||
list-style: none;
|
list-style: none;
|
||||||
overflow: hidden;
|
overflow: hidden;
|
||||||
color: var(--boardsbar-desktop-link-text-color);
|
color: var(--button-desktop-text-color);
|
||||||
}
|
}
|
||||||
|
|
||||||
.footerPageLink {
|
.footerPageLink {
|
||||||
@@ -108,15 +110,14 @@
|
|||||||
padding: 0;
|
padding: 0;
|
||||||
border: none;
|
border: none;
|
||||||
background: transparent;
|
background: transparent;
|
||||||
color: var(--boardsbar-desktop-link-text-color);
|
color: var(--button-desktop-text-color);
|
||||||
text-transform: capitalize;
|
text-transform: capitalize;
|
||||||
cursor: pointer;
|
cursor: pointer;
|
||||||
text-decoration: var(--boardsbar-desktop-link-text-decoration);
|
text-decoration: var(--button-text-decoration);
|
||||||
}
|
}
|
||||||
|
|
||||||
.footerPageLink:hover {
|
.footerPageLink:hover {
|
||||||
color: var(--boardsbar-desktop-link-text-color-hover);
|
color: var(--button-desktop-text-color-hover);
|
||||||
text-decoration: var(--boardsbar-desktop-link-text-decoration-hover);
|
|
||||||
}
|
}
|
||||||
|
|
||||||
.pagelistSeparatorLink {
|
.pagelistSeparatorLink {
|
||||||
@@ -127,7 +128,6 @@
|
|||||||
}
|
}
|
||||||
|
|
||||||
.footerPageCurrent {
|
.footerPageCurrent {
|
||||||
|
composes: footerPageLink;
|
||||||
font-weight: bold;
|
font-weight: bold;
|
||||||
color: var(--boardsbar-desktop-link-text-color-hover);
|
|
||||||
text-decoration: var(--boardsbar-desktop-link-text-decoration);
|
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -61,23 +61,15 @@ const BoardPagination = ({ basePath, currentPage, totalPages, footerStyle = fals
|
|||||||
<span className={styles.footerPageBracket}>]</span>
|
<span className={styles.footerPageBracket}>]</span>
|
||||||
</span>
|
</span>
|
||||||
)}
|
)}
|
||||||
{pageNumbers.map((page) =>
|
{pageNumbers.map((page) => (
|
||||||
page === currentPage ? (
|
<span key={page} className={styles.footerPageItem}>
|
||||||
<span key={page} className={styles.footerPageItem}>
|
<span className={styles.footerPageBracket}>[</span>
|
||||||
<span className={styles.footerPageBracket}>[</span>
|
<Link to={pageHref(page)} className={page === currentPage ? styles.footerPageCurrent : styles.footerPageLink}>
|
||||||
<span className={styles.footerPageCurrent}>{page}</span>
|
{page}
|
||||||
<span className={styles.footerPageBracket}>]</span>
|
</Link>
|
||||||
</span>
|
<span className={styles.footerPageBracket}>]</span>
|
||||||
) : (
|
</span>
|
||||||
<span key={page} className={styles.footerPageItem}>
|
))}
|
||||||
<span className={styles.footerPageBracket}>[</span>
|
|
||||||
<Link to={pageHref(page)} className={styles.footerPageLink}>
|
|
||||||
{page}
|
|
||||||
</Link>
|
|
||||||
<span className={styles.footerPageBracket}>]</span>
|
|
||||||
</span>
|
|
||||||
),
|
|
||||||
)}
|
|
||||||
{currentPage < totalPages ? (
|
{currentPage < totalPages ? (
|
||||||
<button type='button' className={styles.pagelistNavButton} onClick={() => navigate(pageHref(currentPage + 1))}>
|
<button type='button' className={styles.pagelistNavButton} onClick={() => navigate(pageHref(currentPage + 1))}>
|
||||||
{t('next')}
|
{t('next')}
|
||||||
|
|||||||
Reference in New Issue
Block a user