Add files via upload

BotKtps · Aug 5, 2024 · fdaea0d · fdaea0d
1 parent 2d9e33f
commit fdaea0d
Show file tree

Hide file tree

Showing 3 changed files with 85 additions and 120 deletions.
diff --git a/Khodam.js b/Khodam.js
@@ -1,16 +1,16 @@
 document.getElementById('checkButton').addEventListener('click', function() {
     const name = document.getElementById('name').value;
-    const result = document.getElementById('result'); // Perbaikan pada assignment
+    const result = document.getElementById('result');
     if (name) {
         const khodam = checkKhodam(name);
-        result.innerHTML = `Khodam Anda adalah: <strong>${khodam}</strong>`; // Perbaikan pada template literal dan penutupan tag strong
+        result.innerHTML = `Khodam Anda adalah: <strong>${khodam}</strong>`;
     } else {
         result.innerHTML = '<span style="color: red;">Silakan masukkan nama Anda!</span>';
     }
 });
 
 function checkKhodam(name) {
-    const khodams = ['Monyet Kayang', 'Pocong Busuk', 'Kunti Daster', 'Macan Goyang', 'Elang Mabok', 'Tuyul', 'Bebek Penyet', 'Buaya Darat']; // Perbaikan pada penugasan array
+    const khodams = ['Monyet Kayang', 'Pocong Busuk', 'Kunti Daster', 'Macan Goyang', 'Elang Mabok', 'Tuyul', 'Bebek Penyet', 'Buaya Darat', 'Macan Sumatera', 'Kuda Poni', 'Sandal Jepit', 'Zebra Sigma', 'Jembut Skibidi', 'Nekopoi', 'Roket Geprek'];
     const index = Math.floor(Math.random() * khodams.length);
     return khodams[index];
 }
diff --git a/index.html b/index.html
@@ -1,26 +1,37 @@
 <!DOCTYPE html>
 <html lang="en">
 <head>
-<meta charset="UTF-8">
-<meta name="viewport" content="width=device-width, initial-scale=1.0">
-<title>Cek Khodam</title>
-<link rel="stylesheet" href="style.css">
-<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/
-font-awesome/5.0.0-beta3/css/all.min.css">
-<link href="https://fonts.googleapis.com/css?family=Poppins:wght@300;
-400;600&display=swap" rel="stylesheet">
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>Cek Khodam</title>
+    <link rel="stylesheet" href="style.css">
+    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.0.0-beta3/css/all.min.css">
+    <link href="https://fonts.googleapis.com/css?family=Poppins:wght@300;400;600&display=swap" rel="stylesheet">
 </head>
 <body>
 
 <div class="container">
-<h1><i class="fas fa-magic"></i> Cek Khodam Anda</h1>
-<div class="form-group">
-<label for="name">Masukkan Nama Anda: </label>
-<input type="text" id="name" placeholder="Nama Anda">
-</div>
-<button id="checkButton"><i class="fas fa-search"></i> Cek Khodam</button>
-<div id="result" class="result"></div>
+    <h1><i class="fas fa-magic"></i> Cek Khodam</h1>
+    <div class="form-group">
+        <label for="name">Masukkan Nama Anda: </label>
+        <input type="text" id="name" placeholder="Nama Anda">
+    </div>
+
+    <button id="checkButton"><i class="fas fa-search"></i> Cek Khodam</button>
+
+    <div id="result" class="result"></div>
+
+    <footer>
+        <h2 style="text-align: center;">&copy; 2023 DICKO DEV. All Rights Reserved.</h2>
+        <div style="text-align: center;">
+            <a href="https://www.instagram.com/dckoalvinoww/" target="_blank" style="text-decoration: none; color: #E1306C;">
+                <i class="fab fa-instagram" style="font-size: 24px;"></i>
+                <span style="font-size: 20px;">@dckoalvinoww</span>
+            </a>
+        </div>
+    </footer>
 </div>
+
 <script src="Khodam.js"></script>
 </body>
 </html>
diff --git a/style.css b/style.css
@@ -1,128 +1,82 @@
 body {
-font-family: 'Poppins', sans-serif;
-background: linear-gradient(135deg, #6e8efb, #a777e3);
-margin: 0;
-padding: 0;
-display: flex;
-justify-content: center;
-align-items: center;
-height: 100vh;
+    background-color: #1e1e1e; /* Warna latar belakang gelap */
+    color: #ffffff; /* Warna teks putih */
+    font-family: 'Poppins', sans-serif; /* Menggunakan font Poppins */
+    display: flex;
+    justify-content: center;
+    align-items: center;
+    height: 100vh;
+    margin: 0;
+    overflow: hidden;
 }
 
 .container {
-background-color: #fff;
-padding: 30px;
-border-radius: 15px;
-box-shadow: 0 10px 30px rgba(0, 0, 0, 0.1);
-text-align: center;
-width: 350px;
+    background-color: #2b2b2b; /* Latar belakang kontainer */
+    border: 2px solid #4a4a4a; /* Garis tepi */
+    border-radius: 10px; /* Sudut melengkung */
+    padding: 20px;
+    box-shadow: 0 0 20px rgba(0, 0, 0, 0.5); /* Efek bayangan */
+    width: 300px; /* Lebar kontainer */
+}
 
 h1 {
-color: #333;
-margin-bottom: 20px;
-font-size: 28p
+    text-align: center;
+    font-size: 24px; /* Ukuran font judul */
 }
-input
-
-width: 90%;
-
-padding: 12px;
-
-border: 1px solid #ddd;
-
-border-radius: 5px;
-
-font-size: 16px;
-
-button {
-
-background-color: #6e8efb;
-
-color: #fff;
-
-border: none;
-
-padding: 12px 20px;
-
-border-radius: 5px;
-
-cursor: pointer;
-
-font-size: 16px;
-
-font-weight: 500;
-
-transition: background-color 0.3s, transform 0.3s;
 
+.form-group {
+    margin-bottom: 15px; /* Jarak bawah untuk form group */
 }
 
-button:hover {
-
-background-color:#5a76e3;
-
-transform: translateY(-2px);
-
+label {
+    display: block; /* Menjadikan label sebagai blok */
+    margin-bottom: 5px; /* Jarak bawah untuk label */
 }
 
-.result {
-
-margin-top: 20px;
-
-font-size: 18px;
-
-color: #333;
-
-font-weight: 500;
-
+input[type="text"] {
+    width: 100%; /* Lebar input penuh */
+    padding: 10px; /* Padding dalam input */
+    border: none; /* Tanpa garis tepi */
+    border-radius: 5px; /* Sudut melengkung input */
+    background-color: #444; /* Latar belakang input */
+    color: #fff; /* Teks input putih */
 }
 
-.result strong {
-
-color: #6e8efb;
-
-}font-weight: 600;
+input[type="text"]:focus {
+    outline: none; /* Menghilangkan outline saat fokus */
+    background-color: #555; /* Latar belakang saat fokus */
 }
 
-.form-group {
-margin-bottom: 20px;
+button {
+    width: 100%; /* Lebar tombol penuh */
+    padding: 10px; /* Padding dalam tombol */
+    border: none; /* Tanpa garis tepi */
+    border-radius: 5px; /* Sudut melengkung tombol */
+    background-color: #e1306c; /* Warna latar belakang tombol */
+    color: white; /* Teks tombol putih */
+    font-size: 16px; /* Ukuran font tombol */
+    cursor: pointer; /* Pointer saat hover */
 }
 
-label {
-display: block;
-margin-bottom: 10px;
-color: #555;
-font-weight: 500;
+button:hover {
+    background-color: #d0205c; /* Warna saat hover */
 }
 
-input {
-width: 90%;
-padding: 12px;
-border: 1px solid #ddd;
-border-radius: 5px;
-font-size: 16px;
+.result {
+    margin-top: 15px; /* Jarak atas untuk hasil */
+    padding: 10px;
+    background-color: #333; /* Latar belakang hasil */
+    border-radius: 5px; /* Sudut melengkung hasil */
+}
 
-button {
-background-color: #6e8efb;
-color: #fff;
-border: none;
-padding: 12px 20px;
-border-radius: 5px;
-cursor: pointer;
-font-size: 16px;
-font-weight: 500;
-transition: background-color 0.3s, transform 0.3s;
+footer {
+    margin-top: 20px;
 }
 
-button:hover {
-background-color:#5a76e3;
-transform: translateY(-2px);
+footer h2 {
+    font-size: 14px; /* Ukuran font footer */
 }
 
-.result {
-margin-top: 20px;
-font-size: 18px;
-color: #333;
-font-weight: 500;
-.result strong {
-color: #6e8efb;
+footer a {
+    color: #E1306C; /* Warna tautan di footer */
 }