mirror of
https://github.com/astuto/astuto.git
synced 2025-12-15 19:27:52 +01:00
Improve Board style
This commit is contained in:
@@ -25,7 +25,7 @@ const PostList = ({ posts, areLoading, error, handleLoadMore, page, hasMore }: P
|
|||||||
loadMore={handleLoadMore}
|
loadMore={handleLoadMore}
|
||||||
threshold={50}
|
threshold={50}
|
||||||
hasMore={hasMore}
|
hasMore={hasMore}
|
||||||
loader={<Spinner />}
|
loader={<Spinner key={0} />}
|
||||||
useWindow={true}
|
useWindow={true}
|
||||||
>
|
>
|
||||||
{posts.map((post, i) => (
|
{posts.map((post, i) => (
|
||||||
|
|||||||
@@ -1,3 +1,38 @@
|
|||||||
|
@media (max-width: 800px) {
|
||||||
|
.boardContainer {
|
||||||
|
flex-direction: column;
|
||||||
|
|
||||||
|
.sidebar {
|
||||||
|
position: relative;
|
||||||
|
width: 100%;
|
||||||
|
top: 0;
|
||||||
|
|
||||||
|
.sidebar-box {
|
||||||
|
width: 100%;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.box {
|
||||||
|
width: 100%;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
@media (min-width: 801px) {
|
||||||
|
.boardContainer {
|
||||||
|
flex-direction: row;
|
||||||
|
|
||||||
|
.sidebar {
|
||||||
|
position: sticky;
|
||||||
|
top: 20px;
|
||||||
|
|
||||||
|
.sidebar-box {
|
||||||
|
width: 250px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
.boardContainer {
|
.boardContainer {
|
||||||
display: flex;
|
display: flex;
|
||||||
flex: 1 1 auto;
|
flex: 1 1 auto;
|
||||||
@@ -5,15 +40,11 @@
|
|||||||
align-items: flex-start;
|
align-items: flex-start;
|
||||||
flex-wrap: nowrap;
|
flex-wrap: nowrap;
|
||||||
|
|
||||||
|
|
||||||
.sidebar {
|
.sidebar {
|
||||||
top: 20px;
|
|
||||||
position: sticky;
|
|
||||||
|
|
||||||
.sidebar-box {
|
.sidebar-box {
|
||||||
flex: 0 0 auto;
|
flex: 0 0 auto;
|
||||||
|
|
||||||
width: 250px;
|
|
||||||
|
|
||||||
display: flex;
|
display: flex;
|
||||||
flex-direction: column;
|
flex-direction: column;
|
||||||
justify-content: flex-start;
|
justify-content: flex-start;
|
||||||
@@ -116,6 +147,7 @@
|
|||||||
flex: 1 1 auto;
|
flex: 1 1 auto;
|
||||||
|
|
||||||
.postLink {
|
.postLink {
|
||||||
|
display: block;
|
||||||
text-decoration: none;
|
text-decoration: none;
|
||||||
border-radius: 4px;
|
border-radius: 4px;
|
||||||
margin: 8px 0;
|
margin: 8px 0;
|
||||||
|
|||||||
Reference in New Issue
Block a user