diff --git a/public/assets/buttonfade-blue.png b/public/assets/buttons/buttonfade-blue.png similarity index 100% rename from public/assets/buttonfade-blue.png rename to public/assets/buttons/buttonfade-blue.png diff --git a/public/assets/buttonfade-dark.png b/public/assets/buttons/buttonfade-dark.png similarity index 100% rename from public/assets/buttonfade-dark.png rename to public/assets/buttons/buttonfade-dark.png diff --git a/public/assets/buttonfade.png b/public/assets/buttons/buttonfade.png similarity index 100% rename from public/assets/buttonfade.png rename to public/assets/buttons/buttonfade.png diff --git a/public/assets/closed.gif b/public/assets/icons/closed.gif similarity index 100% rename from public/assets/closed.gif rename to public/assets/icons/closed.gif diff --git a/public/assets/offline.png b/public/assets/icons/offline.png similarity index 100% rename from public/assets/offline.png rename to public/assets/icons/offline.png diff --git a/public/assets/sticky.gif b/public/assets/icons/sticky.gif similarity index 100% rename from public/assets/sticky.gif rename to public/assets/icons/sticky.gif diff --git a/src/components/board-banner/board-banner.module.css b/src/components/board-banner/board-banner.module.css index cf1ef2ab..89b5fb97 100644 --- a/src/components/board-banner/board-banner.module.css +++ b/src/components/board-banner/board-banner.module.css @@ -31,4 +31,11 @@ border: var(--hr-border, revert); border-top: var(--hr-border-top, revert); height: var(--hr-height, revert); -} \ No newline at end of file +} + + +@media (max-width: 640px) { + .bannerCnt { + padding-top: 35px; + } + } \ No newline at end of file diff --git a/src/components/board-stats/board-stats.module.css b/src/components/board-stats/board-stats.module.css index 17300ae4..1008b127 100644 --- a/src/components/board-stats/board-stats.module.css +++ b/src/components/board-stats/board-stats.module.css @@ -40,4 +40,11 @@ .lowercase { text-transform: lowercase; +} + + +@media (max-width: 640px) { + .content { + display: none; + } } \ No newline at end of file diff --git a/src/components/post-form/post-form.module.css b/src/components/post-form/post-form.module.css index e071d1ca..95fede2b 100644 --- a/src/components/post-form/post-form.module.css +++ b/src/components/post-form/post-form.module.css @@ -1,15 +1,48 @@ -.togglePostForm { +.postFormButtonDesktop { font-size: var(--post-form-toggle-font-size); font-weight: var(--post-form-toggle-font-weight); text-align: center; } -.togglePostForm span { +.postFormButtonDesktop span { color: var(--button-text-color); text-decoration: var(--button-text-decoration); } -.togglePostForm span:hover { +.postFormButtonDesktop span:hover { cursor: pointer; color: var(--button-text-color-hover); +} + +.postFormButtonMobile { + text-align: center; + padding-top: 5px; +} + +.postFormButtonMobile span { + font-size: var(--button-font-size-mobile); + font-weight: var(--button-font-weight-mobile); + font-family: var(--button-font-family-mobile); + border-radius: 3px; + padding: 5px 10px 5px; + background-color: var(--button-background-color-mobile); + color: var(--button-text-color-mobile); + border: var(--button-border-mobile); + background-image: var(--button-background-image-mobile); + background-repeat: var(--button-background-repeat-mobile); + text-decoration: var(--button-text-decoration-mobile); + user-select: none; + display: inline-block; +} + +@media (max-width: 640px) { + .postFormButtonDesktop { + display: none; + } +} + +@media (min-width: 641px) { + .postFormButtonMobile { + display: none; + } } \ No newline at end of file diff --git a/src/components/post-form/post-form.tsx b/src/components/post-form/post-form.tsx index 0efde90c..fe71e5be 100644 --- a/src/components/post-form/post-form.tsx +++ b/src/components/post-form/post-form.tsx @@ -9,9 +9,14 @@ const PostForm = ({ address }: PostFormProps) => { const { t } = useTranslation(); return ( -