Fixed a few icons in settings shrinking on mobile (#4331)

* Fix some icons shrinking Fixes #2297

* more shrinkage

* fix typo
This commit is contained in:
Prospector
2025-09-03 03:12:07 -07:00
committed by GitHub
parent 8aaddb9d8a
commit d23b925bb9
3 changed files with 13 additions and 13 deletions

View File

@@ -32,15 +32,15 @@
<div class="flex flex-col gap-2">
<span class="font-bold">Benefits</span>
<div class="flex items-center gap-2">
<CheckCircleIcon class="h-5 w-5 text-brand" />
<CheckCircleIcon class="h-5 w-5 shrink-0 text-brand" />
<span> Ad-free browsing on modrinth.com and Modrinth App </span>
</div>
<div class="flex items-center gap-2">
<CheckCircleIcon class="h-5 w-5 text-brand" />
<CheckCircleIcon class="h-5 w-5 shrink-0 text-brand" />
<span>Modrinth+ badge on your profile</span>
</div>
<div class="flex items-center gap-2">
<CheckCircleIcon class="h-5 w-5 text-brand" />
<CheckCircleIcon class="h-5 w-5 shrink-0 text-brand" />
<span>Support Modrinth and creators directly</span>
</div>
</div>

View File

@@ -56,9 +56,9 @@
<div class="label">
<RadioButtonCheckedIcon
v-if="cosmetics.searchDisplayMode[projectType.id] === 'list'"
class="radio"
class="radio shrink-0"
/>
<RadioButtonIcon v-else class="radio" />
<RadioButtonIcon v-else class="radio shrink-0" />
Rows
</div>
</button>
@@ -82,9 +82,9 @@
<div class="label">
<RadioButtonCheckedIcon
v-if="cosmetics.searchDisplayMode[projectType.id] === 'grid'"
class="radio"
class="radio shrink-0"
/>
<RadioButtonIcon v-else class="radio" />
<RadioButtonIcon v-else class="radio shrink-0" />
Grid
</div>
</button>
@@ -106,9 +106,9 @@
<div class="label">
<RadioButtonCheckedIcon
v-if="cosmetics.searchDisplayMode[projectType.id] === 'gallery'"
class="radio"
class="radio shrink-0"
/>
<RadioButtonIcon v-else class="radio" />
<RadioButtonIcon v-else class="radio shrink-0" />
Gallery
</div>
</button>

View File

@@ -72,18 +72,18 @@ function asString(theme: T): string {
</div>
</div>
<div class="label">
<RadioButtonCheckedIcon v-if="currentTheme === option" class="radio" />
<RadioButtonIcon v-else class="radio" />
<RadioButtonCheckedIcon v-if="currentTheme === option" class="radio shrink-0" />
<RadioButtonIcon v-else class="radio shrink-0" />
{{ colorTheme[asString(option)] ? formatMessage(colorTheme[asString(option)]) : option }}
<SunIcon
v-if="'light' === option"
v-tooltip="formatMessage(colorTheme.preferredLight)"
class="theme-icon"
class="theme-icon shrink-0"
/>
<MoonIcon
v-else-if="'dark' === option"
v-tooltip="formatMessage(colorTheme.preferredDark)"
class="theme-icon"
class="theme-icon shrink-0"
/>
</div>
</button>