diff --git a/src/components/styled/views/Board.styled.jsx b/src/components/styled/views/Board.styled.jsx index 20fcc6fa..d7b082f6 100644 --- a/src/components/styled/views/Board.styled.jsx +++ b/src/components/styled/views/Board.styled.jsx @@ -1906,6 +1906,9 @@ export const BoardForm = styled.div` float: left; margin: 3px 20px 5px 20px; background-color: rgba(0, 0, 0, 0.05); + display: flex; + justify-content: center; + align-items: center; } .reply-file-text { @@ -1914,17 +1917,25 @@ export const BoardForm = styled.div` margin-left: 5px; } - .file-thumb-reply { + .file-thumb-reply, + .file-thumb-mobile { + display: flex; + justify-content: center; + align-items: center; float: left; + } + + .file-thumb-reply { margin: 3px 20px 5px 20px; } - + .file-thumb img, .file-thumb video, .file-thumb audio { border: none; max-width: 250px; max-height: 250px; + margin: 0; } .file-thumb-reply img, @@ -1933,7 +1944,6 @@ export const BoardForm = styled.div` max-width: 125px; max-height: 125px; } - } .thread-mobile { @@ -1996,16 +2006,16 @@ export const BoardForm = styled.div` .file-mobile { display: block; - + .file-thumb-mobile { margin-left: 10px !important; margin-right: 10px !important; text-decoration: none; float: left; - margin-bottom: 5px; - margin-top: 15px; + margin-bottom: 5% !important; + margin-top: 15px !important; } - + .file-info-mobile { padding-top: 5px; text-align: center; @@ -2013,7 +2023,6 @@ export const BoardForm = styled.div` display: block !important; clear: left !important; } - } video { @@ -2036,6 +2045,7 @@ export const BoardForm = styled.div` max-width: 100px; max-height: 100px; object-fit: scale-down; + margin: 0; } blockquote { diff --git a/src/components/styled/views/Catalog.styled.jsx b/src/components/styled/views/Catalog.styled.jsx index 11262293..ade45065 100644 --- a/src/components/styled/views/Catalog.styled.jsx +++ b/src/components/styled/views/Catalog.styled.jsx @@ -64,13 +64,17 @@ export const Threads = styled.div` .file-thumb { background-color: rgba(0, 0, 0, 0.05); display: inline-block; + text-align: center; + line-height: 150px; + margin-bottom: 5px; } .card { - display: inline; + display: inline-block; margin: auto; box-shadow: 0 0 5px rgba(0, 0, 0, .25); border: 0; + vertical-align: middle; } .thread-icons { diff --git a/src/components/views/Catalog.jsx b/src/components/views/Catalog.jsx index c6cab3f2..f608af8b 100755 --- a/src/components/views/Catalog.jsx +++ b/src/components/views/Catalog.jsx @@ -453,7 +453,7 @@ const CatalogPost = ({post}) => { ) : null} -
+
R: 0 / L: 0 {subplebbit.suggested?.avatarUrl ? null : (