diff --git a/src/components/styled/Board.styled.jsx b/src/components/styled/Board.styled.jsx index 78df458b..0b449b6f 100644 --- a/src/components/styled/Board.styled.jsx +++ b/src/components/styled/Board.styled.jsx @@ -1262,13 +1262,13 @@ export const TopBar = styled.div` font-size: 10pt; } - a { - color: #00e; + a, #subscribe { + color: #00e !important; text-decoration: none; } - a:hover { - color: red; + a:hover, #subscribe:hover { + color: red !important; }`; case 'Yotsuba-B': @@ -1285,13 +1285,13 @@ export const TopBar = styled.div` font-size: 10pt; } - a { - color: #34345c; + a, #subscribe { + color: #34345c !important; text-decoration: none; } - a:hover { - color: #d00; + a:hover, #subscribe:hover { + color: #d00 !important; }`; case 'Futaba': @@ -1308,13 +1308,13 @@ export const TopBar = styled.div` font-size: 12pt; } - a { - color: #00e; + a, #subscribe { + color: #00e !important; text-decoration: underline; } - a:hover { - color: red; + a:hover, #subscribe:hover { + color: red !important; }`; case 'Burichan': @@ -1331,13 +1331,13 @@ export const TopBar = styled.div` font-size: 12pt; } - a { - color: #34345c; + a, #subscribe{ + color: #34345c !important; text-decoration: underline; } - a:hover { - color: red; + a:hover, #subscribe:hover { + color: red !important; }`; case 'Tomorrow': @@ -1354,13 +1354,13 @@ export const TopBar = styled.div` font-size: 10pt; } - a { - color: #81a2be; + a, #subscribe { + color: #81a2be !important; text-decoration: none; } - a:hover { - color: #5f89ab; + a:hover, #subscribe:hover { + color: #5f89ab !important; }`; case 'Photon': @@ -1377,13 +1377,13 @@ export const TopBar = styled.div` font-size: 10pt; } - a { - color: #f60; + a, #subscribe { + color: #f60 !important; text-decoration: none; } - a:hover { - color: #ff3300; + a:hover, #subscribe:hover { + color: #ff3300 !important; }`; default: @@ -1399,6 +1399,16 @@ export const TopBar = styled.div` #catalog-button-desktop { display: inline-block; } + + .subscribe-button-desktop { + float: right; + margin-right: 10px; + margin-top: 3px; + } + + .subscribe-button-mobile { + display: none; + } } @media (max-width: 480px) { @@ -1419,6 +1429,20 @@ export const TopBar = styled.div` transform: translateX(-50%); font-size: 10pt; } + + .subscribe-button-desktop { + display: none; + } + + .subscribe-button-mobile { + margin-right: 10px; + float: right; + margin-top: -2px; + + a { + cursor: pointer; + } + } } ${({ selectedStyle }) => { @@ -2928,7 +2952,6 @@ export const BoardForm = styled.div` }} @media (max-width: 480px) { - margin-top: -5%; margin-bottom: 335px; .thread { diff --git a/src/components/views/Board.jsx b/src/components/views/Board.jsx index 5a312b28..352afc02 100644 --- a/src/components/views/Board.jsx +++ b/src/components/views/Board.jsx @@ -327,6 +327,11 @@ const Board = () => { closeModal={() => setIsSettingsOpen(false)} /> <> + + [ + {}}>Subscriptions + ]  + {defaultSubplebbits.map(subplebbit => ( [ @@ -339,7 +344,7 @@ const Board = () => { [ ] @@ -356,6 +361,7 @@ const Board = () => { Board   - - - - Subject - - - - - - - Comment - -