fix: mobile and lesson issues

This commit is contained in:
Jannat Patel
2024-05-10 18:41:39 +05:30
parent 528ab8f796
commit 10ed37ec67
13 changed files with 94 additions and 27 deletions

View File

@@ -11,17 +11,23 @@
<div class="my-3">
{{ batch.data.description }}
</div>
<div class="flex items-center justify-between w-1/2">
<div
class="flex flex-col gap-2 lg:gap-0 lg:flex-row lg:items-center justify-between lg:w-1/2"
>
<div class="flex items-center">
<BookOpen class="h-4 w-4 text-gray-700 mr-2" />
<span> {{ batch.data?.courses?.length }} {{ __('Courses') }} </span>
</div>
<span v-if="batch.data.courses">&middot;</span>
<span class="hidden lg:block" v-if="batch.data.courses"
>&middot;</span
>
<DateRange
:startDate="batch.data.start_date"
:endDate="batch.data.end_date"
/>
<span v-if="batch.data.start_date">&middot;</span>
<span class="hidden lg:block" v-if="batch.data.start_date"
>&middot;</span
>
<div class="flex items-center">
<Clock class="h-4 w-4 text-gray-700 mr-2" />
<span>
@@ -31,14 +37,14 @@
</div>
</div>
</div>
<div class="grid grid-cols-[60%,20%] gap-20 mt-10">
<div class="">
<div class="grid lg:grid-cols-[60%,20%] gap-4 lg:gap-20 mt-10">
<div class="order-2 lg:order-none">
<div
class="ProseMirror prose prose-table:table-fixed prose-td:p-2 prose-th:p-2 prose-td:border prose-th:border prose-td:border-gray-300 prose-th:border-gray-300 prose-td:relative prose-th:relative prose-th:bg-gray-100 prose-sm max-w-none !whitespace-normal mt-6"
v-html="batch.data.batch_details"
></div>
</div>
<div>
<div class="order-1 lg:order-none">
<BatchOverlay :batch="batch" />
</div>
</div>
@@ -48,7 +54,7 @@
{{ __('Courses') }}
</div>
</div>
<div class="grid grid-cols-1 sm:grid-cols-2 md:grid-cols-3 gap-8 mt-5">
<div class="grid grid-cols-1 lg:grid-cols-3 gap-8 mt-5">
<div
v-if="batch.data.courses"
v-for="course in courses.data"