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

test(board): test scroll with no margin

Browse Source
This commit is contained in:
plebeius.eth
2023-10-20 15:59:05 +02:00
parent 183294a66f
commit ae6c237302
2 changed files with 28 additions and 30 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/components/styled/views/Board.styled.jsx
+15 -17
View File
@@ -2062,14 +2062,14 @@ export const BoardForm = styled.div`
.op { .op {
display: inline; display: inline;
margin: 4px 0; /* margin: 4px 0; */
overflow: hidden; overflow: hidden;
} }
.post-info-mobile { .post-info-mobile {
overflow: hidden; overflow: hidden;
padding: 5px; padding: 5px;
margin: -5px -6px -5px -5px; /* margin: -5px -6px -5px -5px; */
display: block; display: block;
clear: left; clear: left;
} }
@@ -2080,7 +2080,7 @@ export const BoardForm = styled.div`
text-align: center !important; text-align: center !important;
outline: none !important; outline: none !important;
transform: rotate(90deg) !important; transform: rotate(90deg) !important;
margin: 4px -5px 0 4px !important; /* margin: 4px -5px 0 4px !important; */
float: left !important; float: left !important;
font-weight: 700 !important; font-weight: 700 !important;
opacity: 1 !important; opacity: 1 !important;
@@ -2106,12 +2106,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 {
@@ -2147,27 +2147,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; padding-top: 5px;
display: block; display: block;
margin: 10px !important; /* margin: 10px !important; */
} }
.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; /* margin-top: 8px; */
float: left; float: left;
} }
@@ -2250,7 +2248,7 @@ export const BoardForm = styled.div`
text-align: center !important; text-align: center !important;
outline: none !important; outline: none !important;
transform: rotate(90deg) !important; transform: rotate(90deg) !important;
margin: 4px -5px 0 4px !important; /* margin: 4px -5px 0 4px !important; */
float: left !important; float: left !important;
font-weight: 700 !important; font-weight: 700 !important;
opacity: 1 !important; opacity: 1 !important;
@@ -2276,7 +2274,7 @@ export const BoardForm = styled.div`
blockquote { blockquote {
display: block; display: block;
margin: 10px !important; /* margin: 10px !important; */
} }
} }
} }
@@ -3326,13 +3324,13 @@ export const BoardForm = styled.div`
}} }}
@media (max-width: 480px) { @media (max-width: 480px) {
margin-bottom: 335px; /* margin-bottom: 335px;
margin-left: -5px; margin-left: -5px;
margin-right: -5px; margin-right: -5px; */
.offline-mobile-sub { .offline-mobile-sub {
width: 16px; width: 16px;
margin-right: 5px; /* margin-right: 5px; */
} }
.offline-mobile-sub-reply { .offline-mobile-sub-reply {
src/components/views/Board.jsx
+13 -13
View File
@@ -3333,7 +3333,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 ? (
@@ -3341,7 +3341,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>
@@ -3411,7 +3411,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' }}>
@@ -3439,7 +3439,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' }}
@@ -3472,7 +3472,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 ? (
@@ -3499,7 +3499,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
@@ -3522,7 +3522,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
@@ -3548,7 +3548,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' }}
@@ -3575,7 +3575,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
@@ -4002,7 +4002,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' }}>
@@ -4030,7 +4030,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' }}
@@ -4105,7 +4105,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
@@ -4131,7 +4131,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' }}