diff --git a/src/components/Board.jsx b/src/components/Board.jsx
index 8a7a996e..db5f081c 100644
--- a/src/components/Board.jsx
+++ b/src/components/Board.jsx
@@ -1,9 +1,10 @@
import React, { useState, useEffect, useContext } from 'react';
import { Link, useNavigate } from 'react-router-dom';
-import { Container, NavBar, Header, Break, PostFormLink, PostFormTable, PostForm, TopBar, BoardForm } from './styles/Board.styled';
-import { useFeed } from '@plebbit/plebbit-react-hooks';
-import ImageBanner from './ImageBanner';
import { BoardContext } from '../App';
+import { Container, NavBar, Header, Break, PostFormLink, PostFormTable, PostForm, TopBar, BoardForm } from './styles/Board.styled';
+import ImageBanner from './ImageBanner';
+import { useFeed } from '@plebbit/plebbit-react-hooks';
+import InfiniteScroll from 'react-infinite-scroller';
const Board = ({ setBodyStyle }) => {
const [defaultSubplebbits, setDefaultSubplebbits] = useState([]);
@@ -12,7 +13,7 @@ const Board = ({ setBodyStyle }) => {
const [showPostForm, setShowPostForm] = useState(false);
const navigate = useNavigate();
- const { feed } = useFeed([`${selectedAddress}`], 'new');
+ const { feed, hasMore, loadMore } = useFeed([`${selectedAddress}`], 'new');
// console.log(feed);
@@ -129,7 +130,7 @@ const Board = ({ setBodyStyle }) => {
))}
[
- handleStyleChange({target: {value: "Yotsuba"}}
+ handleStyleChange({target: {value: "Yotsuba"}}
)}>Home]
>
@@ -216,7 +217,13 @@ const Board = ({ setBodyStyle }) => {
- {feed.map(object => {
+ Loading...
}
+ >
+ {feed.map(object => {
let counter = 1;
const thread = object;
const { replies: { pages: { topAll: { comments } } } } = object;
@@ -297,6 +304,7 @@ const Board = ({ setBodyStyle }) => {
>
)})}
+
diff --git a/src/components/styles/Board.styled.jsx b/src/components/styles/Board.styled.jsx
index 140d4927..994767c9 100644
--- a/src/components/styles/Board.styled.jsx
+++ b/src/components/styles/Board.styled.jsx
@@ -58,22 +58,21 @@ export const NavBar = styled.div`
return `font-size: 11pt;
display: block;
- a {
+ a, a:visited {
font-weight: 400;
padding: 1px;
+ color: #00e;
+ text-decoration: underline;
}
a:hover {
color: red;
}
- a:visited {
- color: #00e;
- }
-
.nav {
float: right;
}
+
`;
case 'Burichan':
@@ -83,7 +82,8 @@ export const NavBar = styled.div`
a, a:visited {
font-weight: 400;
padding: 1px;
- color: #34345c
+ color: #34345c;
+ text-decoration: underline;
}
a:hover {
@@ -899,6 +899,7 @@ export const PostForm = styled.form`
a, a:visited {
color: #00e;
+ text-decoration: underline;
}
a:hover {
color: red;
@@ -913,6 +914,7 @@ export const PostForm = styled.form`
a, a:visited {
color: #34345c;
+ text-decoration: underline;
}
a:hover {
color: red;
diff --git a/src/components/styles/Thread.styled.jsx b/src/components/styles/Thread.styled.jsx
index 4dbbdac7..5ffacdf7 100644
--- a/src/components/styles/Thread.styled.jsx
+++ b/src/components/styles/Thread.styled.jsx
@@ -494,6 +494,10 @@ export const TopBar = styled.div`
color: #00e !important;
text-decoration: none;
}
+
+ a:hover {
+ color: red !important;
+ }
}`;
case 'Yotsuba B':
@@ -517,6 +521,10 @@ export const TopBar = styled.div`
color: #34345c !important;
text-decoration: none;
}
+
+ a:hover {
+ color: red !important;
+ }
}`;
case 'Futaba':
@@ -538,6 +546,10 @@ export const TopBar = styled.div`
a, a:visited {
color: #00e !important;
}
+
+ a:hover {
+ color: red !important;
+ }
}`;
case 'Burichan':
@@ -557,7 +569,11 @@ export const TopBar = styled.div`
font-size: 12pt;
a, a:visited {
- color: #00e !important;
+ color: #34345c !important;
+ }
+
+ a:hover {
+ color: red !important;
}
}`;
@@ -582,6 +598,10 @@ export const TopBar = styled.div`
color: #81a2be !important;
text-decoration: none;
}
+
+ a:hover {
+ color: #5f89ab !important;
+ }
}`;
case 'Photon':
@@ -605,6 +625,10 @@ export const TopBar = styled.div`
color: #f60 !important;
text-decoration: none;
}
+
+ a:hover {
+ color: #ff3300 !important;
+ }
}`;
}