Skip to content

[6.x] Adds "Set Alt" button in assets grid view #13480

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
jasonvarga merged 9 commits into from
Jan 12, 2026
Merged

[6.x] Adds "Set Alt" button in assets grid view #13480

Changes from all commits
Commits
Show all changes
9 commits
Select commit Hold shift + click to select a range
1d22301
Adds "set alt" button in assets grid view
kjetilhole Jan 8, 2026
919bec6
Re-add checkerboard background and make alt button show even if alt t…
kjetilhole Jan 9, 2026
ad7b202
Adjust button based on if filename is shown or not
kjetilhole Jan 9, 2026
54a002b
Replace blue color with sky
kjetilhole Jan 9, 2026
e97e6c5
Make alt button show even if alt text is set
kjetilhole Jan 9, 2026
6343cfe
Move alt text control to the corner of the tile instead of hiding it …
JayGeorge Jan 12, 2026
977150a
Revert some button changes
JayGeorge Jan 12, 2026
782ad50
Only show if it needs the Alt
JayGeorge Jan 12, 2026
f383990
Revert gap change
JayGeorge Jan 12, 2026
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
12 changes: 11 additions & 1 deletion resources/js/components/fieldtypes/assets/AssetTile.vue
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -49,13 +49,23 @@
</template>
</div>
</div>
<div class="absolute bottom-1 right-1">
<ui-badge
v-if="!readOnly && showSetAlt && needsAlt && !showFilename"
as="button"
size="sm"
color="sky"
:text="__('Set Alt')"
@click="editOrOpen"
/>
</div>
</div>

<div class="flex items-center justify-between w-full px-1" v-if="showFilename">
<div class="truncate w-18 text-xs text-gray-600 dark:text-gray-400 flex-1 px-2 py-1" v-tooltip="label" :class="{ 'text-center': !needsAlt }">
{{ label }}
</div>
<ui-badge as="button" size="sm" color="blue" @click="editOrOpen" v-if="asset.isEditable && showSetAlt && needsAlt" :text="asset.values.alt ? '✅' : __('Set Alt')" />
<ui-badge as="button" size="sm" color="sky" @click="editOrOpen" v-if="asset.isEditable && showSetAlt && needsAlt" :text="asset.values.alt ? '✅' : __('Set Alt')" />
</div>
</div>
</template>
Expand Down