218 lines
8.4 KiB
PHP
218 lines
8.4 KiB
PHP
<!DOCTYPE html>
|
|
<html lang="en">
|
|
|
|
<head>
|
|
<meta charset="UTF-8">
|
|
<meta http-equiv="X-UA-Compatible" content="IE=edge">
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
|
<title>Perhitungan SAW</title>
|
|
|
|
<!-- favicon-->
|
|
<link rel="shortcut icon" href="{{ asset('user/favicon.svg') }}" type="image/svg+xml">
|
|
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">
|
|
|
|
<!-- custom css link -->
|
|
<link rel="stylesheet" href="{{ asset('user/css/userstyle.css') }}">
|
|
|
|
<!-- google font link -->
|
|
<link rel="preconnect" href="https://fonts.googleapis.com">
|
|
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
|
|
<link href="https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;700&display=swap" rel="stylesheet">
|
|
|
|
<!-- preload images-->
|
|
<link rel="preload" as="image" href="{{ asset('user/images/hero-banner.png') }}">
|
|
</head>
|
|
|
|
<body id="top">
|
|
|
|
<!-- #HEADER-->
|
|
<header class="header" data-header>
|
|
<div class="container">
|
|
<a href="#beranda" class="logo">Pintera</a>
|
|
<nav class="navbar" data-navbar>
|
|
<div class="wrapper">
|
|
<a href="#" class="logo">Pintera</a>
|
|
<button class="nav-close-btn" aria-label="close menu" data-nav-toggler><ion-icon name="close-outline" aria-hidden="true"></ion-icon></button>
|
|
</div>
|
|
<ul class="navbar-list">
|
|
<li class="navbar-item">
|
|
<a href="#beranda" class="navbar-link" data-nav-link>Beranda</a>
|
|
</li>
|
|
<li class="navbar-item">
|
|
<a href="#kriteria" class="navbar-link" data-nav-link>Kriteria</a>
|
|
</li>
|
|
<li class="navbar-item">
|
|
<a href="#tentang" class="navbar-link" data-nav-link>Tentang Sistem</a>
|
|
</li>
|
|
<li class="navbar-item">
|
|
<a href="#perhitungan" class="navbar-link" data-nav-link>Perhitungan</a>
|
|
</li>
|
|
</ul>
|
|
</nav>
|
|
<button class="nav-open-btn" aria-label="open menu" data-nav-toggler>
|
|
<ion-icon name="menu-outline" aria-hidden="true"></ion-icon>
|
|
</button>
|
|
<a href="{{ route('login') }}" class="btn btn-primary has-before has-after">Masuk</a>
|
|
<div class="overlay" data-nav-toggler data-overlay></div>
|
|
</div>
|
|
</header>
|
|
|
|
<main>
|
|
<article>
|
|
|
|
<!-- #HERO -->
|
|
<section class="section hero" id="beranda" aria-label="hero">
|
|
<div class="container">
|
|
<div class="hero-content">
|
|
<h1 class="h1 hero-title">Temukan <span class="has-before">Peminatan Terbaik</span>Sesuai Potensimu</h1>
|
|
<p class="hero-text">Sistem ini membantumu memilih mata pelajaran berdasarkan minat, hasil psikotes, dan cita-cita karier agar masa depanmu lebih terarah.</p>
|
|
<div class="wrapper">
|
|
<a href="{{ route('login') }}" class="btn btn-primary has-before has-after">Mulai</a>
|
|
</div>
|
|
</div>
|
|
<figure class="hero-banner">
|
|
<img src="{{ asset('user/images/hero-banner.png') }}" width="794" height="637" alt="hero banner" class="w-100">
|
|
</figure>
|
|
</div>
|
|
</section>
|
|
|
|
<!-- #SERVICE -->
|
|
<section class="section service" id="kriteria" aria-label="kriteria">
|
|
<div class="container">
|
|
<p class="section-subtitle has-before text-center">Kriteria Penilaian</p>
|
|
<h2 class="h2 section-title text-center">Penilaian didasarkan pada <span class="has-before">4 Kriteria Utama</span></h2>
|
|
<ul class="grid-list">
|
|
<li>
|
|
<div class="service-card" style="--color: 174, 77%, 50%">
|
|
<div class="card-icon">
|
|
<i class="fa fa-lightbulb-o" style="font-size: 30px; color: hsl(174, 77%, 50%);" aria-hidden="true"></i>
|
|
</div>
|
|
<h3 class="h3"><a href="#" class="card-title">Angket Cita-Cita</a></h3>
|
|
<p class="card-description">Berdasarkan aspirasi karir siswa untuk menentukan jalur akademik yang tepat.</p>
|
|
</div>
|
|
</li>
|
|
<li>
|
|
<div class="service-card" style="--color: 267, 76%, 57%">
|
|
<div class="card-icon">
|
|
<i class="fa fa-pie-chart" style="font-size: 28px; color: hsl(267, 76%, 57%);"></i>
|
|
</div>
|
|
<h3 class="h3"><a href="#" class="card-title">Hasil Psikotes</a></h3>
|
|
<p class="card-description">Diperoleh dari tes psikologis untuk memahami kecenderungan minat dan bakat siswa.</p>
|
|
</div>
|
|
</li>
|
|
<li>
|
|
<div class="service-card" style="--color: 17, 100%, 68%">
|
|
<div class="card-icon">
|
|
<i class="fa fa-commenting" style="font-size: 28px; color: hsl(17, 100%, 68%);"></i>
|
|
</div>
|
|
<h3 class="h3"><a href="#" class="card-title">Bimbingan BK</a></h3>
|
|
<p class="card-description">Hasil bimbingan BK yang memberikan wawasan tentang pengembangan pribadi siswa.</p>
|
|
</div>
|
|
</li>
|
|
<li>
|
|
<div class="service-card" style="--color: 343, 98%, 60%">
|
|
<div class="card-icon">
|
|
<i class="fa fa-book" style="font-size: 28px; color: hsl(343, 98%, 60%);"></i>
|
|
</div>
|
|
<h3 class="h3"><a href="#" class="card-title">Nilai Semester 1</a></h3>
|
|
<p class="card-description">Nilai akademik siswa pada semester pertama sebagai acuan kemampuan dasar.</p>
|
|
</div>
|
|
</li>
|
|
</ul>
|
|
</div>
|
|
</section>
|
|
|
|
<!-- #FEATURE -->
|
|
<section class="section feature" id="tentang" aria-label="tentang">
|
|
<div class="container">
|
|
<figure class="feature-banner">
|
|
<img src="{{ asset('user/images/feature-banner.png') }}" width="582" height="585" loading="lazy" alt="feature banner"class="w-100">
|
|
</figure>
|
|
<div class="feature-content">
|
|
<p class="section-subtitle has-before">Tentang Sistem</p>
|
|
<h2 class="h2 section-title">Bantu siswa memilih <span class="has-before">mata pelajaran pilihan</span>yang sesuai</h2>
|
|
<ul class="feature-list">
|
|
<li>
|
|
<div class="feature-card">
|
|
<div class="card-icon" style="--color: 174, 77%, 50%">
|
|
<ion-icon name="funnel-sharp" aria-hidden="true"></ion-icon>
|
|
</div>
|
|
<div>
|
|
<h3 class="h3 card-title">Pemilihan Cepat & Tepat</h3>
|
|
<p class="card-text">Sistem merekomendasi mata pelajaran berdasarkan data siswa.</p>
|
|
</div>
|
|
</div>
|
|
</li>
|
|
<li>
|
|
<div class="feature-card">
|
|
<div class="card-icon" style="--color: 241, 77%, 63%;">
|
|
<ion-icon name="document-text-sharp" aria-hidden="true"></ion-icon>
|
|
</div>
|
|
<div>
|
|
<h3 class="h3 card-title">Berbasis Data</h3>
|
|
<p class="card-text">Gunakan hasil angket, psikotes, nilai, dan bimbingan guru sebagai bahan analisis.</p>
|
|
</div>
|
|
</div>
|
|
</li>
|
|
<li>
|
|
<div class="feature-card">
|
|
<div class="card-icon" style="--color: 343, 98%, 60%;">
|
|
<ion-icon name="school-sharp" aria-hidden="true"></ion-icon>
|
|
</div>
|
|
<div>
|
|
<h3 class="h3 card-title">Sesuai Kurikulum</h3>
|
|
<p class="card-text">Mendukung kebijakan Kurikulum Merdeka yang memberi fleksibilitas siswa.</p>
|
|
</div>
|
|
</div>
|
|
</li>
|
|
</ul>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
|
|
<!-- #PERHITUNGAN -->
|
|
<section class="section newsletter has-bg-image" id="perhitungan" aria-label="perhitungan"style="background-image: url('/user/images/newsletter-bg.jpg')">
|
|
<div class="container">
|
|
<figure class="newsletter-banner">
|
|
<img src="{{ asset('user/images/newsletter-banner.png') }}" width="355" height="356" loading="lazy"alt="newsletter banner" class="w-100">
|
|
</figure>
|
|
<div class="newsletter-content">
|
|
<p class="section-subtitle has-before">Perhitungan</p>
|
|
<h2 class="h2 section-title">Klik tombol di bawah untuk memulai perhitungan sesuai dengan kriteria yang telah ditentukan.</h2>
|
|
<a href="{{ route('login') }}" class="btn btn-secondary has-before has-after">
|
|
<span class="span">Mulai Perhitungan</span>
|
|
<ion-icon name="arrow-forward" aria-hidden="true"></ion-icon>
|
|
</a>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
|
|
|
|
</article>
|
|
</main>
|
|
|
|
|
|
<!-- #FOOTER -->
|
|
<footer class="footer">
|
|
<div class="container">
|
|
<div class="footer-bottom">
|
|
<p class="copyright">© 2025 Sistem Pemilihan Mata Pelajaran. All Rights Reserved.</p>
|
|
</div>
|
|
</div>
|
|
</footer>
|
|
|
|
<!-- #BACK TO TOP -->
|
|
<a href="#top" class="back-top-btn has-after active" aria-label="back to top" data-back-top-btn>
|
|
<ion-icon name="arrow-up" aria-hidden="true"></ion-icon>
|
|
</a>
|
|
|
|
<!-- custom js link -->
|
|
<script src="{{ asset('user/js/userscript.js') }}" defer></script>
|
|
|
|
<!-- ionicon link-->
|
|
<script type="module" src="https://unpkg.com/ionicons@5.5.2/dist/ionicons/ionicons.esm.js"></script>
|
|
<script nomodule src="https://unpkg.com/ionicons@5.5.2/dist/ionicons/ionicons.js"></script>
|
|
|
|
</body>
|
|
|
|
</html> |