Skip to content

Commit

Permalink
style: refactor HTML structure
Browse files Browse the repository at this point in the history
  • Loading branch information
@ridwaanhall
ridwaanhall committed Jan 30, 2025
1 parent c780b50 commit a7473a7
Show file tree
Hide file tree
Showing 5 changed files with 148 additions and 155 deletions.
46 changes: 21 additions & 25 deletions absen/templates/absen/about.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -23,34 +23,30 @@ <h2 class="subtitle has-text-centered">Gak Perlu Lagi Panik Karena Lupa Presensi
</ul>
</nav>

<section class="section">
<div class="container">
<div class="card">
<div class="card-content">
<div class="content">
{% for section in about_sections %}
{% if section.title %}
<p><strong>{{ section.title|safe }}</strong></p>
{% endif %}
{% if section.content %}
<p>{{ section.content|safe }}</p>
{% endif %}
{% if section.list %}
<ul>
{% for item in section.list %}
<li>{{ item|safe }}</li>
{% endfor %}
</ul>
{% endif %}
{% if section.additional_content %}
<p>{{ section.additional_content|safe }}</p>
{% endif %}
<div class="card">
<div class="card-content">
<div class="content">
{% for section in about_sections %}
{% if section.title %}
<p><strong>{{ section.title|safe }}</strong></p>
{% endif %}
{% if section.content %}
<p>{{ section.content|safe }}</p>
{% endif %}
{% if section.list %}
<ul>
{% for item in section.list %}
<li>{{ item|safe }}</li>
{% endfor %}
</div>
</div>
</ul>
{% endif %}
{% if section.additional_content %}
<p>{{ section.additional_content|safe }}</p>
{% endif %}
{% endfor %}
</div>
</div>
</section>
</div>
</section>
{% endblock %}

Expand Down
14 changes: 7 additions & 7 deletions absen/templates/absen/absen.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -7,15 +7,15 @@
{% block content %}

<section class="section">
<nav class="breadcrumb container" aria-label="breadcrumbs">
<ul>
<li class="is-active">
<a href="{% url 'lumina-app' %}" aria-current="page">Lumina</a>
</li>
</ul>
</nav>
<div class="columns is-centered">
<div class="column is-6">
<nav class="breadcrumb" aria-label="breadcrumbs">
<ul>
<li class="is-active">
<a href="{% url 'lumina-app' %}" aria-current="page">Lumina</a>
</li>
</ul>
</nav>
<div class="card">
<div class="card-content">
<div class="content">
Expand Down
138 changes: 68 additions & 70 deletions absen/templates/absen/terms.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -23,81 +23,79 @@ <h2 class="subtitle has-text-centered">Aturan Main yang Perlu Kamu Tahu!</h2>
</ul>
</nav>

<section class="section">
<div class="container">
<div class="card">
<div class="card-content">
<div class="content">
<strong>Yo, Warga Lumina!</strong> 👋
<p>
Sebelum kamu gaspol pakai Lumina, ada aturan main yang perlu kamu pahami. Ini bukan basa-basi, tapi <em>rules</em> yang bikin kita semua nyaman dan makin semangat belajar. Kita sebut aja ini "Ketentuan Lumina". Dengan lanjut menggunakan Lumina, berarti kamu sudah sepakat sama aturan ini. Kalau ada yang nggak sreg, mending jangan pakai Lumina dulu, ya.
</p>

<strong>Lumina = Kamu + Aplikasi Keren Ini</strong>
<p>
Ketentuan ini adalah perjanjian sakral antara kamu (para "Pengguna" setia) dan Lumina (si "Aplikasi" andalan). Kita atur di sini semua tentang bagaimana kamu bisa menggunakan Lumina dengan bijak, jadi simak baik-baik ya!
</p>

<strong>Misi Mulia Lumina: Bukan untuk Bolos! 🚀</strong>
<p>
Lumina hadir untuk jadi pahlawan bagi kamu yang <em>sometimes</em> lupa presensi karena buru-buru atau memang lagi <em>blank</em>. Tujuan utama Lumina itu jelas: bantu kamu mengatasi masalah lupa presensi dengan <em>sat-set</em>.
</p>

<strong>Ingat!</strong> Lumina <strong>bukan</strong> alat untuk membolos kuliah atau menghindari kewajiban presensi. Lumina itu <em>partner</em>, bukan <em>partner in crime</em>.

<strong>Aturan Main yang Wajib Kamu Patuhi:</strong>
<ul>
<li><strong>Boleh:</strong> Lumina boleh kamu pakai kalau kamu memang lupa presensi karena alasan yang wajar. Kita semua manusia, kok.</li>
<li><strong>Gak Boleh! (Alias, Dilarang Keras):</strong>
<ul>
<li><strong>Bolos Kuliah:</strong> Lumina bukan alasan untuk nggak masuk kelas.</li>
<li><strong>Melanggar Aturan Kampus:</strong> Jangan sampai Lumina bikin kamu kena masalah sama peraturan akademik atau kode etik kampus.</li>
<li><strong>Kegiatan Ilegal:</strong> Lumina bukan aplikasi untuk main-main sama hal yang melanggar hukum.</li>
<li><strong>Ngerusak Aplikasi:</strong> Jangan coba-coba nge-hack atau bikin Lumina error, ya.</li>
<li><strong>Nyalahgunain Fitur:</strong> Pakai fitur Lumina sesuai fungsinya, jangan aneh-aneh.</li>
</ul>
</li>
</ul>

<strong>Penting Dibaca: Tanggung Jawab Lumina (dan Bukan Tanggung Jawabnya)</strong>

<div class="card">
<div class="card-content">
<div class="content">
<strong>Yo, Warga Lumina!</strong> 👋
<p>
Sebelum kamu gaspol pakai Lumina, ada aturan main yang perlu kamu pahami. Ini bukan basa-basi, tapi <em>rules</em> yang bikin kita semua nyaman dan makin semangat belajar. Kita sebut aja ini "Ketentuan Lumina". Dengan lanjut menggunakan Lumina, berarti kamu sudah sepakat sama aturan ini. Kalau ada yang nggak sreg, mending jangan pakai Lumina dulu, ya.
</p>

<strong>Lumina = Kamu + Aplikasi Keren Ini</strong>
<p>
Ketentuan ini adalah perjanjian sakral antara kamu (para "Pengguna" setia) dan Lumina (si "Aplikasi" andalan). Kita atur di sini semua tentang bagaimana kamu bisa menggunakan Lumina dengan bijak, jadi simak baik-baik ya!
</p>

<strong>Misi Mulia Lumina: Bukan untuk Bolos! 🚀</strong>
<p>
Lumina hadir untuk jadi pahlawan bagi kamu yang <em>sometimes</em> lupa presensi karena buru-buru atau memang lagi <em>blank</em>. Tujuan utama Lumina itu jelas: bantu kamu mengatasi masalah lupa presensi dengan <em>sat-set</em>.
</p>

<strong>Ingat!</strong> Lumina <strong>bukan</strong> alat untuk membolos kuliah atau menghindari kewajiban presensi. Lumina itu <em>partner</em>, bukan <em>partner in crime</em>.

<strong>Aturan Main yang Wajib Kamu Patuhi:</strong>
<ul>
<li><strong>Boleh:</strong> Lumina boleh kamu pakai kalau kamu memang lupa presensi karena alasan yang wajar. Kita semua manusia, kok.</li>
<li><strong>Gak Boleh! (Alias, Dilarang Keras):</strong>
<ul>
<li><strong>No Guarantee:</strong> Kami nggak menjamin apa pun tentang kinerja aplikasi ini. Jadi, kalau ada error, mohon dimaklumi.</li>
<li><strong>No Blame:</strong> Kami nggak bertanggung jawab atas kerugian apa pun yang timbul karena kamu pakai (atau nggak bisa pakai) Lumina.</li>
<li><strong>No Excuse for Misuse:</strong> Kalau kamu nyalahgunain Lumina dan kena sanksi akademik, itu bukan salah Lumina ya. Intinya, gunakan Lumina dengan bijak.</li>
<li><strong>Bolos Kuliah:</strong> Lumina bukan alasan untuk nggak masuk kelas.</li>
<li><strong>Melanggar Aturan Kampus:</strong> Jangan sampai Lumina bikin kamu kena masalah sama peraturan akademik atau kode etik kampus.</li>
<li><strong>Kegiatan Ilegal:</strong> Lumina bukan aplikasi untuk main-main sama hal yang melanggar hukum.</li>
<li><strong>Ngerusak Aplikasi:</strong> Jangan coba-coba nge-hack atau bikin Lumina error, ya.</li>
<li><strong>Nyalahgunain Fitur:</strong> Pakai fitur Lumina sesuai fungsinya, jangan aneh-aneh.</li>
</ul>

<strong>Yang Perlu Kamu Tahu:</strong>
</li>
</ul>

<strong>Penting Dibaca: Tanggung Jawab Lumina (dan Bukan Tanggung Jawabnya)</strong>
<ul>
<li><strong>No Guarantee:</strong> Kami nggak menjamin apa pun tentang kinerja aplikasi ini. Jadi, kalau ada error, mohon dimaklumi.</li>
<li><strong>No Blame:</strong> Kami nggak bertanggung jawab atas kerugian apa pun yang timbul karena kamu pakai (atau nggak bisa pakai) Lumina.</li>
<li><strong>No Excuse for Misuse:</strong> Kalau kamu nyalahgunain Lumina dan kena sanksi akademik, itu bukan salah Lumina ya. Intinya, gunakan Lumina dengan bijak.</li>
</ul>

<strong>Yang Perlu Kamu Tahu:</strong>
<ul>
<li><strong>Aturan Bisa Berubah:</strong> Ketentuan ini bisa berubah sewaktu-waktu. Perubahan akan diumumkan di halaman "Ketentuan Lumina". Kalau kamu terus pakai Lumina setelah ada perubahan, berarti kamu setuju dengan aturan yang baru.</li>
<li><strong>Akses Bisa Diblokir:</strong> Kalau kamu melanggar aturan atau ada alasan yang kuat, kami berhak menangguhkan akses kamu ke Lumina.</li>
<li><strong>Ada Pertanyaan?</strong> Kalau kamu punya pertanyaan atau keluhan soal ketentuan ini, jangan sungkan hubungi kami:
<ul>
<li><strong>Aturan Bisa Berubah:</strong> Ketentuan ini bisa berubah sewaktu-waktu. Perubahan akan diumumkan di halaman "Ketentuan Lumina". Kalau kamu terus pakai Lumina setelah ada perubahan, berarti kamu setuju dengan aturan yang baru.</li>
<li><strong>Akses Bisa Diblokir:</strong> Kalau kamu melanggar aturan atau ada alasan yang kuat, kami berhak menangguhkan akses kamu ke Lumina.</li>
<li><strong>Ada Pertanyaan?</strong> Kalau kamu punya pertanyaan atau keluhan soal ketentuan ini, jangan sungkan hubungi kami:
<ul>
<li><strong>Email:</strong> ridwaanhall.dev@gmail.com</li>
</ul>
</li>
<li><strong>Email:</strong> ridwaanhall.dev@gmail.com</li>
</ul>
<strong>Intinya:</strong>
<p>
Ketentuan ini adalah perjanjian lengkap antara kamu dan Lumina. Ini menggantikan semua perjanjian atau pemahaman kita sebelumnya.
</p>
<strong>Mulai Berlaku:</strong>
<p>
Ketentuan ini resmi berlaku sejak <strong>hari Ahad, 26 Januari 2025.</strong>
</p>
<strong>Last but not least:</strong>
<p>
Lumina dibuat <em>purely</em> untuk membantu kamu yang beneran lupa presensi. Memakai Lumina untuk hal lain, apalagi bolos kuliah, itu sama aja kamu melanggar aturan kita. So, be smart and use Lumina wisely! 😎
</p>
<strong>Semangat kuliah dan jangan lupa presensi ya! 😉</strong>
</div>
</div>
</div>
</li>
</ul>

<strong>Intinya:</strong>
<p>
Ketentuan ini adalah perjanjian lengkap antara kamu dan Lumina. Ini menggantikan semua perjanjian atau pemahaman kita sebelumnya.
</p>

<strong>Mulai Berlaku:</strong>
<p>
Ketentuan ini resmi berlaku sejak <strong>hari Ahad, 26 Januari 2025.</strong>
</p>

<strong>Last but not least:</strong>
<p>
Lumina dibuat <em>purely</em> untuk membantu kamu yang beneran lupa presensi. Memakai Lumina untuk hal lain, apalagi bolos kuliah, itu sama aja kamu melanggar aturan kita. So, be smart and use Lumina wisely! 😎
</p>

<strong>Semangat kuliah dan jangan lupa presensi ya! 😉</strong>
</div>
</div>
</section>
</div>

</section>
{% endblock %}

Expand Down
102 changes: 50 additions & 52 deletions blog/templates/blog/blog.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -23,65 +23,63 @@ <h2 class="subtitle">Scroll ke bawah buat baca artikelnya ya! 👇</h2>
</ul>
</nav>

<section class="section">
<div class="container">
<div class="columns is-multiline">
{% for blog in blogs %}
<div class="column is-half-tablet is-half-desktop is-one-third-widescreen">
<div class="card">
{% if blog.image %}
<div class="card-image">
<figure class="image is-16by9">
<img src="{% static blog.image %}" alt="{{ blog.title }}" loading="lazy" height="360" width="640" />
</figure>
</div>
{% endif %}

<div class="card-content">
<div class="media">
<div class="media-left">
<figure class="image is-48x48">
<img src="{% static 'icon-192x192.png' %}" alt="ridwaanhall second icon" width="48" height="48" />
</figure>
</div>
<div class="media-content">
<p class="title is-5">{{ blog.name }}
</p>
<p class="subtitle is-6">
<a href="{% url 'ridwaanhall' %}">@{{ blog.username }}
<i class="fa-solid fa-circle-check"></i>
</a>
</p>
</div>
</div>

<div class="content">
{% for tag in blog.tags %}
<span class="tag">{{ tag.name }}</span>
{% endfor %}
<h3 class="title is-5 mt-2 mb-2">
<a href="{% url 'blog' %}{{ blog.title|slugify }}">{{ blog.title }}</a>
</h3>
<p class="mt-1">{{ blog.intro|truncatewords:30 }}</p>
</div>
<div class="columns is-multiline">
{% for blog in blogs %}
<div class="column is-half-tablet is-half-desktop is-one-third-widescreen">
<div class="card">
{% if blog.image %}
<div class="card-image">
<figure class="image is-16by9">
<img src="{% static blog.image %}" alt="{{ blog.title }}" loading="lazy" height="360" width="640" />
</figure>
</div>
{% endif %}

<div class="card-content">
<div class="media">
<div class="media-left">
<figure class="image is-48x48">
<img src="{% static 'icon-192x192.png' %}" alt="ridwaanhall second icon" width="48" height="48" />
</figure>
</div>
<footer class="card-footer">
<p class="card-footer-item">
<span>
<time datetime="{{ blog.date }}">{{ blog.date|date:"l, j F Y, H.i T" }}</time>
</span>
<div class="media-content">
<p class="title is-5">{{ blog.name }}
</p>
<p class="subtitle is-6">
<a href="{% url 'ridwaanhall' %}">@{{ blog.username }}
<i class="fa-solid fa-circle-check"></i>
</a>
</p>
</footer>
</div>
</div>

<div class="content">
{% for tag in blog.tags %}
<span class="tag">{{ tag.name }}</span>
{% endfor %}
<h3 class="title is-5 mt-2 mb-2">
<a href="{% url 'blog' %}{{ blog.title|slugify }}">{{ blog.title }}</a>
</h3>
<p class="mt-1">{{ blog.intro|truncatewords:30 }}</p>
</div>
</div>
{% empty %}
<div class="column">
<p class="has-text-centered">Belum ada artikel blog saat ini.</p>
</div>
{% endfor %}
<footer class="card-footer">
<p class="card-footer-item">
<span>
<time datetime="{{ blog.date }}">{{ blog.date|date:"l, j F Y, H.i T" }}</time>
</span>
</p>
</footer>
</div>
</div>
</section>
{% empty %}
<div class="column">
<p class="has-text-centered">Belum ada artikel blog saat ini.</p>
</div>
{% endfor %}
</div>

</section>
{% endblock %}

Expand Down
3 changes: 2 additions & 1 deletion templates/base.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -142,11 +142,12 @@
</head>
<body>
{% include 'navbar.html' %}

<section class="section">
{% block content %}
{% endblock %}
</section>

{% include 'footer.html' %}

<script>
Expand Down

0 comments on commit a7473a7

Please sign in to comment.