MIDNIGHT/frappe-lms
2
0
Fork 0
mirror of https://github.com/frappe/lms.git synced 2026-04-19 22:52:29 +03:00
Code Issues Packages Projects Releases Wiki Activity

refactor(pages): swap tailwindcss classes with ones with rtl support

Browse Source
This commit is contained in:
raizasafeel
2026-04-10 14:58:00 +05:30
parent 453862a653
commit fa94e5f96a
53 changed files with 157 additions and 157 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
frontend/src/pages/AssignmentSubmissionList.vue
View File

@@ -26,7 +26,7 @@
rowKey="name"
>
<ListHeader
class="mb-2 grid items-center space-x-4 rounded bg-surface-gray-2 p-2"
class="mb-2 grid items-center gap-x-4 rounded bg-surface-gray-2 p-2"
>
<ListHeaderItem :item="item" v-for="item in submissionColumns" />
</ListHeader>

2
frontend/src/pages/Batches/BatchDetail.vue
View File

@@ -4,7 +4,7 @@
class="sticky top-0 z-10 border-b flex items-center justify-between bg-surface-white px-3 py-2.5 sm:px-5"
>
<Breadcrumbs :items="breadcrumbs" />
<div v-if="tabIndex == 5 && isAdmin" class="flex items-center space-x-2">
<div v-if="tabIndex == 5 && isAdmin" class="flex items-center gap-x-2">
<Badge v-if="childRef?.isDirty" theme="orange">
{{ __('Not Saved') }}
</Badge>

2
frontend/src/pages/Batches/BatchOverview.vue
View File

@@ -10,7 +10,7 @@
</div>
<div class="flex avatar-group overlap">
<div
class="h-6 mr-1"
class="h-6 me-1"
:class="{
'avatar-group overlap': batch.data.instructors.length > 1,
}"

4
frontend/src/pages/Batches/Batches.vue
View File

@@ -34,7 +34,7 @@
<template #suffix>
<ChevronDown
:class="[
'w-4 h-4 stroke-1.5 ml-1 transform transition-transform',
'w-4 h-4 stroke-1.5 ms-1 transform transition-transform',
open ? 'rotate-180' : '',
]"
/>
@@ -51,7 +51,7 @@
{{ __('All Batches') }}
</div>
<div
class="flex flex-col space-y-3 lg:space-y-0 lg:flex-row lg:items-center lg:space-x-4"
class="flex flex-col space-y-3 lg:space-y-0 lg:flex-row lg:items-center lg:gap-x-4"
>
<TabButtons
v-if="user.data"

8
frontend/src/pages/Batches/components/AdminBatchDashboard.vue
View File

@@ -26,11 +26,11 @@
<div class="grid grid-cols-1 lg:grid-cols-[3fr_2fr] gap-5 items-start">
<div class="border rounded-lg py-3 px-4 order-2 lg:order-1">
<div class="flex items-center justify-between space-x-2 mb-3">
<div class="flex items-center justify-between gap-x-2 mb-3">
<div class="text-lg text-ink-gray-9 font-semibold">
{{ __('Students') }}
</div>
<div class="flex items-center space-x-2">
<div class="flex items-center gap-x-2">
<FormControl
v-model="searchFilter"
:placeholder="__('Search by name')"
@@ -62,7 +62,7 @@
}"
>
<ListHeader
class="mb-2 grid items-center space-x-4 rounded bg-surface-white border-b rounded-none p-2"
class="mb-2 grid items-center gap-x-4 rounded bg-surface-white border-b rounded-none p-2"
>
<ListHeaderItem
:item="item"
@@ -91,7 +91,7 @@
<!-- <ProgressBar
v-else-if="column.key == 'progress'"
:progress="Math.ceil(row[column.key])"
class="!mx-0 !mr-4"
class="!mx-0 !me-4"
/> -->
</template>
<div v-if="column.key == 'creation'">

2
frontend/src/pages/Batches/components/Announcements.vue
View File

@@ -9,7 +9,7 @@
<div class="flex items-center justify-between mb-2">
<div class="flex items-center">
<Avatar :label="comm.sender_full_name" size="lg" />
<div class="ml-2 text-ink-gray-7">
<div class="ms-2 text-ink-gray-7">
{{ comm.sender_full_name }}
</div>
</div>

2
frontend/src/pages/Batches/components/Assessments.vue
View File

@@ -24,7 +24,7 @@
}"
>
<ListHeader
class="mb-2 grid items-center space-x-4 rounded-none rounded-t bg-surface-gray-2 p-2"
class="mb-2 grid items-center gap-x-4 rounded-none rounded-t bg-surface-gray-2 p-2"
>
<ListHeaderItem :item="item" v-for="item in getAssessmentColumns()">
</ListHeaderItem>

6
frontend/src/pages/Batches/components/BatchCard.vue
View File

@@ -39,7 +39,7 @@
class="text-sm text-ink-gray-7"
/>
<div class="flex items-center text-sm text-ink-gray-7">
<Clock class="h-4 w-4 stroke-1.5 mr-2 text-ink-gray-7" />
<Clock class="h-4 w-4 stroke-1.5 me-2 text-ink-gray-7" />
<span>
{{ formatTime(batch.start_time) }} - {{ formatTime(batch.end_time) }}
</span>
@@ -48,7 +48,7 @@
v-if="batch.timezone"
class="flex items-center text-sm text-ink-gray-7"
>
<Globe class="h-4 w-4 stroke-1.5 mr-2 text-ink-gray-5" />
<Globe class="h-4 w-4 stroke-1.5 me-2 text-ink-gray-5" />
<span>
{{ batch.timezone }}
</span>
@@ -59,7 +59,7 @@
class="flex avatar-group overlap mt-4"
>
<div
class="h-6 mr-1"
class="h-6 me-1"
:class="{ 'avatar-group overlap': batch.instructors.length > 1 }"
>
<UserAvatar

2
frontend/src/pages/Batches/components/BatchCourses.vue
View File

@@ -27,7 +27,7 @@
}"
>
<ListHeader
class="mb-2 grid items-center space-x-4 rounded-none rounded-t bg-surface-gray-2 p-2"
class="mb-2 grid items-center gap-x-4 rounded-none rounded-t bg-surface-gray-2 p-2"
>
<ListHeaderItem :item="item" v-for="item in getCoursesColumns()">
</ListHeaderItem>

4
frontend/src/pages/Batches/components/BatchDashboard.vue
View File

@@ -35,7 +35,7 @@
}"
>
<ListHeader
class="mb-2 grid items-center space-x-4 rounded-none rounded-t bg-surface-gray-2 p-2"
class="mb-2 grid items-center gap-x-4 rounded-none rounded-t bg-surface-gray-2 p-2"
>
</ListHeader>
<ListRows>
@@ -65,7 +65,7 @@
<Assessments :batch="batch.data.name" />
</div>
</div>
<div class="border-l h-[88vh] divide-y">
<div class="border-s h-[88vh] divide-y">
<div v-if="batch.data?.evaluation" class="p-4 mb-5">
<UpcomingEvaluations
:batch="batch.data.name"

10
frontend/src/pages/Batches/components/BatchOverlay.vue
View File

@@ -14,7 +14,7 @@
size="md"
:class="
batch.data.amount || batch.data.courses.length
? 'float-right'
? 'float-end'
: 'w-fit mb-4'
"
:label="
@@ -28,7 +28,7 @@
variant="subtle"
theme="red"
size="md"
class="float-right"
class="float-end"
:label="__('Sold Out')"
/>
<div
@@ -41,7 +41,7 @@
v-if="batch.data.courses.length"
class="flex items-center mb-3 text-ink-gray-7"
>
<BookOpen class="h-4 w-4 stroke-1.5 mr-2" />
<BookOpen class="h-4 w-4 stroke-1.5 me-2" />
<span> {{ batch.data.courses.length }} {{ __('Courses') }} </span>
</div>
<DateRange
@@ -50,14 +50,14 @@
class="mb-3"
/>
<div class="flex items-center mb-3 text-ink-gray-7">
<Clock class="h-4 w-4 stroke-1.5 mr-2" />
<Clock class="h-4 w-4 stroke-1.5 me-2" />
<span>
{{ formatTime(batch.data.start_time) }} -
{{ formatTime(batch.data.end_time) }}
</span>
</div>
<div v-if="batch.data.timezone" class="flex items-center text-ink-gray-7">
<Globe class="h-4 w-4 stroke-1.5 mr-2" />
<Globe class="h-4 w-4 stroke-1.5 me-2" />
<span>
{{ batch.data.timezone }}
</span>

12
frontend/src/pages/Batches/components/BatchStudentProgress.vue
View File

@@ -7,10 +7,10 @@
>
<template #body>
<div v-if="studentDetails.data" class="p-5 space-y-10 text-sm">
<div class="flex items-center space-x-2">
<div class="flex items-center gap-x-2">
<Avatar :image="studentDetails.data.user_image" size="3xl" />
<div class="space-y-1">
<div class="flex items-center space-x-2">
<div class="flex items-center gap-x-2">
<div class="text-xl font-semibold text-ink-gray-9">
{{ studentDetails.data.full_name }}
</div>
@@ -46,7 +46,7 @@
}"
>
<ListHeader
class="mb-2 grid items-center space-x-4 rounded-none rounded-t bg-surface-gray-2 p-2"
class="mb-2 grid items-center gap-x-4 rounded-none rounded-t bg-surface-gray-2 p-2"
>
</ListHeader>
<ListRows v-for="row in studentDetails.data.assessments">
@@ -88,7 +88,7 @@
}"
>
<ListHeader
class="mb-2 grid items-center space-x-4 rounded-none rounded-t bg-surface-gray-2 p-2"
class="mb-2 grid items-center gap-x-4 rounded-none rounded-t bg-surface-gray-2 p-2"
>
</ListHeader>
<ListRows v-for="row in studentDetails.data.courses">
@@ -103,12 +103,12 @@
<ProgressBar
v-if="column.key == 'progress'"
:progress="Math.ceil(row[column.key])"
class="!mx-0 !mr-4 max-w-32"
class="!mx-0 !me-4 max-w-32"
/>
</template>
<div
v-if="column.key == 'progress'"
class="text-xs !ml-0 !mr-3 w-5"
class="text-xs !ms-0 !me-3 w-5"
>
{{ Math.ceil(row[column.key]) }}%
</div>

10
frontend/src/pages/Batches/components/LiveClass.vue
View File

@@ -2,7 +2,7 @@
<div class="p-5">
<div
v-if="isAdmin() && !hasProviderAccount()"
class="flex lg:items-center space-x-2 mb-5 bg-surface-amber-1 px-3 py-2 rounded-lg text-ink-amber-3"
class="flex lg:items-center gap-x-2 mb-5 bg-surface-amber-1 px-3 py-2 rounded-lg text-ink-amber-3"
>
<AlertCircle class="size-7 md:size-4 stroke-1.5" />
<span class="leading-5">
@@ -50,13 +50,13 @@
{{ cls.description }}
</div>
<div class="mt-auto space-y-3">
<div class="flex items-center space-x-2">
<div class="flex items-center gap-x-2">
<Calendar class="w-4 h-4 stroke-1.5" />
<span>
{{ dayjs(cls.date).format('DD MMMM YYYY') }}
</span>
</div>
<div class="flex items-center space-x-2">
<div class="flex items-center gap-x-2">
<Clock class="w-4 h-4 stroke-1.5" />
<span>
{{ dayjs(getClassStart(cls)).format('hh:mm A') }} -
@@ -65,7 +65,7 @@
</div>
<div
v-if="canAccessClass(cls) && cls.join_url"
class="flex items-center space-x-2 text-ink-gray-9 mt-auto"
class="flex items-center gap-x-2 text-ink-gray-9 mt-auto"
>
<a
v-if="user.data?.is_moderator || user.data?.is_evaluator"
@@ -91,7 +91,7 @@
:text="__('This class has ended')"
placement="right"
>
<div class="flex items-center space-x-2 text-ink-amber-3 w-fit">
<div class="flex items-center gap-x-2 text-ink-amber-3 w-fit">
<Info class="w-4 h-4 stroke-1.5" />
<span>
{{ __('Ended') }}

2
frontend/src/pages/Batches/components/NewBatchModal.vue
View File

@@ -102,7 +102,7 @@
</div>
</template>
<template #actions="{ close }">
<div class="text-right">
<div class="text-end">
<Button variant="solid" @click="saveBatch(close)">
{{ __('Save') }}
</Button>

4
frontend/src/pages/Billing.vue
View File

@@ -63,7 +63,7 @@
<span class="text-ink-gray-5 uppercase text-xs">
{{ __('Enter a Coupon Code') }}:
</span>
<div class="flex items-center space-x-2">
<div class="flex items-center gap-x-2">
<FormControl
v-model="appliedCoupon"
:disabled="orderSummary.data.discount_amount > 0"
@@ -103,7 +103,7 @@
</p>
</div>
<div class="flex-1 lg:mr-10">
<div class="flex-1 lg:me-10">
<div class="mb-5">
<div class="text-lg font-semibold text-ink-gray-9">
{{ __('Address') }}

10
frontend/src/pages/CertifiedParticipants.vue
View File

@@ -18,9 +18,9 @@
{{ memberCount }} {{ __('Certified Members') }}
</div>
<div
class="flex flex-col md:flex-row md:items-center space-y-4 md:space-y-0 md:space-x-4"
class="flex flex-col md:flex-row md:items-center space-y-4 md:space-y-0 md:gap-x-4"
>
<div class="flex items-center space-x-4">
<div class="flex items-center gap-x-4">
<FormControl
v-model="nameFilter"
:placeholder="__('Search by Name')"
@@ -40,7 +40,7 @@
/>
</div>
</div>
<div class="flex items-center space-x-4">
<div class="flex items-center gap-x-4">
<Switch
size="sm"
v-model="openToWork"
@@ -68,7 +68,7 @@
>
<div class="rounded-md hover:bg-surface-gray-2 px-3">
<div
class="flex items-center w-full space-x-3 py-2"
class="flex items-center w-full gap-x-3 py-2"
:class="{
'border-b': index < participants.data.length - 1,
}"
@@ -88,7 +88,7 @@
</div>
</div>
<div
class="flex items-center space-x-3 md:space-x-24 text-sm md:text-base mt-1.5"
class="flex items-center gap-x-3 md:gap-x-24 text-sm md:text-base mt-1.5"
>
<div class="text-ink-gray-5">
{{ participant.certificate_count }}

12
frontend/src/pages/Courses/CourseDashboard.vue
View File

@@ -25,7 +25,7 @@
<div class="text-lg text-ink-gray-9 font-semibold">
{{ __('Students') }}
</div>
<div class="flex items-center space-x-2">
<div class="flex items-center gap-x-2">
<FormControl
v-model="searchFilter"
:placeholder="__('Search by name')"
@@ -53,7 +53,7 @@
}"
>
<ListHeader
class="mb-2 grid items-center space-x-4 rounded bg-surface-white border-b rounded-none p-2"
class="mb-2 grid items-center gap-x-4 rounded bg-surface-white border-b rounded-none p-2"
>
<ListHeaderItem
:item="item"
@@ -91,7 +91,7 @@
<ProgressBar
v-else-if="column.key == 'progress'"
:progress="Math.ceil(row[column.key])"
class="!mx-0 !mr-4"
class="!mx-0 !me-4"
/>
</template>
<div v-if="column.key == 'creation'">
@@ -153,12 +153,12 @@
}"
></div>
<Tooltip :text="row.name.split('(')[1].replace(')', '')">
<div class="ml-2">
<div class="ms-2">
{{ row.name.split('(')[0] }}
</div>
</Tooltip>
<Tooltip :text="row.value">
<div class="ml-auto">
<div class="ms-auto">
{{
Math.round((row.value / course.data?.enrollments) * 100)
}}%
@@ -221,7 +221,7 @@
class="flex justify-between text-sm py-2 my-1 text-ink-gray-9"
>
<div class="">
<span class="mr-3 text-xs">
<span class="me-3 text-xs">
{{ progress.chapter_idx }}.{{ progress.idx }}
</span>
<span>

2
frontend/src/pages/Courses/CourseDetail.vue
View File

@@ -4,7 +4,7 @@
class="sticky top-0 z-10 flex items-center justify-between border-b bg-surface-white px-3 py-2.5 sm:px-5"
>
<Breadcrumbs class="h-7" :items="breadcrumbs" />
<div v-if="tabIndex == 2" class="flex items-center space-x-2">
<div v-if="tabIndex == 2" class="flex items-center gap-x-2">
<Badge v-if="childRef?.isDirty" theme="orange">
{{ __('Not Saved') }}
</Badge>

2
frontend/src/pages/Courses/CourseEnrollmentModal.vue
View File

@@ -42,7 +42,7 @@
</div>
</template>
<template #actions="{ close }">
<div class="text-right">
<div class="text-end">
<Button variant="solid" @click="enrollStudent(close)">
{{ __('Enroll') }}
</Button>

16
frontend/src/pages/Courses/CourseForm.vue
View File

@@ -1,12 +1,12 @@
<template>
<div class="pl-5">
<div class="ps-5">
<div class="grid grid-cols-1 md:grid-cols-[70%,30%]">
<div
v-if="courseResource.doc"
class="lg:max-h-[88vh] lg:overflow-y-auto px-1"
>
<div class="my-5">
<div class="pr-5 md:pr-10 pb-5 mb-5 space-y-5 border-b">
<div class="pe-5 md:pe-10 pb-5 mb-5 space-y-5 border-b">
<div class="text-lg font-semibold mb-4 text-ink-gray-9">
{{ __('Details') }}
</div>
@@ -55,7 +55,7 @@
<button
v-for="tag in parsedTags"
:key="tag"
class="inline-flex items-center gap-1 bg-surface-white border border-outline-gray-2 text-ink-gray-7 pl-2 pr-1.5 py-0.5 rounded text-base leading-5"
class="inline-flex items-center gap-1 bg-surface-white border border-outline-gray-2 text-ink-gray-7 ps-2 pe-1.5 py-0.5 rounded text-base leading-5"
@click.stop="removeTag(tag)"
>
<span>{{ tag }}</span>
@@ -99,7 +99,7 @@
</div>
</div>
<div class="pr-5 md:pr-10 pb-5 mb-5 space-y-5 border-b">
<div class="pe-5 md:pe-10 pb-5 mb-5 space-y-5 border-b">
<div class="text-lg font-semibold text-ink-gray-9">
{{ __('Publishing Settings') }}
</div>
@@ -153,7 +153,7 @@
</div>
</div>
<div class="pr-5 md:pr-10 pb-5 mb-5 space-y-5 border-b">
<div class="pe-5 md:pe-10 pb-5 mb-5 space-y-5 border-b">
<div class="text-lg font-semibold text-ink-gray-9">
{{ __('About the Course') }}
</div>
@@ -217,7 +217,7 @@
/>
</div>
<div class="pr-5 md:pr-10 pb-5 space-y-5 border-b">
<div class="pe-5 md:pe-10 pb-5 space-y-5 border-b">
<div class="text-lg font-semibold mt-5 text-ink-gray-9">
{{ __('Pricing and Certification') }}
</div>
@@ -294,7 +294,7 @@
</div>
</div>
<div class="pr-5 md:pr-10 pb-5 space-y-5">
<div class="pe-5 md:pe-10 pb-5 space-y-5">
<div class="text-lg font-semibold mt-5 text-ink-gray-9">
{{ __('Meta Tags') }}
</div>
@@ -318,7 +318,7 @@
</div>
</div>
</div>
<div class="min-h-0 border-l">
<div class="min-h-0 border-s">
<CourseOutline
v-if="courseResource.doc"
:courseName="courseResource.doc.name"

10
frontend/src/pages/Courses/CourseOverview.vue
View File

@@ -1,6 +1,6 @@
<template>
<div class="p-5">
<div class="flex justify-between w-full space-x-5">
<div class="flex justify-between w-full gap-x-5">
<div class="md:w-2/3">
<div class="text-3xl font-semibold text-ink-gray-9">
{{ course.data.title }}
@@ -15,7 +15,7 @@
class="flex items-center"
>
<Star class="size-4 text-transparent fill-yellow-500" />
<span class="ml-1 text-ink-gray-7">
<span class="ms-1 text-ink-gray-7">
{{ course.data.rating }}
</span>
</Tooltip>
@@ -28,14 +28,14 @@
class="flex items-center"
>
<Users class="h-4 w-4 text-ink-gray-7" />
<span class="ml-1">
<span class="ms-1">
{{ course.data.enrollment_count_formatted }}
</span>
</Tooltip>
<span v-if="course.data.enrollment_count" class="mx-3">&middot;</span>
<div class="flex items-center">
<span
class="h-6 mr-1"
class="h-6 me-1"
:class="{
'avatar-group overlap': course.data.instructors.length > 1,
}"
@@ -52,7 +52,7 @@
<Badge
theme="gray"
size="lg"
class="mr-2 text-ink-gray-9"
class="me-2 text-ink-gray-9"
v-for="tag in course.data.tags.split(', ')"
>
{{ tag }}

4
frontend/src/pages/Courses/Courses.vue
View File

@@ -37,7 +37,7 @@
<template #suffix>
<ChevronDown
:class="[
'w-4 h-4 stroke-1.5 ml-1 transform transition-transform',
'w-4 h-4 stroke-1.5 ms-1 transform transition-transform',
open ? 'rotate-180' : '',
]"
/>
@@ -54,7 +54,7 @@
{{ __('All Courses') }}
</div>
<div
class="flex flex-col space-y-3 lg:space-y-0 lg:flex-row lg:items-center lg:space-x-4"
class="flex flex-col space-y-3 lg:space-y-0 lg:flex-row lg:items-center lg:gap-x-4"
>
<TabButtons :buttons="courseTabs" v-model="currentTab" class="w-fit" />

2
frontend/src/pages/Courses/NewCourseModal.vue
View File

@@ -64,7 +64,7 @@
</div>
</template>
<template #actions="{ close }">
<div class="text-right">
<div class="text-end">
<Button variant="solid" @click="saveCourse(close)">
{{ __('Save') }}
</Button>

4
frontend/src/pages/Courses/StudentCourseProgress.vue
View File

@@ -9,7 +9,7 @@
<template #body-content>
<div class="text-base text-ink-gray-9 max-h-[70vh] overflow-y-auto">
<div class="flex justify-between mb-5 px-2">
<div class="flex items-center space-x-2">
<div class="flex items-center gap-x-2">
<Avatar
:image="student?.member_image"
:label="student?.member_name"
@@ -50,7 +50,7 @@
class="flex justify-between text-sm py-2 my-1"
>
<div class="">
<span class="mr-3 text-xs">
<span class="me-3 text-xs">
{{ progress.chapter_idx }}.{{ progress.idx }}
</span>
<span>

18
frontend/src/pages/Home/AdminHome.vue
View File

@@ -17,19 +17,19 @@
<div class="text-ink-gray-7">
<div class="flex items-center mb-3">
<Calendar class="w-4 h-4 stroke-1.5" />
<span class="ml-2">
<span class="ms-2">
{{ dayjs(evaluation.date).format('DD MMMM YYYY') }}
</span>
</div>
<div class="flex items-center mb-3">
<Clock class="w-4 h-4 stroke-1.5" />
<span class="ml-2">
<span class="ms-2">
{{ formatTime(evaluation.start_time) }}
</span>
</div>
<div class="flex items-center">
<GraduationCap class="w-4 h-4 stroke-1.5" />
<span class="ml-2">
<span class="ms-2">
{{ evaluation.member_name }}
</span>
</div>
@@ -53,13 +53,13 @@
{{ cls.description }}
</div>
<div class="mt-auto space-y-3 text-ink-gray-7">
<div class="flex items-center space-x-2">
<div class="flex items-center gap-x-2">
<Calendar class="w-4 h-4 stroke-1.5" />
<span>
{{ dayjs(cls.date).format('DD MMMM YYYY') }}
</span>
</div>
<div class="flex items-center space-x-2">
<div class="flex items-center gap-x-2">
<Clock class="w-4 h-4 stroke-1.5" />
<span>
{{ formatTime(cls.time) }} -
@@ -68,7 +68,7 @@
</div>
<div
v-if="canAccessClass(cls)"
class="flex items-center space-x-2 text-ink-gray-9 mt-auto"
class="flex items-center gap-x-2 text-ink-gray-9 mt-auto"
>
<a
v-if="user.data?.is_moderator || user.data?.is_evaluator"
@@ -94,7 +94,7 @@
:text="__('This class has ended')"
placement="right"
>
<div class="flex items-center space-x-2 text-ink-amber-3 w-fit">
<div class="flex items-center gap-x-2 text-ink-amber-3 w-fit">
<Info class="w-4 h-4 stroke-1.5" />
<span>
{{ __('Ended') }}
@@ -117,7 +117,7 @@
name: 'Courses',
}"
>
<span class="flex items-center space-x-1 text-ink-gray-5 text-xs">
<span class="flex items-center gap-x-1 text-ink-gray-5 text-xs">
<span>
{{ __('See all') }}
</span>
@@ -145,7 +145,7 @@
name: 'Batches',
}"
>
<span class="flex items-center space-x-1 text-ink-gray-5 text-xs">
<span class="flex items-center gap-x-1 text-ink-gray-5 text-xs">
<span>
{{ __('See all') }}
</span>

2
frontend/src/pages/Home/Streak.vue
View File

@@ -29,7 +29,7 @@
<div
class="grid grid-cols-2 bg-surface-gray-1 px-2.5 py-2 rounded-md mt-8"
>
<div class="space-y-1 border-r border-outline-gray-2 mr-4">
<div class="space-y-1 border-e border-outline-gray-2 me-4">
<div class="text-ink-gray-6">
{{ __('Current Streak') }}
</div>

12
frontend/src/pages/Home/StudentHome.vue
View File

@@ -18,13 +18,13 @@
{{ cls.description }}
</div>
<div class="mt-auto space-y-4 text-ink-gray-7">
<div class="flex items-center space-x-2">
<div class="flex items-center gap-x-2">
<Calendar class="w-4 h-4 stroke-1.5" />
<span>
{{ dayjs(cls.date).format('DD MMMM YYYY') }}
</span>
</div>
<div class="flex items-center space-x-2">
<div class="flex items-center gap-x-2">
<Clock class="w-4 h-4 stroke-1.5" />
<span>
{{ formatTime(cls.time) }} -
@@ -33,7 +33,7 @@
</div>
<div
v-if="canAccessClass(cls)"
class="flex items-center space-x-2 text-ink-gray-9 mt-auto"
class="flex items-center gap-x-2 text-ink-gray-9 mt-auto"
>
<a
v-if="user.data?.is_moderator || user.data?.is_evaluator"
@@ -59,7 +59,7 @@
:text="__('This class has ended')"
placement="right"
>
<div class="flex items-center space-x-2 text-ink-amber-3 w-fit">
<div class="flex items-center gap-x-2 text-ink-amber-3 w-fit">
<Info class="w-4 h-4 stroke-1.5" />
<span>
{{ __('Ended') }}
@@ -86,7 +86,7 @@
name: 'Courses',
}"
>
<span class="flex items-center space-x-1 text-ink-gray-5 text-xs">
<span class="flex items-center gap-x-1 text-ink-gray-5 text-xs">
<span>
{{ __('See all') }}
</span>
@@ -118,7 +118,7 @@
name: 'Batches',
}"
>
<span class="flex items-center space-x-1 text-ink-gray-5 text-xs">
<span class="flex items-center gap-x-1 text-ink-gray-5 text-xs">
<span>
{{ __('See all') }}
</span>

4
frontend/src/pages/JobApplications.vue
View File

@@ -34,7 +34,7 @@
}"
>
<ListHeader
class="mb-2 grid items-center space-x-4 rounded bg-surface-gray-2 p-2"
class="mb-2 grid items-center gap-x-4 rounded bg-surface-gray-2 p-2"
>
<ListHeaderItem
:item="item"
@@ -60,7 +60,7 @@
<ListRowItem :item="item">
<div
v-if="column.key === 'full_name'"
class="flex items-center space-x-3"
class="flex items-center gap-x-3"
>
<Avatar
size="sm"

6
frontend/src/pages/JobDetail.vue
View File

@@ -18,7 +18,7 @@
/>
<div
v-if="user.data?.name && !readOnlyMode"
class="flex items-center space-x-2"
class="flex items-center gap-x-2"
>
<router-link
v-if="canManageJob && applicationCount.data > 0"
@@ -82,7 +82,7 @@
<div class="flex">
<img
:src="job.data.company_logo"
class="size-10 rounded-lg object-contain cursor-pointer mr-4"
class="size-10 rounded-lg object-contain cursor-pointer me-4"
:alt="job.data.company_name"
@click="redirectToWebsite(job.data.company_website)"
/>
@@ -97,7 +97,7 @@
</div>
</div>
<div class="space-x-2">
<div class="flex items-center gap-x-2">
<Badge size="lg">
<template #prefix>
<CalendarDays class="size-3 stroke-2 text-ink-gray-7" />

2
frontend/src/pages/JobForm.vue
View File

@@ -4,7 +4,7 @@
class="sticky top-0 z-10 flex items-center justify-between border-b bg-surface-white px-3 py-2.5 sm:px-5"
>
<Breadcrumbs :items="breadcrumbs" />
<div class="space-x-2">
<div class="flex items-center gap-x-2">
<Badge v-if="isDirty" theme="orange">
{{ __('Not Saved') }}
</Badge>

4
frontend/src/pages/Jobs.vue
View File

@@ -44,7 +44,7 @@
</div>
<div
class="flex flex-col md:flex-row md:items-center md:space-x-4 space-y-4 md:space-y-0"
class="flex flex-col md:flex-row md:items-center md:gap-x-4 space-y-4 md:space-y-0"
>
<TabButtons
v-if="tabs.length > 1"
@@ -53,7 +53,7 @@
class="hidden lg:block"
@change="updateJobs"
/>
<div class="flex items-center space-x-4">
<div class="flex items-center gap-x-4">
<FormControl
type="text"
:placeholder="__('Search')"

16
frontend/src/pages/Lesson.vue
View File

@@ -4,7 +4,7 @@
class="sticky top-0 z-10 flex items-center justify-between border-b bg-surface-white px-3 py-2.5 sm:px-5"
>
<Breadcrumbs class="h-7" :items="breadcrumbs" />
<div class="flex items-center space-x-2">
<div class="flex items-center gap-x-2">
<Tooltip v-if="canGoZen()" :text="__('Zen Mode')">
<Button @click="goFullScreen()">
<template #icon>
@@ -66,9 +66,9 @@
</div>
</header>
<div class="grid md:grid-cols-[70%,30%] h-[94vh]">
<div v-if="lesson.data.no_preview" class="border-r">
<div v-if="lesson.data.no_preview" class="border-e">
<div class="shadow rounded-md w-3/4 mt-10 mx-auto text-center p-4">
<div class="flex items-center justify-center mt-4 space-x-2">
<div class="flex items-center justify-center mt-4 gap-x-2">
<LockKeyholeIcon class="size-4 stroke-2 text-ink-gray-5" />
<div class="text-lg font-semibold text-ink-gray-7">
{{ __('This lesson is locked') }}
@@ -113,7 +113,7 @@
}"
>
<div
class="border-r pt-5 pb-10 h-full"
class="border-e pt-5 pb-10 h-full"
:class="{
'w-full md:w-3/5 mx-auto border-none !pt-10': zenModeEnabled,
}"
@@ -129,7 +129,7 @@
<div
v-if="zenModeEnabled"
class="relative flex items-center space-x-2 text-sm mt-1 text-ink-gray-7 group w-fit mt-2"
class="relative flex items-center gap-x-2 text-sm mt-1 text-ink-gray-7 group w-fit mt-2"
>
<span>
{{ lesson.data.chapter_title }} -
@@ -137,7 +137,7 @@
</span>
<Info class="size-3" />
<div
class="hidden group-hover:block rounded bg-gray-900 px-2 py-1 text-xs text-white shadow-xl absolute left-0 top-full mt-2"
class="hidden group-hover:block rounded bg-gray-900 px-2 py-1 text-xs text-white shadow-xl absolute start-0 top-full mt-2"
>
{{ Math.ceil(lesson.data.membership.progress) }}%
{{ __('completed') }}
@@ -147,7 +147,7 @@
<div
v-if="zenModeEnabled"
class="flex items-center space-x-2 mt-2 md:mt-0"
class="flex items-center gap-x-2 mt-2 md:mt-0"
>
<Button @click="showDiscussionsInZenMode()">
<template #icon>
@@ -204,7 +204,7 @@
<div v-if="!zenModeEnabled" class="flex items-center mt-4 md:mt-2">
<span
class="h-6 mr-1"
class="h-6 me-1"
:class="{
'avatar-group overlap': lesson.data.instructors?.length > 1,
}"

18
frontend/src/pages/Notifications.vue
View File

@@ -3,7 +3,7 @@
class="sticky top-0 z-10 flex flex-col md:flex-row md:items-center justify-between border-b bg-surface-white px-3 py-2.5 sm:px-5"
>
<Breadcrumbs :items="breadcrumbs" />
<div class="flex items-center space-x-2">
<div class="flex items-center gap-x-2">
<Button
@click="markAllAsRead.submit"
:loading="markAllAsRead.loading"
@@ -23,7 +23,7 @@
v-if="notifications?.length"
v-for="log in notifications"
:key="log.name"
class="flex space-x-2 px-2 py-4"
class="flex gap-x-2 px-2 py-4"
:class="{
'cursor-pointer': log.link,
'items-center': !showDetails(log) && !isMentionOrComment(log),
@@ -40,7 +40,7 @@
<div class="flex items-center">
<div class="text-ink-gray-9" v-html="log.subject"></div>
</div>
<div class="flex items-center space-x-2">
<div class="flex items-center gap-x-2">
<div class="text-sm text-ink-gray-5">
{{ dayjs(log.creation).fromNow() }}
</div>
@@ -62,7 +62,7 @@
></div>
<div
v-else-if="showDetails(log)"
class="flex items-stretch border border-outline-gray-2 space-x-2 rounded-md"
class="flex items-stretch border border-outline-gray-2 gap-x-2 rounded-md"
>
<iframe
v-if="
@@ -70,7 +70,7 @@
log.document_details.video_link
"
:src="`https://www.youtube.com/embed/${log.document_details.video_link}`"
class="rounded-l-md w-72"
class="rounded-s-md w-72"
/>
<video
v-else-if="
@@ -78,7 +78,7 @@
log.document_details.video_link
"
:src="log.document_details.video_link"
class="rounded-l-md w-72"
class="rounded-s-md w-72"
/>
<div class="p-3">
<div
@@ -98,7 +98,7 @@
</div>
<div
v-if="log.document_details.start_date"
class="flex items-center space-x-2 text-sm mt-5"
class="flex items-center gap-x-2 text-sm mt-5"
>
<Calendar class="size-3 stroke-1.5" />
<span>
@@ -109,7 +109,7 @@
</div>
<div
v-if="log.document_details.start_time"
class="flex items-center space-x-2 text-sm mt-2"
class="flex items-center gap-x-2 text-sm mt-2"
>
<Clock class="size-3 stroke-1.5" />
<span>
@@ -123,7 +123,7 @@
>
<div
v-for="instructor in log.document_details.instructors"
class="flex items-center space-x-2"
class="flex items-center gap-x-2"
>
<Avatar
:size="'sm'"

4
frontend/src/pages/PersonaForm.vue
View File

@@ -1,7 +1,7 @@
<template>
<div class="flex h-screen overflow-hidden sm:bg-gray-50">
<div class="relative h-full z-10 mx-auto sm:w-max pt-40">
<div class="mx-auto flex items-center justify-center space-x-2">
<div class="mx-auto flex items-center justify-center gap-x-2">
<LMSLogo class="size-7" />
<span
class="select-none text-xl font-semibold tracking-tight text-gray-900"
@@ -45,7 +45,7 @@
</div>
</div>
<div
class="text-center absolute bottom-0 right-0 left-0 mx-auto cursor-pointer text-sm pb-4"
class="text-center absolute bottom-0 end-0 start-0 mx-auto cursor-pointer text-sm pb-4"
@click="skipPersonaForm()"
>
{{ __('Skip') }}

10
frontend/src/pages/Profile.vue
View File

@@ -26,7 +26,7 @@
class="h-[130px] w-full"
></div>
<div
class="absolute bottom-[30%] md:bottom-0 left-[50%] mb-4 flex -translate-x-1/2 space-x-2 opacity-0 transition-opacity focus-within:opacity-100 group-hover:opacity-100"
class="absolute bottom-[30%] md:bottom-0 start-[50%] mb-4 flex -translate-x-1/2 gap-x-2 opacity-0 transition-opacity focus-within:opacity-100 group-hover:opacity-100"
v-if="isSessionUser()"
>
<EditCoverImage
@@ -72,7 +72,7 @@
placement="right"
>
<div
class="absolute bottom-3 right-1 p-0.5 bg-surface-white rounded-full"
class="absolute bottom-3 end-1 p-0.5 bg-surface-white rounded-full"
>
<div
class="rounded-full w-fit"
@@ -88,14 +88,14 @@
</Tooltip>
</div>
</div>
<div class="ml-6 mt-5">
<div class="ms-6 mt-5">
<h2 class="text-3xl font-semibold text-ink-gray-9">
{{ profile.data.full_name }}
</h2>
<div class="text-base text-ink-gray-7 mt-1">
{{ profile.data.headline }}
</div>
<div class="flex items-center space-x-4 mt-2">
<div class="flex items-center gap-x-4 mt-2">
<Twitter
v-if="profile.data.twitter"
class="size-4 text-ink-gray-5 cursor-pointer"
@@ -115,7 +115,7 @@
</div>
<Button
v-if="isSessionUser() && !readOnlyMode"
class="mt-3 sm:mt-0 md:ml-auto"
class="mt-3 sm:mt-0 md:ms-auto"
@click="editProfile()"
>
<template #prefix>

4
frontend/src/pages/ProfileAbout.vue
View File

@@ -45,7 +45,7 @@
/>
<div
v-if="badge.count > 1"
class="flex items-end bg-surface-gray-2 p-2 text-xs font-semibold rounded-full absolute right-0 bottom-0"
class="flex items-end bg-surface-gray-2 p-2 text-xs font-semibold rounded-full absolute end-0 bottom-0"
>
<span>
<X class="w-3 h-3" />
@@ -83,7 +83,7 @@
<span class="text-xs text-ink-gray-7 font-medium mb-1">
{{ __('Share on') }}:
</span>
<div class="flex items-center space-x-2">
<div class="flex items-center gap-x-2">
<Button
variant="outline"
size="sm"

4
frontend/src/pages/ProfileEvaluator.vue
View File

@@ -6,7 +6,7 @@
<div
v-if="readOnlyMode"
class="flex items-center space-x-2 text-sm text-ink-gray-7 bg-surface-gray-1 px-3 py-2 rounded-md w-full text-center"
class="flex items-center gap-x-2 text-sm text-ink-gray-7 bg-surface-gray-1 px-3 py-2 rounded-md w-full text-center"
>
<CircleAlert class="size-4 stroke-1.5" />
<span>
@@ -139,7 +139,7 @@
v-if="evaluator.data?.calendar && evaluator.data?.is_authorized"
class="flex items-center bg-surface-green-2 text-green-900 text-sm p-1 rounded-md mb-4 w-fit"
>
<Check class="h-4 w-4 stroke-1.5 mr-2" />
<Check class="h-4 w-4 stroke-1.5 me-2" />
{{ __('Your calendar is set.') }}
</div>
<Button @click="() => authorizeCalendar.submit()">

2
frontend/src/pages/ProfileRoles.vue
View File

@@ -5,7 +5,7 @@
</h2>
<div
v-if="readOnlyMode"
class="flex items-center space-x-2 text-sm text-ink-gray-7 bg-surface-gray-1 px-3 py-2 rounded-md w-full text-center"
class="flex items-center gap-x-2 text-sm text-ink-gray-7 bg-surface-gray-1 px-3 py-2 rounded-md w-full text-center"
>
<CircleAlert class="size-4 stroke-1.5" />
<span>

4
frontend/src/pages/ProgrammingExercises/ProgrammingExerciseForm.vue
View File

@@ -1,7 +1,7 @@
<template>
<Dialog v-model="show" :options="{ size: '4xl' }">
<template #body-title>
<div class="flex items-center space-x-2">
<div class="flex items-center gap-x-2">
<div class="text-xl font-semibold text-ink-gray-9">
{{
props.exerciseID === 'new'
@@ -58,7 +58,7 @@
</div>
</template>
<template #actions="{ close }">
<div class="flex justify-end space-x-2 group">
<div class="flex justify-end gap-x-2 group">
<Button
v-if="exerciseID != 'new'"
@click="deleteExercise(close)"

6
frontend/src/pages/ProgrammingExercises/ProgrammingExerciseSubmission.vue
View File

@@ -20,7 +20,7 @@
</Button>
</div>
<div class="grid grid-cols-2 h-[calc(100vh_-_3rem)]">
<div class="border-r py-5 px-8 h-full">
<div class="border-e py-5 px-8 h-full">
<div class="font-semibold mb-2 text-ink-gray-9">
{{ __('Problem Statement') }}
</div>
@@ -34,7 +34,7 @@
<div class="font-semibold text-ink-gray-9">
{{ exercise.doc?.language }}
</div>
<div class="space-x-2">
<div class="flex items-center gap-x-2">
<Badge
v-if="submission.doc?.status"
:theme="submission.doc.status == 'Passed' ? 'green' : 'red'"
@@ -96,7 +96,7 @@
{{ __('Test {0}').format(index + 1) }} -
</span>
<span
class="font-semibold ml-2 mr-1"
class="font-semibold ms-2 me-1"
:class="
testCase.status === 'Passed'
? 'text-ink-green-3'

4
frontend/src/pages/ProgrammingExercises/ProgrammingExerciseSubmissions.vue
View File

@@ -5,7 +5,7 @@
<Breadcrumbs :items="breadcrumbs" />
</header>
<div class="p-6">
<div class="flex items-center justify-between space-x-32 mb-5">
<div class="flex items-center justify-between gap-x-32 mb-5">
<div class="text-lg font-semibold text-ink-gray-9">
{{
submissions.data?.length
@@ -54,7 +54,7 @@
}"
>
<ListHeader
class="mb-2 grid items-center space-x-4 rounded bg-surface-gray-2 p-2"
class="mb-2 grid items-center gap-x-4 rounded bg-surface-gray-2 p-2"
>
<ListHeaderItem
:item="item"

2
frontend/src/pages/ProgrammingExercises/ProgrammingExercises.vue
View File

@@ -3,7 +3,7 @@
class="sticky flex items-center justify-between top-0 z-10 border-b bg-surface-white px-3 py-2.5 sm:px-5"
>
<Breadcrumbs :items="breadcrumbs" />
<div class="space-x-2">
<div class="flex gap-2">
<router-link
v-if="exercises.data?.length"
:to="{

2
frontend/src/pages/Programs/ProgramDetail.vue
View File

@@ -5,7 +5,7 @@
<Breadcrumbs :items="breadcrumbs" />
</header>
<div v-if="program.data" class="pt-5 px-5 pb-10 mx-auto">
<div class="flex items-center space-x-2 mb-5">
<div class="flex items-center gap-x-2 mb-5">
<div class="text-lg font-semibold text-ink-gray-9">
{{ program.data.name }}
</div>

12
frontend/src/pages/Programs/ProgramEnrollment.vue
View File

@@ -57,24 +57,24 @@
</div> -->
<div
class="flex items-center space-x-5 text-sm text-ink-gray-5 mb-8"
class="flex items-center gap-x-5 text-sm text-ink-gray-5 mb-8"
>
<Tooltip :text="__('Lessons')">
<span class="flex items-center space-x-1">
<span class="flex items-center gap-x-1">
<BookOpen class="size-3 stroke-1.5" />
<span> {{ course.lessons }} {{ __('lessons') }} </span>
</span>
</Tooltip>
<Tooltip :text="__('Enrolled Students')">
<span class="flex items-center space-x-1">
<span class="flex items-center gap-x-1">
<User class="size-3 stroke-1.5" />
<span> {{ course.enrollments }} {{ __('students') }} </span>
</span>
</Tooltip>
<!-- <Tooltip v-if="course.rating" :text="__('Average Rating')">
<span class="flex items-center space-x-1">
<span class="flex items-center gap-x-1">
<Star class="size-3 stroke-1.5" />
<span>
{{ course.rating }} {{ __("rating") }}
@@ -83,7 +83,7 @@
</Tooltip> -->
</div>
<div class="flex items-center space-x-1 mt-auto">
<div class="flex items-center gap-x-1 mt-auto">
<UserAvatar :user="course.instructors[0]" />
<span class="text-ink-gray-9">
{{ course.instructors[0].full_name }}
@@ -95,7 +95,7 @@
</div>
</template>
<template #actions="{ close }">
<div class="flex justify-end space-x-2 group">
<div class="flex justify-end gap-x-2 group">
<Button variant="solid" @click="enrollInProgram(close)">
{{ __('Confirm Enrollment') }}
</Button>

10
frontend/src/pages/Programs/ProgramForm.vue
View File

@@ -6,7 +6,7 @@
}"
>
<template #body-title>
<div class="flex items-center justify-between space-x-2 text-base w-full">
<div class="flex items-center justify-between gap-x-2 text-base w-full">
<div class="text-xl font-semibold text-ink-gray-9">
{{
programName === 'new' ? __('Create Program') : __('Edit Program')
@@ -69,7 +69,7 @@
:rowKey="programName === 'new' ? 'course' : 'name'"
>
<ListHeader
class="mb-2 grid items-center space-x-4 rounded bg-surface-gray-2 p-2"
class="mb-2 grid items-center gap-x-4 rounded bg-surface-gray-2 p-2"
>
<ListHeaderItem :item="item" v-for="item in courseColumns" />
</ListHeader>
@@ -110,7 +110,7 @@
{{ __('Members') }}
</div>
<div class="space-x-2">
<div class="flex gap-x-2">
<Button
v-if="programMembers.data.length > 0"
@click="
@@ -143,7 +143,7 @@
:rowKey="programName === 'new' ? 'member' : 'name'"
>
<ListHeader
class="mb-2 grid items-center space-x-4 rounded bg-surface-gray-2 p-2"
class="mb-2 grid items-center gap-x-4 rounded bg-surface-gray-2 p-2"
>
<ListHeaderItem :item="item" v-for="item in memberColumns" />
</ListHeader>
@@ -217,7 +217,7 @@
/>
</template>
<template #actions="{ close }">
<div class="flex justify-end space-x-2">
<div class="flex justify-end gap-x-2">
<Button
v-if="programName != 'new'"
@click="deleteProgram(close)"

2
frontend/src/pages/Programs/ProgramProgressSummary.vue
View File

@@ -8,7 +8,7 @@
>
<template #body-content>
<div class="text-base">
<div class="flex items-center justify-between space-x-4 mb-4">
<div class="flex items-center justify-between gap-x-4 mb-4">
<NumberChart
class="border rounded-md w-full"
:config="{

8
frontend/src/pages/Programs/Programs.vue
View File

@@ -28,15 +28,15 @@
<div class="text-lg font-semibold text-ink-gray-9">
{{ program.name }}
</div>
<div class="flex items-center space-x-1 text-ink-gray-7">
<BookOpen class="h-4 w-4 stroke-1.5 mr-1" />
<div class="flex items-center gap-x-2 text-ink-gray-7">
<BookOpen class="h-4 w-4 stroke-1.5" />
<span>
{{ program.course_count }}
{{ program.course_count == 1 ? __('Course') : __('Courses') }}
</span>
</div>
<div class="flex items-center space-x-1 text-ink-gray-7">
<User class="h-4 w-4 stroke-1.5 mr-1" />
<div class="flex items-center gap-x-2 text-ink-gray-7">
<User class="h-4 w-4 stroke-1.5" />
<span>
{{ program.member_count || 0 }}
{{ program.member_count == 1 ? __('member') : __('members') }}

6
frontend/src/pages/Programs/StudentPrograms.vue
View File

@@ -21,15 +21,15 @@
{{ program.name }}
</div>
<div class="flex items-center space-x-5 text-sm text-ink-gray-7">
<div class="flex items-center space-x-1">
<div class="flex items-center gap-x-5 text-sm text-ink-gray-7">
<div class="flex items-center gap-x-1">
<BookOpen class="size-3 stroke-1.5" />
<span>
{{ program.course_count }}
{{ program.course_count == 1 ? __('course') : __('courses') }}
</span>
</div>
<div class="flex items-center space-x-1">
<div class="flex items-center gap-x-1">
<User class="size-4 stroke-1.5" />
<span>
{{ program.member_count || 0 }}

4
frontend/src/pages/QuizForm.vue
View File

@@ -3,7 +3,7 @@
class="sticky top-0 z-10 flex items-center justify-between border-b bg-surface-white px-3 py-2.5 sm:px-5"
>
<Breadcrumbs :items="breadcrumbs" />
<div v-if="!readOnlyMode" class="flex items-center space-x-2">
<div v-if="!readOnlyMode" class="flex items-center gap-x-2">
<Badge v-if="quizDetails.isDirty" theme="orange">
{{ __('Not Saved') }}
</Badge>
@@ -155,7 +155,7 @@
}"
>
<ListHeader
class="mb-2 grid items-center space-x-4 rounded bg-surface-gray-2 p-2"
class="mb-2 grid items-center gap-x-4 rounded bg-surface-gray-2 p-2"
>
<ListHeaderItem :item="item" v-for="item in questionColumns" />
</ListHeader>

2
frontend/src/pages/QuizSubmission.vue
View File

@@ -3,7 +3,7 @@
class="sticky top-0 z-10 flex items-center justify-between border-b bg-surface-white px-3 py-2.5 sm:px-5"
>
<Breadcrumbs v-if="submissionDetails.doc" :items="breadcrumbs" />
<div class="space-x-2">
<div class="flex gap-2 items-center">
<Badge
v-if="submissionDetails.isDirty"
:label="__('Not Saved')"

2
frontend/src/pages/QuizSubmissionList.vue
View File

@@ -15,7 +15,7 @@
:options="{ showTooltip: false, selectable: false }"
>
<ListHeader
class="mb-2 grid items-center space-x-4 rounded bg-surface-gray-2 p-2"
class="mb-2 grid items-center gap-x-4 rounded bg-surface-gray-2 p-2"
>
<ListHeaderItem :item="item" v-for="item in quizColumns">
</ListHeaderItem>

4
frontend/src/pages/Quizzes.vue
View File

@@ -86,11 +86,11 @@
</ListSelectBanner>
</ListView>
<EmptyState v-else type="Quizzes" />
<div class="flex items-center justify-end space-x-3 mt-3">
<div class="flex items-center justify-end gap-x-3 mt-3">
<Button v-if="quizzes.hasNextPage" @click="quizzes.next()">
{{ __('Load More') }}
</Button>
<div v-if="quizzes.hasNextPage" class="h-8 border-l"></div>
<div v-if="quizzes.hasNextPage" class="h-8 border-s"></div>
<div class="text-ink-gray-5">
{{ quizzes.data?.length }} {{ __('of') }} {{ totalQuizzes.data }}
</div>

6
frontend/src/pages/Search/Search.vue
View File

@@ -56,7 +56,7 @@
class="rounded-md cursor-pointer hover:bg-surface-gray-2 px-2"
>
<div
class="flex space-x-2 py-3"
class="flex gap-x-2 py-3"
:class="{
'border-b': index !== searchResults.length - 1,
}"
@@ -74,7 +74,7 @@
class="font-medium text-ink-gray-9"
v-html="result.title"
></div>
<div class="text-sm text-ink-gray-5 ml-2">
<div class="text-sm text-ink-gray-5 ms-2">
{{ getDocTypeTitle(result.doctype) }}
</div>
<div
@@ -84,7 +84,7 @@
result.creation ||
result.modified
"
class="ml-auto text-sm text-ink-gray-5"
class="ms-auto text-sm text-ink-gray-5"
>
{{
dayjs(