Compare commits
5 Commits
| Author | SHA1 | Date | |
|---|---|---|---|
| fe5c645cbd | |||
| ec0288fd8a | |||
| 7cf671d826 | |||
| c772aa2d83 | |||
| f75c04c052 |
@@ -578,6 +578,7 @@ const translations = {
|
||||
grp_m4n1fest_hero_btn_stats: "Lihat Statistik Alumni",
|
||||
grp_m4n1fest_hero_btn_join: "Gabung Grup IKA",
|
||||
grp_m4n1fest_hero_stat_alumni: "TOTAL ALUMNI",
|
||||
grp_m4n1fest_hero_stat_alumni_desc: "data diperoleh dari alumni terdata di tracer study",
|
||||
grp_m4n1fest_hero_stat_batch: "ANGKATAN",
|
||||
grp_m4n1fest_hero_stat_company: "PERUSAHAAN",
|
||||
grp_m4n1fest_eyebrow_achievers: "High Achievers",
|
||||
@@ -1285,6 +1286,7 @@ const translations = {
|
||||
grp_m4n1fest_hero_btn_stats: "View Alumni Statistics",
|
||||
grp_m4n1fest_hero_btn_join: "Join Alumni Group",
|
||||
grp_m4n1fest_hero_stat_alumni: "TOTAL ALUMNI",
|
||||
grp_m4n1fest_hero_stat_alumni_desc: "data obtained from alumni recorded in tracer study",
|
||||
grp_m4n1fest_hero_stat_batch: "CLASSES",
|
||||
grp_m4n1fest_hero_stat_company: "COMPANIES",
|
||||
grp_m4n1fest_eyebrow_achievers: "High Achievers",
|
||||
|
||||
|
After Width: | Height: | Size: 103 KiB |
|
After Width: | Height: | Size: 41 KiB |
|
After Width: | Height: | Size: 27 KiB |
|
After Width: | Height: | Size: 21 KiB |
|
After Width: | Height: | Size: 84 KiB |
|
After Width: | Height: | Size: 6.0 KiB |
|
After Width: | Height: | Size: 13 KiB |
|
After Width: | Height: | Size: 27 KiB |
|
After Width: | Height: | Size: 41 KiB |
|
After Width: | Height: | Size: 62 KiB |
|
After Width: | Height: | Size: 44 KiB |
|
After Width: | Height: | Size: 16 KiB |
|
After Width: | Height: | Size: 40 KiB |
|
After Width: | Height: | Size: 7.3 KiB |
|
After Width: | Height: | Size: 14 KiB |
|
After Width: | Height: | Size: 296 KiB |
@@ -1188,15 +1188,16 @@
|
||||
|
||||
<div class="custom-stats">
|
||||
<div class="custom-stat-box">
|
||||
<div class="custom-stat-num custom-serif">850<span class="custom-stat-plus">+</span></div>
|
||||
<div class="custom-stat-num custom-serif">212<span class="custom-stat-plus">+</span></div>
|
||||
<div class="custom-stat-label" data-i18n="grp_m4n1fest_hero_stat_alumni">TOTAL ALUMNI</div>
|
||||
<div class="custom-stat-desc" style="font-size: 0.65rem; color: #a1a1aa; margin-top: 4px; line-height: 1.35; font-weight: normal; font-family: sans-serif;" data-i18n="grp_m4n1fest_hero_stat_alumni_desc">data diperoleh dari alumni terdata di tracer study</div>
|
||||
</div>
|
||||
<div class="custom-stat-box">
|
||||
<div class="custom-stat-num custom-serif">18<span class="custom-stat-plus">+</span></div>
|
||||
<div class="custom-stat-num custom-serif">22</div>
|
||||
<div class="custom-stat-label" data-i18n="grp_m4n1fest_hero_stat_batch">ANGKATAN</div>
|
||||
</div>
|
||||
<div class="custom-stat-box" style="border-right: none;">
|
||||
<div class="custom-stat-num custom-serif">150<span class="custom-stat-plus">+</span></div>
|
||||
<div class="custom-stat-num custom-serif">202<span class="custom-stat-plus">+</span></div>
|
||||
<div class="custom-stat-label" data-i18n="grp_m4n1fest_hero_stat_company">PERUSAHAAN</div>
|
||||
</div>
|
||||
</div>
|
||||
@@ -1226,8 +1227,8 @@
|
||||
<!-- Card 1 -->
|
||||
<div class="achiever-card rv d1">
|
||||
<div class="achiever-body">
|
||||
<div class="achiever-avatar-circle" style="background: linear-gradient(135deg, #1a3a6b, #2352a0);">
|
||||
<span class="achiever-initials">IF</span>
|
||||
<div class="achiever-avatar-circle">
|
||||
<img src="./assets/izhan.jpg" alt="Izhan Fakhruzi">
|
||||
</div>
|
||||
<div class="achiever-batch" data-i18n="grp_m4n1fest_ach1_batch">Angkatan 2005</div>
|
||||
<div class="achiever-name">Izhan Fakhruzi</div>
|
||||
@@ -1244,8 +1245,8 @@
|
||||
<!-- Card 2 -->
|
||||
<div class="achiever-card rv d2">
|
||||
<div class="achiever-body">
|
||||
<div class="achiever-avatar-circle" style="background: linear-gradient(135deg, #0f766e, #14b8a6);">
|
||||
<span class="achiever-initials">CD</span>
|
||||
<div class="achiever-avatar-circle">
|
||||
<img src="./assets/charles.jpg" alt="Charles Darwis Hariman">
|
||||
</div>
|
||||
<div class="achiever-batch" data-i18n="grp_m4n1fest_ach2_batch">Informatika UNTAN</div>
|
||||
<div class="achiever-name">Charles Darwis Hariman</div>
|
||||
@@ -1262,8 +1263,8 @@
|
||||
<!-- Card 3 -->
|
||||
<div class="achiever-card rv d3">
|
||||
<div class="achiever-body">
|
||||
<div class="achiever-avatar-circle" style="background: linear-gradient(135deg, #3730a3, #6366f1);">
|
||||
<span class="achiever-initials">DP</span>
|
||||
<div class="achiever-avatar-circle">
|
||||
<img src="./assets/dona.jpg" alt="Dona Pramana Pura">
|
||||
</div>
|
||||
<div class="achiever-batch" data-i18n="grp_m4n1fest_ach3_batch">Angkatan 2009</div>
|
||||
<div class="achiever-name">Dona Pramana Pura</div>
|
||||
@@ -1396,102 +1397,47 @@
|
||||
</div>
|
||||
<div class="logo-grid">
|
||||
<div class="logo-card">
|
||||
<div
|
||||
class="logo-initials"
|
||||
style="background: #ebf1fb; color: #1a3a6b"
|
||||
>
|
||||
BCA
|
||||
</div>
|
||||
<img src="./assets/BCA.png" alt="Logo BCA" style="width: 100%; height: 60px; padding: 8px; object-fit: contain; border-radius: 8px;">
|
||||
<span class="logo-name" data-i18n="grp_m4n1fest_logo_bca">BCA</span>
|
||||
</div>
|
||||
<div class="logo-card">
|
||||
<div
|
||||
class="logo-initials"
|
||||
style="background: #fff0f0; color: #c00"
|
||||
>
|
||||
BRI
|
||||
</div>
|
||||
<img src="./assets/bri.png" alt="Logo BRI" style="width: 100%; height: 60px; padding: 8px; object-fit: contain; border-radius: 8px;">
|
||||
<span class="logo-name" data-i18n="grp_m4n1fest_logo_bri">BRI</span>
|
||||
</div>
|
||||
<div class="logo-card">
|
||||
<div
|
||||
class="logo-initials"
|
||||
style="background: #fff7e6; color: #f5b800"
|
||||
>
|
||||
TLKM
|
||||
</div>
|
||||
<img src="./assets/Telkom.jpg" alt="Logo Telkom Indonesia" style="width: 100%; height: 60px; padding: 8px; object-fit: contain; border-radius: 8px;">
|
||||
<span class="logo-name" data-i18n="grp_m4n1fest_logo_telkom">Telkom Indonesia</span>
|
||||
</div>
|
||||
<div class="logo-card">
|
||||
<div
|
||||
class="logo-initials"
|
||||
style="background: #ebf1fb; color: #0a66c2"
|
||||
>
|
||||
PLN
|
||||
</div>
|
||||
<img src="./assets/pln.jpg" alt="Logo PLN" style="width: 100%; height: 60px; padding: 8px; object-fit: contain; border-radius: 8px;">
|
||||
<span class="logo-name" data-i18n="grp_m4n1fest_logo_pln">PLN</span>
|
||||
</div>
|
||||
<div class="logo-card">
|
||||
<div
|
||||
class="logo-initials"
|
||||
style="background: #f0f0ff; color: #3730a3"
|
||||
>
|
||||
INDF
|
||||
</div>
|
||||
<img src="./assets/Indofood.png" alt="Logo Indofood Fortuna" style="width: 100%; height: 60px; padding: 8px; object-fit: contain; border-radius: 8px;">
|
||||
<span class="logo-name" data-i18n="grp_m4n1fest_logo_indofood">Indofood Fortuna</span>
|
||||
</div>
|
||||
<div class="logo-card">
|
||||
<div
|
||||
class="logo-initials"
|
||||
style="background: #fff0f5; color: #ee4d2d"
|
||||
>
|
||||
ASTR
|
||||
</div>
|
||||
<img src="./assets/astra.webp" alt="Logo Astra Daihatsu" style="width: 100%; height: 60px; padding: 8px; object-fit: contain; border-radius: 8px;">
|
||||
<span class="logo-name" data-i18n="grp_m4n1fest_logo_astra">Astra Daihatsu</span>
|
||||
</div>
|
||||
<div class="logo-card">
|
||||
<div
|
||||
class="logo-initials"
|
||||
style="background: #f0fff4; color: #15803d"
|
||||
>
|
||||
UNVR
|
||||
</div>
|
||||
<img src="./assets/unilever-logo.png" alt="Logo Unilever" style="width: 100%; height: 60px; padding: 8px; object-fit: contain; border-radius: 8px;">
|
||||
<span class="logo-name" data-i18n="grp_m4n1fest_logo_unilever">Unilever</span>
|
||||
</div>
|
||||
<div class="logo-card">
|
||||
<div
|
||||
class="logo-initials"
|
||||
style="background: #f0fff4; color: #16a34a"
|
||||
>
|
||||
GRAB
|
||||
</div>
|
||||
<img src="./assets/grab.png" alt="Logo Grab" style="width: 100%; height: 60px; padding: 8px; object-fit: contain; border-radius: 8px;">
|
||||
<span class="logo-name" data-i18n="grp_m4n1fest_logo_grab">Grab</span>
|
||||
</div>
|
||||
<div class="logo-card">
|
||||
<div
|
||||
class="logo-initials"
|
||||
style="background: #fff0f0; color: #c00"
|
||||
>
|
||||
TSEL
|
||||
</div>
|
||||
<img src="./assets/telkomsel.jpg" alt="Logo Telkomsel" style="width: 100%; height: 60px; padding: 8px; object-fit: contain; border-radius: 8px;">
|
||||
<span class="logo-name" data-i18n="grp_m4n1fest_logo_telkomsel">Telkomsel</span>
|
||||
</div>
|
||||
<div class="logo-card">
|
||||
<div
|
||||
class="logo-initials"
|
||||
style="background: #ebf1fb; color: #0866ff"
|
||||
>
|
||||
GIAA
|
||||
</div>
|
||||
<img src="./assets/garuda_indonesia.jpg" alt="Logo Garuda Indonesia" style="width: 100%; height: 60px; padding: 8px; object-fit: contain; border-radius: 8px;">
|
||||
<span class="logo-name" data-i18n="grp_m4n1fest_logo_garuda">Garuda Indonesia</span>
|
||||
</div>
|
||||
<div class="logo-card">
|
||||
<div
|
||||
class="logo-initials"
|
||||
style="background: #fffbea; color: #b38500"
|
||||
>
|
||||
BULG
|
||||
</div>
|
||||
<img src="./assets/Bulog-Logo.png" alt="Logo Perum Bulog" style="width: 100%; height: 60px; padding: 8px; object-fit: contain; border-radius: 8px;">
|
||||
<span class="logo-name" data-i18n="grp_m4n1fest_logo_bulog">Perum BULOG</span>
|
||||
</div>
|
||||
<div class="logo-card">
|
||||
@@ -1623,12 +1569,24 @@
|
||||
</p>
|
||||
</div>
|
||||
|
||||
<div class="two-col" style="align-items: flex-start;">
|
||||
<!-- left: Table -->
|
||||
<div class="two-col stat-cols" style="align-items: flex-start;">
|
||||
<!-- left: Chart -->
|
||||
<div class="chart-box rv d2" style="margin-top: 0;">
|
||||
<div class="chart-header">
|
||||
<div class="chart-title" data-i18n="grp_m4n1fest_chart_title">
|
||||
Grafik Jumlah Lulusan
|
||||
</div>
|
||||
</div>
|
||||
<div style="position: relative; height: 280px; width: 100%;">
|
||||
<canvas id="kelulusanChart"></canvas>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- right: Table -->
|
||||
<div class="rv d1" style="background: #fff; border: 1px solid #e2e8f0; border-radius: 12px; overflow: hidden; padding: 0;">
|
||||
<table style="width: 100%; border-collapse: collapse; text-align: left; font-size: 0.9rem;">
|
||||
<thead>
|
||||
<tr style="background: #374151; color: #fff;">
|
||||
<tr style="background: #1a3a6b; color: #fff;">
|
||||
<th style="padding: 14px 20px; font-weight: 600;" data-i18n="grp_m4n1fest_table_head_period">Periode</th>
|
||||
<th style="padding: 14px 20px; font-weight: 600; text-align: right;" data-i18n="grp_m4n1fest_table_head_amount">Jumlah</th>
|
||||
</tr>
|
||||
@@ -1660,18 +1618,6 @@
|
||||
Sumber : BAK UNTAN
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- right: Chart -->
|
||||
<div class="chart-box rv d2" style="margin-top: 0;">
|
||||
<div class="chart-header">
|
||||
<div class="chart-title" data-i18n="grp_m4n1fest_chart_title">
|
||||
Grafik Jumlah Lulusan
|
||||
</div>
|
||||
</div>
|
||||
<div style="position: relative; height: 280px; width: 100%;">
|
||||
<canvas id="kelulusanChart"></canvas>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
@@ -2701,6 +2647,8 @@
|
||||
<!-- Scroll Reveal Observer & Chart.js Initialization -->
|
||||
<script>
|
||||
/* ── IKA FORM SUBMIT ── */
|
||||
// Silakan ganti URL di bawah dengan Web App URL (akhiran /exec) hasil Deploy project Apps Script Anda.
|
||||
// Cara Deploy: di Apps Script editor -> Deploy -> New deployment -> Web app -> Who has access: Anyone.
|
||||
const IKA_SCRIPT_URL = "https://script.google.com/macros/s/AKfycbwrXG3YFu4PEY3Z3acYeFTLCozM6iERfA7_yWxXaiJn7ULwau5vTIpt0Zv04OziMit-/exec";
|
||||
|
||||
// Checkbox visual toggle
|
||||
|
||||
@@ -593,6 +593,12 @@ a {
|
||||
justify-content: center;
|
||||
border: 3px solid var(--navy-ghost);
|
||||
margin-bottom: 12px;
|
||||
overflow: hidden;
|
||||
}
|
||||
.achiever-avatar-circle img {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
object-fit: cover;
|
||||
}
|
||||
.achiever-card:hover .achiever-avatar-circle {
|
||||
border-color: var(--gold-lt);
|
||||
@@ -660,11 +666,15 @@ ul.achiever-achievements li::before {
|
||||
gap: 52px;
|
||||
align-items: start;
|
||||
}
|
||||
.stat-cols {
|
||||
grid-template-columns: 1.3fr 0.7fr;
|
||||
}
|
||||
.two-col > * {
|
||||
min-width: 0;
|
||||
}
|
||||
@media (max-width: 760px) {
|
||||
.two-col {
|
||||
.two-col,
|
||||
.stat-cols {
|
||||
grid-template-columns: 1fr;
|
||||
gap: 32px;
|
||||
}
|
||||
|
||||