Mirrors/tabler
1
0
Fork 0
mirror of https://github.com/tabler/tabler.git synced 2026-08-09 12:52:24 +04:00
Code Issues Projects Releases Wiki Activity

fix #1348: Make job listing responsive for smaller devices (#1353)

Browse Source 
Co-authored-by: Paweł Kuna <1282324+codecalm@users.noreply.github.com>
This commit is contained in:
Robert-Jan de Dreu
2022-11-12 22:05:10 +01:00
committed by GitHub
parent 5da22ec4e4
commit 8a2437dabb
1 changed files with 11 additions and 6 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/pages/job-listing.html
+11 -6
View File
@@ -9,7 +9,7 @@ menu: extra.job-listing
{% assign salaries = '$20K - $50K,$50K - $100K,> $100K,Drawing / Painting' | split: ',' %}
<div class="row g-4">
<div class="col-3">
<div class="col-md-3">
<form action="./" method="get" autocomplete="off" novalidate class="sticky-top">
<div class="form-label">Job Types</div>
@@ -66,7 +66,7 @@ menu: extra.job-listing
</form>
</div>
<div class="col-9">
<div class="col-md-9">
<div class="row row-cards">
<div class="space-y">
{% for job in site.data.jobs %}
@@ -84,14 +84,19 @@ menu: extra.job-listing
{% if job.salary %}<div class="col-auto fs-3 text-green">{{ job.salary }}</div>{% endif %}
</div>
<div class="row">
<div class="col">
<div class="mt-3 list-inline list-inline-dots mb-0 text-muted">
<div class="col-md">
<div class="mt-3 list-inline list-inline-dots mb-0 text-muted d-sm-block d-none">
<div class="list-inline-item">{% include ui/icon.html icon="building-community" class="icon-inline" %} {{ job.company }}</div>
<div class="list-inline-item">{% include ui/icon.html icon="license" class="icon-inline" %} {{ job.type }}</div>
<div class="list-inline-item">{% include ui/icon.html icon="map-pin" class="icon-inline" %} {{ job.location }}</div>
</div>
<div class="mt-3 list mb-0 text-muted d-block d-sm-none">
<div class="list-item">{% include ui/icon.html icon="building-community" class="icon-inline" %} {{ job.company }}</div>
<div class="list-item">{% include ui/icon.html icon="license" class="icon-inline" %} {{ job.type }}</div>
<div class="list-item">{% include ui/icon.html icon="map-pin" class="icon-inline" %} {{ job.location }}</div>
</div>
</div>
<div class="col-auto">
<div class="col-md-auto">
<div class="mt-3 badges">
{% for tag in job.tags %}
<a href="#" class="badge badge-outline text-muted border fw-normal badge-pill">{{ tag }}</a>
@@ -107,4 +112,4 @@ menu: extra.job-listing
</div>
</div>
</div>
</div>
</div>