API tools faq
paste
last63

index.html profile

last63
Nov 13th, 2022
60
0
Never
Add comment
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
HTML 8.30 KB | None | 0 0
raw download clone embed print report
  1. <!DOCTYPE html>
  2. <html lang="en">
  3.   <head>
  4.     <meta charset="UTF-8" />
  5.     <meta http-equiv="X-UA-Compatible" content="IE=edge" />
  6.     <meta name="viewport" content="width=device-width, initial-scale=1.0" />
  7.     <meta name="description" content="Profile IDN" />
  8.     <meta name="keywords" content="html|css|js" />
  9.  
  10.     <!-- FAVICON -->
  11.     <link
  12.      rel="shortcut icon"
  13.      href="assets/img/logo-favicon.png"
  14.      type="image/x-icon"
  15.    />
  16.  
  17.     <!-- LINK CSS -->
  18.     <link rel="stylesheet" href="assets/css/style.css" />
  19.  
  20.     <title>Profile IDN</title>
  21.   </head>
  22.  
  23.   <body>
  24.     <!-- ======================== NAVBAR ======================== -->
  25.     <nav>
  26.       <ul class="navbar-list">
  27.         <li class="logo">
  28.           <a href="#">IDN Boarding School</a>
  29.         </li>
  30.         <li class="toggle">
  31.           <img src="assets/img/menu-bar.png" width="30" height="30" alt="menu"/>
  32.         </li>
  33.         <li class="navbar-item">
  34.           <a href="#syarat-pendaftaran" class="navbar-link">Syarat Pendaftaran</a>
  35.         </li>
  36.         <li class="navbar-item">
  37.           <a href="#status-kelulusan" class="navbar-link">Status Kelulusan</a>
  38.         </li>
  39.         <li class="navbar-item">
  40.           <a href="#itfest" class="navbar-link">IDN IT Fest</a>
  41.         </li>
  42.         <li class="navbar-item">
  43.           <a href="#" class="navbar-link">Kontak</a>
  44.         </li>
  45.         <li class="navbar-item">
  46.           <a href="#" class="navbar-link-login">Login</a>
  47.         </li>
  48.         <li class="navbar-item">
  49.           <a href="#" class="navbar-link-register">Register</a>
  50.         </li>
  51.       </ul>
  52.     </nav>
  53.     <!-- ======================== END NAVBAR ======================== -->
  54.  
  55.     <!-- ======================== HEADER ======================== -->
  56.     <header>
  57.       <section class="header">
  58.         <div class="header-container">
  59.           <div class="logo-idn">
  60.             <img src="assets/img/logo-favicon.png" alt="" class="logo-img" />
  61.           </div>
  62.           <div class="big-heading">
  63.             <h1>IDN Boarding School Solo</h1>
  64.             <p>
  65.               Lorem ipsum dolor sit amet consectetur, adipisicing elit. Aperiam
  66.               nulla autem atque error molestiae sapiente qui dolores perferendis
  67.               ex quae? Excepturi id ex accusamus eveniet adipisci! Amet
  68.               exercitationem quos debitis?
  69.             </p>
  70.             <button class="btn-explore">
  71.               <a href="#">Explore 1</a>
  72.             </button>
  73.             <button class="btn-explore">
  74.               <a href="#">Explore 2</a>
  75.             </button>
  76.             <button class="btn-explore">
  77.               <a href="#">Explore 3</a>
  78.             </button>
  79.             <button class="btn-explore">
  80.               <a href="#">Explore 4</a>
  81.             </button>
  82.           </div>
  83.         </div>
  84.       </section>
  85.     </header>
  86.     <!-- ======================== END HEADER ======================== -->
  87.  
  88.     <!-- ======================== SYARAT PENDAFATARAN ======================== -->
  89.     <article>
  90.       <section class="collection" id="syarat-pendaftaran">
  91.         <h2>Syarat Pendaftaran</h2>
  92.         <h6>Penerimaan Peserta Didik Baru</h6>
  93.         <div class="collection-container">
  94.           <div class="list-persyaratan">
  95.             <ol class="activity-feed">
  96.               <li class="feed-item feed-item-default">
  97.                 Buku Rapor SMP atau sederajat.
  98.               </li>
  99.               <li class="feed-item feed-item-primary">
  100.                 <p class="date">9 November 2022</p>
  101.                 Surat keterangan nilai rapor semester 1-5 SMP atau sederajat
  102.                 yang diterbitkan oleh sekolah terkait.
  103.               </li>
  104.               <li class="feed-item feed-item-secondary">
  105.                 <p class="date">9 November 2022</p>
  106.                 Ijazah SMP/sederajat atau surat keterangan bahwa siswa telah
  107.                 menyelesaikan pendidikan SMP atau sederajat yang dikeluarkan
  108.                 pihak sekolah.
  109.               </li>
  110.               <li class="feed-item feed-item-success">
  111.                 Akta kelahiran dengan batas usia maksimal 21 tahun pada awal
  112.                 tahun ajaran 2022/2023.
  113.               </li>
  114.               <li class="feed-item feed-item-info">
  115.                 Kartu Keluarga (KK) yang diterbitkan minimal 1 tahun sebelum
  116.                 tanggal pendaftaran PPDB.
  117.               </li>
  118.               <li class="feed-item feed-item-warning">
  119.                 Bagi calon peserta didik lulusan pesantren harus membawa surat
  120.                 keterangan bahwa pesantren terdaftar pada Educational Management
  121.                 Islamic System (EMIS) yang diterbitkan oleh Kantor Wilayah
  122.                 Kementrian Agama terkait.
  123.               </li>
  124.               <li class="feed-item feed-item-danger">
  125.                 Terdaftar pada Data Terpadu Kesejahteraan Sosial (DTKS) dan atau
  126.                 menyertakan bukti kepemilikan Kartu Indonesia Pintar (KIP) yang
  127.                 diterbitkan Mendikbud untuk peserta jalur Afirmasi.
  128.               </li>
  129.               <li class="feed-item feed-item-default">
  130.                 Surat penugasan dari instansi terkait bagi peserta didik dengan
  131.                 jalur Perpindahan Tugas Orang Tua.
  132.               </li>
  133.               <li class="feed-item feed-item-primary">
  134.                 Piagam prestasi tertinggi yang dimiliki sesuai dengan ketentuan
  135.                 untuk pendaftaran jalur Prestasi.
  136.               </li>
  137.             </ol>
  138.           </div>
  139.           <div class="logo-list">
  140.             <img src="assets/img/logo.jpg" alt="Gambar List" class="list-img" />
  141.           </div>
  142.         </div>
  143.       </section>
  144.     </article>
  145.     <!-- ======================== END SYARAT PENDAFTARAN ======================== -->
  146.  
  147.     <!-- ======================== STATUS KELULUSAN ========================  -->
  148.     <article>
  149.       <section class="collection-kelulusan" id="status-kelulusan">
  150.         <div class="card-cek">
  151.           <h2>Cek Status Kelulusan</h2>
  152.         </div>
  153.         <div class="card-input">
  154.           <input type="text" class="input-name" placeholder="Input your name" />
  155.         </div>
  156.         <div class="card-input">
  157.           <input
  158.            type="text"
  159.            class="input-name"
  160.            placeholder="Input your no. Registration"
  161.          />
  162.         </div>
  163.         <div class="card-input">
  164.           <button class="button-cek">
  165.             <h2>Cek Kelulusan</h2>
  166.           </button>
  167.         </div>
  168.       </section>
  169.     </article>
  170.     <!-- ======================== END STATUS KELULUSAN ======================== -->
  171.  
  172.     <!-- ======================== IDN IT FEST ======================== -->
  173.     <article>
  174.       <section class="collection-itfest" id="itfest">
  175.         <h2>IDN IT Fest</h2>
  176.         <div class="collection-itfest-container">
  177.            
  178.             <!-- ==== Network ==== -->
  179.             <div class="collection-itfest-card">
  180.                 <div class="image-box">
  181.                     <img src="/assets/img/network.jpg" alt="network.jpg" srcset="">
  182.                 </div>
  183.                 <h3>Network Engineer</h3>
  184.                 <button class="card-button">Visit</button>
  185.             </div>
  186.             <!-- ==== End Network ==== -->
  187.  
  188.             <!-- ==== UI UX ==== -->
  189.             <div class="collection-itfest-card">
  190.                 <div class="image-box">
  191.                     <img src="/assets/img/uiux.jpg" alt="uiux.jpg" srcset="">
  192.                 </div>
  193.                 <h3>UI UX Designer</h3>
  194.                 <button class="card-button">Visit</button>
  195.             </div>
  196.             <!-- ==== End UI UX ==== -->
  197.  
  198.             <!-- ==== Web Developer ==== -->
  199.             <div class="collection-itfest-card">
  200.                 <div class="image-box">
  201.                     <img src="/assets/img/web-dev.jpg" alt="web-dev.jpg" srcset="">
  202.                 </div>
  203.                 <h3>Web Developer</h3>
  204.                 <button class="card-button">Visit</button>
  205.             </div>
  206.             <!-- ==== End Web Developer ==== -->
  207.         </div>
  208.       </section>
  209.     </article>
  210.     <!-- ======================== END IDN IT FEST ======================== -->
  211.  
  212.     <!-- ======================== JS ======================== -->
  213.     <script src="assets/js/main.js"></script>
  214.     <!-- ======================== END JS ======================== -->
  215.   </body>
  216. </html>
  217.  
Add Comment
Please, Sign In to add comment
Public Pastes
We use cookies for various purposes including analytics. By continuing to use Pastebin, you agree to our use of cookies as described in the Cookies Policy.  OK, I Understand
Not a member of Pastebin yet?
Sign Up, it unlocks many cool features!