Merge pull request #24 from billyrumbiak/main

Program
sacodeofficial · Jun 25, 2024 · 789220c · 789220c
2 parents 056d252 + f2f81f6
commit 789220c
Show file tree

Hide file tree

Showing 9 changed files with 105 additions and 0 deletions.
diff --git a/billy-aplikasi-acak-no/index.html b/billy-aplikasi-acak-no/index.html
@@ -0,0 +1,19 @@
+<!DOCTYPE html>
+<html lang="en">
+
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>Aplikasi Acak Nomor</title>
+    <link rel="stylesheet" href="style.css">
+</head>
+
+<body>
+
+    <button id="tombolSaya">Roll</button><br>
+    <label id="labelSaya"></label>
+    <script src="index.js"></script>
+
+</body>
+
+</html>
diff --git a/billy-aplikasi-acak-no/index.js b/billy-aplikasi-acak-no/index.js
@@ -0,0 +1,10 @@
+const tombolSaya = document.getElementById("tombolSaya");
+const labelSaya = document.getElementById("labelSaya");
+const min = 1;
+const max = 10;
+let nomorAcak;
+
+tombolSaya.onclick = function(){
+    nomorAcak = Math.floor(Math.random() * max) + min;
+    labelSaya.textContent = nomorAcak;
+}
diff --git a/billy-aplikasi-acak-no/style.css b/billy-aplikasi-acak-no/style.css
@@ -0,0 +1,12 @@
+body{
+    font-family: Verdana;
+    text-align: center;
+}
+#myButtons{
+    font-size: 3em;
+    padding: 5px 25px;
+    border-radius: 5px;
+}
+#myLabel{
+    font-size: 3em;
+}
diff --git a/billy-aplikasi-acak-nomor/index.html b/billy-aplikasi-acak-nomor/index.html
diff --git a/billy-aplikasi-acak-nomor/index.js b/billy-aplikasi-acak-nomor/index.js
diff --git a/billy-aplikasi-acak-nomor/style.css b/billy-aplikasi-acak-nomor/style.css
diff --git a/billy-aplikasi/index.html b/billy-aplikasi/index.html
@@ -0,0 +1,23 @@
+<!DOCTYPE html>
+<html lang="en">
+
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>Aplikasi Acak Nomor</title>
+    <link rel="stylesheet" href="style.css">
+</head>
+
+<body>
+
+    <label id="labelHitung">0</label><br>
+    <div id="btnContainer">
+        <button id="decreaseBtn" class="tombol">Decrease</button>
+        <button id="resetBtn" class="tombol">Reset</button>
+        <button id="increaseBtn" class="tombol">Increase</button>
+    </div>
+    <script src="index.js"></script>
+
+</body>
+
+</html>
diff --git a/billy-aplikasi/index.js b/billy-aplikasi/index.js
@@ -0,0 +1,20 @@
+const decreaseBtn = document.getElementById("decreaseBtn");
+const resetBtn = document.getElementById("resetBtn");
+const increaseBtn = document.getElementById("increaseBtn");
+const labelHitung = document.getElementById("labelHitung");
+let hitung = 0;
+
+increaseBtn.onclick = function(){
+    hitung++;
+    labelHitung.textContent = hitung;
+}
+
+decreaseBtn.onclick = function(){
+    hitung--;
+    labelHitung.textContent = hitung;
+}
+
+resetBtn.onclick = function(){
+    hitung = 0;
+    labelHitung.textContent = hitung;
+}
diff --git a/billy-aplikasi/style.css b/billy-aplikasi/style.css
@@ -0,0 +1,21 @@
+#labelHitung{
+    display: block;
+    text-align: center;
+    font-size: 10em;
+    font-family: Helvetica;
+}
+#btnContainer{
+    text-align: center;
+}
+.tombol{
+    padding: 10px 20px;
+    font-size: 1.5em;
+    color: white;
+    background-color: rgb(120, 122, 243);
+    border-radius: 10px;
+    cursor: pointer;
+    transition: background-color 0.25s;
+}
+.tombol:hover{
+    background-color: rgb(30, 34, 242);
+}