diff --git a/Iceshrimp.Frontend/Components/EmojiManagementEntry.razor.css b/Iceshrimp.Frontend/Components/EmojiManagementEntry.razor.css index f6a5c38a..894e44c3 100644 --- a/Iceshrimp.Frontend/Components/EmojiManagementEntry.razor.css +++ b/Iceshrimp.Frontend/Components/EmojiManagementEntry.razor.css @@ -3,6 +3,7 @@ align-items: center; gap: 0.5rem; padding: 0.5rem; + width: 25rem; background-color: var(--foreground-color); border-radius: 0.5rem; cursor: pointer; @@ -38,4 +39,10 @@ line-height: 1; color: var(--notice-color); } +} + +@media (max-width: 1000px) { + .emoji-entry { + width: 100%; + } } \ No newline at end of file diff --git a/Iceshrimp.Frontend/Pages/Moderation/CustomEmojis.razor.css b/Iceshrimp.Frontend/Pages/Moderation/CustomEmojis.razor.css index 15c0cbc7..56fa628a 100644 --- a/Iceshrimp.Frontend/Pages/Moderation/CustomEmojis.razor.css +++ b/Iceshrimp.Frontend/Pages/Moderation/CustomEmojis.razor.css @@ -1,15 +1,16 @@ .emoji-search { display: flex; margin-top: 1rem; + + button { + margin-right: 0; + } } .search { display: inline-block; width: 100%; -} - -.search-from { - display: inline-block; + margin-left: 0; } .category-name { @@ -19,8 +20,8 @@ } .emoji-list { - display: grid; - grid-template-columns: repeat(2, 1fr); + display: flex; + flex-wrap: wrap; gap: 0.5rem; width: 100%; } @@ -37,6 +38,6 @@ @media (max-width: 1000px) { .emoji-list { - grid-template-columns: 1fr; + flex-direction: column; } } \ No newline at end of file diff --git a/Iceshrimp.Frontend/Pages/Moderation/CustomEmojisRemote.razor.css b/Iceshrimp.Frontend/Pages/Moderation/CustomEmojisRemote.razor.css index df74ed9c..2fe4b2dc 100644 --- a/Iceshrimp.Frontend/Pages/Moderation/CustomEmojisRemote.razor.css +++ b/Iceshrimp.Frontend/Pages/Moderation/CustomEmojisRemote.razor.css @@ -1,6 +1,10 @@ .emoji-search { display: flex; margin: 1rem 0; + + button { + margin-right: 0; + } } .search { @@ -8,9 +12,13 @@ width: 100%; } +.search:first-of-type { + margin-left: 0; +} + .emoji-list { - display: grid; - grid-template-columns: repeat(2, 1fr); + display: flex; + flex-wrap: wrap; gap: 0.5rem; width: 100%; } @@ -19,4 +27,10 @@ display: flex; justify-content: center; margin-top: 5rem; +} + +@media (max-width: 1000px) { + .emoji-list { + flex-direction: column; + } } \ No newline at end of file