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:
@@ -50,22 +50,28 @@
|
|||||||
<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
|
<div class="flex items-center flex-wrap gap-2">
|
||||||
v-if="course.tags"
|
<div
|
||||||
v-for="tag in course.tags?.split(', ')"
|
v-if="course.tags"
|
||||||
class="flex items-center bg-surface-gray-2 text-ink-gray-7 p-2 rounded-md mr-2"
|
v-for="tag in course.tags?.split(', ')"
|
||||||
>
|
class="flex items-center bg-surface-gray-2 text-ink-gray-7 p-2 rounded-md"
|
||||||
{{ tag }}
|
>
|
||||||
<X
|
{{ tag }}
|
||||||
class="stroke-1.5 w-3 h-3 ml-2 cursor-pointer"
|
<X
|
||||||
@click="removeTag(tag)"
|
class="stroke-1.5 w-3 h-3 ml-2 cursor-pointer"
|
||||||
/>
|
@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"
|
||||||
/>
|
/>
|
||||||
|
|||||||
Reference in New Issue
Block a user