Merge pull request #951 from pateljannat/issues-28

fix: spacing and widths
This commit is contained in:
Jannat Patel
2024-08-05 11:32:12 +05:30
committed by GitHub
4 changed files with 55 additions and 54 deletions

View File

@@ -3,7 +3,7 @@
class="flex flex-col shadow hover:bg-gray-100 rounded-md p-4 h-full" class="flex flex-col shadow hover:bg-gray-100 rounded-md p-4 h-full"
style="min-height: 150px" style="min-height: 150px"
> >
<div class="text-xl font-semibold mb-2"> <div class="text-lg leading-5 font-semibold mb-2">
{{ batch.title }} {{ batch.title }}
</div> </div>
<Badge <Badge
@@ -22,18 +22,17 @@
> >
{{ __('Sold Out') }} {{ __('Sold Out') }}
</Badge> </Badge>
<div class="short-introduction"> <div class="short-introduction text-sm text-gray-700">
{{ batch.description }} {{ batch.description }}
</div> </div>
<div v-if="batch.amount" class="font-semibold mb-4">
{{ batch.price }}
</div>
<div class="flex flex-col space-y-2 mt-auto"> <div class="flex flex-col space-y-2 mt-auto">
<div v-if="batch.amount" class="font-semibold text-lg">
{{ batch.price }}
</div>
<DateRange <DateRange
:startDate="batch.start_date" :startDate="batch.start_date"
:endDate="batch.end_date" :endDate="batch.end_date"
class="text-sm text-gray-700 mb-3" class="text-sm text-gray-700"
/> />
<div class="flex items-center text-sm text-gray-700"> <div class="flex items-center text-sm text-gray-700">
<Clock class="h-4 w-4 stroke-1.5 mr-2 text-gray-700" /> <Clock class="h-4 w-4 stroke-1.5 mr-2 text-gray-700" />
@@ -50,18 +49,21 @@
{{ batch.timezone }} {{ batch.timezone }}
</span> </span>
</div> </div>
<div v-if="batch.instructors?.length" class="flex avatar-group overlap"> </div>
<div <div
class="h-6 mr-1" v-if="batch.instructors?.length"
:class="{ 'avatar-group overlap': batch.instructors.length > 1 }" class="flex avatar-group overlap mt-4"
> >
<UserAvatar <div
v-for="instructor in batch.instructors" class="h-6 mr-1"
:user="instructor" :class="{ 'avatar-group overlap': batch.instructors.length > 1 }"
/> >
</div> <UserAvatar
<CourseInstructors :instructors="batch.instructors" /> v-for="instructor in batch.instructors"
:user="instructor"
/>
</div> </div>
<CourseInstructors :instructors="batch.instructors" />
</div> </div>
</div> </div>
</template> </template>
@@ -88,7 +90,7 @@ const props = defineProps({
text-overflow: ellipsis; text-overflow: ellipsis;
width: 100%; width: 100%;
overflow: hidden; overflow: hidden;
margin: 0.25rem 0 1.25rem; margin: 0.25rem 0 1rem;
line-height: 1.5; line-height: 1.5;
} }

View File

@@ -72,7 +72,7 @@
{{ course.title }} {{ course.title }}
</div> </div>
<div class="short-introduction"> <div class="short-introduction text-gray-700 text-sm">
{{ course.short_introduction }} {{ course.short_introduction }}
</div> </div>

View File

@@ -50,9 +50,9 @@
</Button> </Button>
</div> </div>
</header> </header>
<div v-if="job.data" class="w-3/4 mx-auto"> <div v-if="job.data" class="max-w-3xl mx-auto">
<div class="p-4"> <div class="p-4">
<div class="flex mb-4"> <div class="flex mb-10">
<img <img
:src="job.data.company_logo" :src="job.data.company_logo"
class="w-16 h-16 rounded-lg object-contain mr-4" class="w-16 h-16 rounded-lg object-contain mr-4"
@@ -62,40 +62,36 @@
<div class="text-2xl font-semibold mb-4"> <div class="text-2xl font-semibold mb-4">
{{ job.data.job_title }} {{ job.data.job_title }}
</div> </div>
<div class="grid grid-cols-3 gap-8"> <div
<div class="grid grid-cols-1 gap-2"> class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-x-10 gap-y-2 md:gap-y-4"
<div class="flex items-center space-x-2"> >
<Building2 class="h-4 w-4 stroke-1.5" /> <div class="flex items-center space-x-2">
<span>{{ job.data.company_name }}</span> <Building2 class="h-4 w-4 stroke-1.5" />
</div> <span>{{ job.data.company_name }}</span>
<div class="flex items-center space-x-2">
<MapPin class="h-4 w-4 stroke-1.5" />
<span>{{ job.data.location }}</span>
</div>
</div> </div>
<div class="grid grid-cols-1 gap-2"> <div class="flex items-center space-x-2">
<div class="flex items-center space-x-2"> <MapPin class="h-4 w-4 stroke-1.5" />
<ClipboardType class="h-4 w-4 stroke-1.5" /> <span>{{ job.data.location }}</span>
<span>{{ job.data.type }}</span>
</div>
<div class="flex items-center space-x-2">
<CalendarDays class="h-4 w-4 stroke-1.5" />
<span>{{
dayjs(job.data.creation).format('DD MMM YYYY')
}}</span>
</div>
</div> </div>
<div class="grid grid-cols-1 h-fit"> <div class="flex items-center space-x-2">
<div <ClipboardType class="h-4 w-4 stroke-1.5" />
v-if="applicationCount.data" <span>{{ job.data.type }}</span>
class="flex items-center space-x-2" </div>
<div class="flex items-center space-x-2">
<CalendarDays class="h-4 w-4 stroke-1.5" />
<span>
{{ dayjs(job.data.creation).format('DD MMM YYYY') }}
</span>
</div>
<div
v-if="applicationCount.data"
class="flex items-center space-x-2"
>
<SquareUserRound class="h-4 w-4 stroke-1.5" />
<span
>{{ applicationCount.data }}
{{ __('applications received') }}</span
> >
<SquareUserRound class="h-4 w-4 stroke-1.5" />
<span
>{{ applicationCount.data }}
{{ __('applications received') }}</span
>
</div>
</div> </div>
</div> </div>
</div> </div>

View File

@@ -176,7 +176,10 @@ update_website_context = [
] ]
jinja = { jinja = {
"methods": ["lms.lms.utils.get_signup_optin_checks"], "methods": [
"lms.lms.utils.get_signup_optin_checks",
"lms.lms.utils.get_tags",
],
"filters": [], "filters": [],
} }
## Specify the additional tabs to be included in the user profile page. ## Specify the additional tabs to be included in the user profile page.