Merge pull request #1619 from JoeBrar/fix/lms-issues

fix: ensure tags wrap correctly to prevent overflow and breaking of layout
This commit is contained in:
Jannat Patel
2025-07-07 12:59:26 +05:30
committed by GitHub

View File

@@ -50,11 +50,12 @@
<div class="mb-1.5 text-xs text-ink-gray-5"> <div class="mb-1.5 text-xs text-ink-gray-5">
{{ __('Tags') }} {{ __('Tags') }}
</div> </div>
<div class="flex items-center"> <div>
<div class="flex items-center flex-wrap gap-2">
<div <div
v-if="course.tags" v-if="course.tags"
v-for="tag in course.tags?.split(', ')" v-for="tag in course.tags?.split(', ')"
class="flex items-center bg-surface-gray-2 text-ink-gray-7 p-2 rounded-md mr-2" class="flex items-center bg-surface-gray-2 text-ink-gray-7 p-2 rounded-md"
> >
{{ tag }} {{ tag }}
<X <X
@@ -62,10 +63,15 @@
@click="removeTag(tag)" @click="removeTag(tag)"
/> />
</div> </div>
</div>
<FormControl <FormControl
v-model="newTag" v-model="newTag"
:placeholder="__('Add a keyword and then press enter')" :placeholder="__('Add a keyword and then press enter')"
class="w-full" :class="[
'w-full',
'flex-1',
{ 'mt-2': course.tags?.length },
]"
@keyup.enter="updateTags()" @keyup.enter="updateTags()"
id="tags" id="tags"
/> />