External/5chan
1
0
Fork 0
mirror of https://github.com/bitsocialnet/5chan.git synced 2026-08-03 07:41:04 +02:00
Code Issues Packages Projects Releases Wiki Activity

Merge pull request #298 from plebbit/development

Browse Source 
Development
This commit is contained in:
plebeius.eth
2023-10-20 20:35:19 +02:00
committed by GitHub
parent b2cdadee0a 6eee096934
commit a90428dc1e
6 changed files with 41 additions and 59 deletions
Download Patch File Download Diff File Expand all files Collapse all files
package.json
+1 -1
View File
@@ -9,7 +9,7 @@
"@capacitor/android": "3.6.0", "@capacitor/android": "3.6.0",
"@capacitor/app": "1.1.1", "@capacitor/app": "1.1.1",
"@capacitor/core": "3.6.0", "@capacitor/core": "3.6.0",
"@plebbit/plebbit-react-hooks": "https://github.com/plebbit/plebbit-react-hooks.git#30095e763d80e29168dc6ee1fe7515fd91065489", "@plebbit/plebbit-react-hooks": "https://github.com/plebbit/plebbit-react-hooks.git#c0ecfc0432d64993dee738b40e59c26898a98108",
"@testing-library/dom": "9.0.1", "@testing-library/dom": "9.0.1",
"@testing-library/jest-dom": "5.14.1", "@testing-library/jest-dom": "5.14.1",
"@testing-library/react": "14.0.0", "@testing-library/react": "14.0.0",
public/assets/banners/banner-20.png
BIN
View File
Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 525 KiB

src/components/styled/views/Board.styled.jsx
+20 -35
View File
@@ -2049,30 +2049,26 @@ export const BoardForm = styled.div`
border-top: none; border-top: none;
margin: 0; margin: 0;
clear: both; clear: both;
padding-bottom: 25px;
hr { hr {
margin-top: 30px; padding-top: 25px;
margin-bottom: 30px;
} }
.op-container { .op-container {
margin: 0 -5px;
padding: 5px;
display: block; display: block;
overflow: hidden; overflow: hidden;
.op { .op {
display: inline; display: inline;
margin: 4px 0;
overflow: hidden; overflow: hidden;
} }
.post-info-mobile { .post-info-mobile {
overflow: hidden; overflow: hidden;
padding: 5px;
margin: -5px -6px -5px -5px;
display: block; display: block;
clear: left; clear: left;
padding: 5px;
} }
.post-menu-button-mobile { .post-menu-button-mobile {
@@ -2107,12 +2103,12 @@ export const BoardForm = styled.div`
display: block; display: block;
.file-thumb-mobile { .file-thumb-mobile {
margin-left: 10px !important; padding-left: 10px !important;
margin-right: 10px !important; padding-right: 10px !important;
text-decoration: none; text-decoration: none;
float: left; float: left;
margin-bottom: 5% !important; padding-bottom: 5% !important;
margin-top: 15px !important; padding-top: 15px !important;
} }
.file-info-mobile { .file-info-mobile {
@@ -2148,27 +2144,25 @@ export const BoardForm = styled.div`
} }
.thread-icons-mobile { .thread-icons-mobile {
margin-top: -1px;
margin-right: 2px;
image-rendering: pixelated; image-rendering: pixelated;
} }
blockquote { blockquote {
padding-top: 5px;
display: block; display: block;
margin: 10px !important; margin: 0;
padding: 10px;
} }
.post-link-mobile { .post-link-mobile {
clear: both !important; clear: both !important;
padding: 5px; padding: 5px;
overflow: hidden; overflow: hidden;
margin: -5px; /* margin: -5px; */
display: block !important; display: block !important;
} }
.info-mobile { .info-mobile {
margin-top: 8px; padding-top: 8px;
float: left; float: left;
} }
@@ -2182,8 +2176,8 @@ export const BoardForm = styled.div`
} }
.reply-container { .reply-container {
margin: 7px 2px 0; padding: 7px 7px 0 7px;
padding-left: 0; background-color: inherit;
.button-mobile { .button-mobile {
float: right; float: right;
@@ -2210,12 +2204,11 @@ export const BoardForm = styled.div`
display: block; display: block;
.file-thumb-mobile { .file-thumb-mobile {
margin-left: 10px !important; padding-left: 10px !important;
margin-right: 10px !important; padding-right: 10px !important;
text-decoration: none; text-decoration: none;
float: left; float: left;
margin-bottom: 5px; padding-top: 15px;
margin-top: 15px;
} }
.file-info-mobile { .file-info-mobile {
@@ -2278,7 +2271,8 @@ export const BoardForm = styled.div`
blockquote { blockquote {
display: block; display: block;
margin: 10px !important; margin: 0;
padding: 10px;
} }
} }
} }
@@ -3329,6 +3323,8 @@ export const BoardForm = styled.div`
@media (max-width: 480px) { @media (max-width: 480px) {
margin-bottom: 335px; margin-bottom: 335px;
margin-left: -5px;
margin-right: -5px;
.offline-mobile-sub { .offline-mobile-sub {
width: 16px; width: 16px;
@@ -3343,21 +3339,10 @@ export const BoardForm = styled.div`
display: none; display: none;
} }
hr {
margin-left: calc((100% - 100vw) / 2);
margin-right: calc((100% - 100vw) / 2);
}
.name-block { .name-block {
display: block; display: block;
} }
.post-info {
display: flex;
flex-wrap: wrap;
margin: 4px;
}
#bottombar-desktop { #bottombar-desktop {
display: none; display: none;
} }
src/components/views/Board.jsx
+16 -19
View File
@@ -1740,7 +1740,8 @@ const Board = () => {
</> </>
) : null} ) : null}
<Virtuoso <Virtuoso
increaseViewportBy={{ bottom: 600, top: 600 }} increaseViewportBy={{ bottom: 1200, top: 1200 }}
overscan={600}
data={selectedFeed} data={selectedFeed}
itemContent={(index, thread) => { itemContent={(index, thread) => {
if (editedComments[thread.cid]) { if (editedComments[thread.cid]) {
@@ -3139,11 +3140,7 @@ const Board = () => {
})} })}
</div> </div>
<div key={`mob-t-${index}`} className='thread-mobile'> <div key={`mob-t-${index}`} className='thread-mobile'>
{index === 0 && !subplebbit.rules && !subplebbit.description ? ( <hr key={`mob-hr-${index}`} />
<hr key={`mob-hr-${index}`} style={{ marginTop: '10px' }} />
) : (
<hr key={`mob-hr-${index}`} />
)}
<div key={`mob-c-${index}`} className='op-container'> <div key={`mob-c-${index}`} className='op-container'>
<div key={`mob-po-${index}`} className='post op op-mobile'> <div key={`mob-po-${index}`} className='post op op-mobile'>
<div key={`mob-pi-${index}`} className='post-info-mobile'> <div key={`mob-pi-${index}`} className='post-info-mobile'>
@@ -3337,7 +3334,7 @@ const Board = () => {
src='assets/sticky.gif' src='assets/sticky.gif'
alt='Sticky' alt='Sticky'
title='Sticky' title='Sticky'
style={{ all: 'unset', marginBottom: '-2px', paddingLeft: '2px', imageRendering: 'pixelated' }} style={{ all: 'unset', paddingBottom: '-2px', paddingLeft: '2px', imageRendering: 'pixelated' }}
/> />
) : null} ) : null}
{thread.locked ? ( {thread.locked ? (
@@ -3345,7 +3342,7 @@ const Board = () => {
src='assets/closed.gif' src='assets/closed.gif'
alt='Closed' alt='Closed'
title='Closed' title='Closed'
style={{ all: 'unset', marginBottom: '-2px', paddingLeft: '2px', imageRendering: 'pixelated' }} style={{ all: 'unset', paddingBottom: '-2px', paddingLeft: '2px', imageRendering: 'pixelated' }}
/> />
) : null} ) : null}
</span> </span>
@@ -3415,7 +3412,7 @@ const Board = () => {
<span <span
key={`mob-fta-${index}`} key={`mob-fta-${index}`}
className='file-thumb-mobile' className='file-thumb-mobile'
style={isMobileThreadThumbnailClicked[index] ? {} : { marginBottom: '25px' }} style={isMobileThreadThumbnailClicked[index] ? {} : { paddingBottom: '25px' }}
> >
{isMobileThreadThumbnailClicked[index] && commentMediaInfo.url ? ( {isMobileThreadThumbnailClicked[index] && commentMediaInfo.url ? (
<div style={{ width: '92vw' }}> <div style={{ width: '92vw' }}>
@@ -3443,7 +3440,7 @@ const Board = () => {
)} )}
{commentMediaInfo?.type === 'video' || commentMediaInfo?.type === 'iframe' ? ( {commentMediaInfo?.type === 'video' || commentMediaInfo?.type === 'iframe' ? (
isMobileThreadThumbnailClicked[index] ? ( isMobileThreadThumbnailClicked[index] ? (
<div style={{ textAlign: 'center', marginTop: '15px', marginBottom: '15px' }}> <div style={{ textAlign: 'center', paddingTop: '15px', paddingBottom: '15px' }}>
<span <span
className='button-mobile' className='button-mobile'
style={{ float: 'none', cursor: 'pointer' }} style={{ float: 'none', cursor: 'pointer' }}
@@ -3476,7 +3473,7 @@ const Board = () => {
style={ style={
isMobileThreadThumbnailClicked[index] || !thread.thumbnailUrl isMobileThreadThumbnailClicked[index] || !thread.thumbnailUrl
? {} ? {}
: { width: displayWidthMobile, height: displayHeightMobile, marginBottom: '25px' } : { width: displayWidthMobile, height: displayHeightMobile, paddingBottom: '25px' }
} }
> >
{thread.thumbnailUrl ? ( {thread.thumbnailUrl ? (
@@ -3503,7 +3500,7 @@ const Board = () => {
key={`mob-ft${thread.cid}`} key={`mob-ft${thread.cid}`}
className='file-thumb-mobile' className='file-thumb-mobile'
style={ style={
isMobileThreadThumbnailClicked[index] ? {} : { width: displayWidthMobile, height: displayHeightMobile, marginBottom: '25px' } isMobileThreadThumbnailClicked[index] ? {} : { width: displayWidthMobile, height: displayHeightMobile, paddingBottom: '25px' }
} }
> >
<img <img
@@ -3526,7 +3523,7 @@ const Board = () => {
<span <span
key={`mob-ft${thread.cid}`} key={`mob-ft${thread.cid}`}
className='file-thumb-mobile' className='file-thumb-mobile'
style={isMobileThreadThumbnailClicked[index] ? {} : { marginBottom: '25px' }} style={isMobileThreadThumbnailClicked[index] ? {} : { paddingBottom: '25px' }}
> >
{isMobileThreadThumbnailClicked[index] ? ( {isMobileThreadThumbnailClicked[index] ? (
<video <video
@@ -3552,7 +3549,7 @@ const Board = () => {
)} )}
{commentMediaInfo?.type === 'video' || commentMediaInfo?.type === 'iframe' ? ( {commentMediaInfo?.type === 'video' || commentMediaInfo?.type === 'iframe' ? (
isMobileThreadThumbnailClicked[index] ? ( isMobileThreadThumbnailClicked[index] ? (
<div style={{ textAlign: 'center', marginTop: '15px', marginBottom: '15px' }}> <div style={{ textAlign: 'center', paddingTop: '15px', paddingBottom: '15px' }}>
<span <span
className='button-mobile' className='button-mobile'
style={{ float: 'none', cursor: 'pointer' }} style={{ float: 'none', cursor: 'pointer' }}
@@ -3579,7 +3576,7 @@ const Board = () => {
key={`mob-ft${thread.cid}`} key={`mob-ft${thread.cid}`}
className='file-thumb-mobile' className='file-thumb-mobile'
style={ style={
isMobileThreadThumbnailClicked[index] ? {} : { width: displayWidthMobile, height: displayHeightMobile, marginBottom: '25px' } isMobileThreadThumbnailClicked[index] ? {} : { width: displayWidthMobile, height: displayHeightMobile, paddingBottom: '25px' }
} }
> >
<audio <audio
@@ -4006,7 +4003,7 @@ const Board = () => {
<span <span
key={`mob-fta-${index}`} key={`mob-fta-${index}`}
className='file-thumb-mobile' className='file-thumb-mobile'
style={isMobileReplyThumbnailClicked[index] ? {} : { marginBottom: '25px' }} style={isMobileReplyThumbnailClicked[index] ? {} : { paddingBottom: '25px' }}
> >
{isMobileReplyThumbnailClicked[index] && replyMediaInfo.url ? ( {isMobileReplyThumbnailClicked[index] && replyMediaInfo.url ? (
<div style={{ width: '92vw' }}> <div style={{ width: '92vw' }}>
@@ -4034,7 +4031,7 @@ const Board = () => {
)} )}
{replyMediaInfo?.type === 'video' || replyMediaInfo?.type === 'iframe' ? ( {replyMediaInfo?.type === 'video' || replyMediaInfo?.type === 'iframe' ? (
isMobileReplyThumbnailClicked[index] ? ( isMobileReplyThumbnailClicked[index] ? (
<div style={{ textAlign: 'center', marginTop: '15px', marginBottom: '15px' }}> <div style={{ textAlign: 'center', paddingTop: '15px', paddingBottom: '15px' }}>
<span <span
className='button-mobile' className='button-mobile'
style={{ float: 'none', cursor: 'pointer' }} style={{ float: 'none', cursor: 'pointer' }}
@@ -4109,7 +4106,7 @@ const Board = () => {
<span <span
key={`mob-ft${reply.cid}`} key={`mob-ft${reply.cid}`}
className='file-thumb-mobile' className='file-thumb-mobile'
style={isMobileReplyThumbnailClicked[index] ? {} : { marginBottom: '25px' }} style={isMobileReplyThumbnailClicked[index] ? {} : { paddingBottom: '25px' }}
> >
{isMobileReplyThumbnailClicked[index] ? ( {isMobileReplyThumbnailClicked[index] ? (
<video <video
@@ -4135,7 +4132,7 @@ const Board = () => {
)} )}
{replyMediaInfo?.type === 'video' || replyMediaInfo?.type === 'iframe' ? ( {replyMediaInfo?.type === 'video' || replyMediaInfo?.type === 'iframe' ? (
isMobileReplyThumbnailClicked[index] ? ( isMobileReplyThumbnailClicked[index] ? (
<div style={{ textAlign: 'center', marginTop: '15px', marginBottom: '15px' }}> <div style={{ textAlign: 'center', paddingTop: '15px', paddingBottom: '15px' }}>
<span <span
className='button-mobile' className='button-mobile'
style={{ float: 'none', cursor: 'pointer' }} style={{ float: 'none', cursor: 'pointer' }}
src/components/views/Home.jsx
+2 -2
View File
@@ -20,7 +20,7 @@ const PopularThreads = ({ commentCid }) => {
const commentMediaInfo = getCommentMediaInfo(comment); const commentMediaInfo = getCommentMediaInfo(comment);
return ( return (
<div className='board'> <div className='board' key={`${commentCid}`}>
<div className='board-title' key='board-title'> <div className='board-title' key='board-title'>
<span>{subplebbit.title || subplebbit.address}</span> <span>{subplebbit.title || subplebbit.address}</span>
</div> </div>
@@ -111,7 +111,7 @@ const Home = () => {
const uniqueCids = Array.from(new Set([...prevOrderedCids, ...newSfwListCids])); const uniqueCids = Array.from(new Set([...prevOrderedCids, ...newSfwListCids]));
return uniqueCids.slice(0, 8); return uniqueCids.slice(0, 8);
}); });
}, [sfwSubs.subplebbits, sfwListCids]); }, [sfwSubs.subplebbits]);
const account = useAccount(); const account = useAccount();
const navigate = useNavigate(); const navigate = useNavigate();
yarn.lock
+2 -2
View File
@@ -2832,9 +2832,9 @@
uuid "8.3.2" uuid "8.3.2"
zustand "4.0.0" zustand "4.0.0"
"@plebbit/plebbit-react-hooks@https://github.com/plebbit/plebbit-react-hooks.git#f6bbd8a323e8ba13618da7b64b852f10d93688d0": "@plebbit/plebbit-react-hooks@https://github.com/plebbit/plebbit-react-hooks.git#c0ecfc0432d64993dee738b40e59c26898a98108":
version "0.0.1" version "0.0.1"
resolved "https://github.com/plebbit/plebbit-react-hooks.git#f6bbd8a323e8ba13618da7b64b852f10d93688d0" resolved "https://github.com/plebbit/plebbit-react-hooks.git#c0ecfc0432d64993dee738b40e59c26898a98108"
dependencies: dependencies:
"@plebbit/plebbit-js" "https://github.com/plebbit/plebbit-js.git#6985b2a4194328752c6d76e80470c8079c562869" "@plebbit/plebbit-js" "https://github.com/plebbit/plebbit-js.git#6985b2a4194328752c6d76e80470c8079c562869"
"@plebbit/plebbit-logger" "https://github.com/plebbit/plebbit-logger.git" "@plebbit/plebbit-logger" "https://github.com/plebbit/plebbit-logger.git"