This commit is contained in:
Tom (plebeius.eth)
2024-06-01 18:13:41 +02:00
parent 911ec8f65f
commit ee69ab60ed
6 changed files with 86 additions and 52 deletions
@@ -25,6 +25,24 @@
padding: 10px 0;
}
.desktopBoardButtons {
display: flex;
align-items: center;
justify-content: space-between; /* Ensure elements are spaced out properly */
}
.desktopBoardButtons::after {
content: "";
display: table;
clear: both;
}
.desktopBoardButtons .rightSideButtons {
margin-left: auto; /* Push the right-side buttons to the right */
display: flex;
align-items: center;
}
@media (max-width: 640px) {
.desktopBoardButtons {
display: none;
@@ -35,8 +53,4 @@
.mobileBoardButtons {
display: none;
}
.rightSideButtons {
float: right;
}
}
}
+43 -35
View File
@@ -68,11 +68,12 @@ const SortOptions = () => {
};
return (
<>
Sort by:{' '}
Sort by:&nbsp;
<select value={sortType} onChange={handleSortChange}>
<option value='active'>Bump order</option>
<option value='new'>Creation date</option>
</select>{' '}
</select>
&nbsp;
</>
);
};
@@ -134,45 +135,52 @@ export const DesktopBoardButtons = () => {
const isInSubscriptionsView = isSubscriptionsView(location.pathname);
return (
<div className={styles.desktopBoardButtons}>
<>
<hr />
{isInPostView || isInPendingPostPage ? (
<>
[
<ReturnButton address={subplebbitAddress} isInAllView={isInAllView} isInSubscriptionsView={isInSubscriptionsView} />
] [
<CatalogButton address={subplebbitAddress} isInAllView={isInAllView} isInSubscriptionsView={isInSubscriptionsView} />
] [
<OptionsButton />]{' '}
{isInPostView && (
<span className={styles.rightSideButtons}>
[<SubscribeButton address={subplebbitAddress} />]
</span>
)}
</>
) : (
<>
[
{isInCatalogView ? (
<div className={styles.desktopBoardButtons}>
{isInPostView || isInPendingPostPage ? (
<>
[
<ReturnButton address={subplebbitAddress} isInAllView={isInAllView} isInSubscriptionsView={isInSubscriptionsView} />
) : (
] [
<CatalogButton address={subplebbitAddress} isInAllView={isInAllView} isInSubscriptionsView={isInSubscriptionsView} />
)}
] [
<OptionsButton />
] [
<RefreshButton />]{' '}
<span className={styles.rightSideButtons}>
{isInCatalogView && <SortOptions />}
{!(isInAllView || isInSubscriptionsView) && (
<>
] [
<OptionsButton />]
{isInPostView && (
<span className={styles.rightSideButtons}>
[
<SubscribeButton address={subplebbitAddress} />]
</span>
)}
</>
) : (
<>
{isInCatalogView ? (
<>
[
<ReturnButton address={subplebbitAddress} isInAllView={isInAllView} isInSubscriptionsView={isInSubscriptionsView} />]{' '}
</>
) : (
<>
[
<CatalogButton address={subplebbitAddress} isInAllView={isInAllView} isInSubscriptionsView={isInSubscriptionsView} />]{' '}
</>
)}
</span>
</>
)}
</div>
[
<OptionsButton />] [
<RefreshButton />]
<span className={styles.rightSideButtons}>
{isInCatalogView && <SortOptions />}
{!(isInAllView || isInSubscriptionsView) && (
<>
[
<SubscribeButton address={subplebbitAddress} />]
</>
)}
</span>
</>
)}
</div>
</>
);
};