diff --git a/src/assets/Design/KNIGHTPIXLETPP.gif b/src/assets/Design/KNIGHTPIXLETPP.gif new file mode 100644 index 0000000..e772240 Binary files /dev/null and b/src/assets/Design/KNIGHTPIXLETPP.gif differ diff --git a/src/assets/Design/KnightPixLE2-exporgift.gif b/src/assets/Design/KnightPixLE2-exporgift.gif new file mode 100644 index 0000000..c39c3ab Binary files /dev/null and b/src/assets/Design/KnightPixLE2-exporgift.gif differ diff --git a/src/assets/Design/PYTHON-BOSSFIGHTMODEFINALt.gif b/src/assets/Design/PYTHON-BOSSFIGHTMODEFINALt.gif new file mode 100644 index 0000000..d6a9dde Binary files /dev/null and b/src/assets/Design/PYTHON-BOSSFIGHTMODEFINALt.gif differ diff --git a/src/assets/Design/wayland.png b/src/assets/Design/wayland.png new file mode 100644 index 0000000..52e458d Binary files /dev/null and b/src/assets/Design/wayland.png differ diff --git a/src/css/game.css b/src/css/game.css index e69de29..7de68cf 100644 --- a/src/css/game.css +++ b/src/css/game.css @@ -0,0 +1,124 @@ +.container-third .bg { + width: 100%; + height: 100dvh; +} + +.container-third .bg { + position: relative; +} + +.container-third .anm { + font-size: 100px; + background-size: cover; + position: absolute; + top: 100px; + text-align: center; + width: 100%; + display: none; +} + +.container-third .bg img { + width: 100%; + position: absolute; + bottom: 0; + image-rendering: pixelated; + background-repeat: no-repeat; + background-size: cover; +} + +.container-third .hero img { + width: 150px; + position: absolute; + bottom: 100px; + left: 50px; + image-rendering: pixelated; + background-repeat: no-repeat; + background-size: cover; +} + +.container-third .boss img { + width: 300px; + position: absolute; + bottom: 100px; + right: 50px; + image-rendering: pixelated; + background-repeat: no-repeat; + background-size: cover; +} + + +.container-first .content .boss { + width: 100%; + height: 100dvh; + position: relative; + animation: beat 2s infinite; + transform-origin: center; +} + +.container-first .content .boss img { + width: 600px; + position: absolute; + bottom: 100px; + left: 50%; + transform: translateX(-50%); + image-rendering: pixelated; + background-repeat: no-repeat; + background-size: cover; +} + +.container-first .content .text { + width: 1000px; + height: 200px; + bottom: 40px; + left: 50%; + transform: translateX(-50%); + background-color: #101010f5; + position: absolute; + display: flex; + justify-content: start; + text-align: center; + align-content: center; + padding: 10px; + display: flex; + flex-direction: column; + border-radius: 10px; + border: 10px solid white; + z-index: 1; +} + +.container-first .content .text p { + margin-bottom: 30px; + padding: 20px; + color: #ffdf12; + font-size: 50px; +} + +.container-first .content .text .opt { + color: #ffdf12; + display: flex; + justify-content: center; +} + +.container-first .content .text .opt p { + padding: 10px; + color: #ffdf12; + font-size: 30px; + background-color: #f7e62e34; + margin: 5px; + border-radius: 10px; + cursor: pointer; +} + +@keyframes beat { + 0% { + transform: scale(1); + } + + 50% { + transform: scale(0.95); + } + + 100% { + transform: scale(1); + } +} \ No newline at end of file diff --git a/src/game/firstperson.html b/src/game/firstperson.html index e69de29..2d9b8fe 100644 --- a/src/game/firstperson.html +++ b/src/game/firstperson.html @@ -0,0 +1,29 @@ + + + + + + firstperson + + + + +
+
+
+ +
+
+

selamat datang di python games _____

+
+

a. panteks

+

b. anjas

+

c. hell nah

+

d. my kisah

+
+
+
+
+ + + \ No newline at end of file diff --git a/src/game/thirdperson.html b/src/game/thirdperson.html index e69de29..af3e17e 100644 --- a/src/game/thirdperson.html +++ b/src/game/thirdperson.html @@ -0,0 +1,28 @@ + + + + + + thirdperson + + + + + +
+

PYTHON QUIZ GAME

+
+ bg +
+
+ +
+
+ +
+
+ + + + + \ No newline at end of file diff --git a/src/js/game.js b/src/js/firstperson.js similarity index 100% rename from src/js/game.js rename to src/js/firstperson.js diff --git a/src/js/thirdperson.js b/src/js/thirdperson.js new file mode 100644 index 0000000..04f6d61 --- /dev/null +++ b/src/js/thirdperson.js @@ -0,0 +1,36 @@ +const txt = document.getElementById('wellcome-message'); +const hero = document.getElementById('hero'); +const boss = document.getElementById('boss'); + +boss.style.transition = '2s cubic-bezier(0.4, 0, 0.2, 1)'; +hero.style.transition = '2s cubic-bezier(0.4, 0, 0.2, 1)'; +txt.style.transition = 'opacity .6s cubic-bezier(0.4, 0, 0.2, 1)'; +txt.style.opacity = '0'; +txt.style.display = 'block'; + + +setTimeout(() => { + txt.style.opacity = '1'; +}, 1000); + + +setTimeout(() => { + txt.style.opacity = '0'; + + setTimeout(() => { + txt.style.display = 'none'; +}, 400); +}, 5000); + +setTimeout(() => { + hero.style.left = '800px'; +}, 500); +setTimeout(() => { + boss.style.right = '700px'; +}, 500); + +setTimeout(()=> { + window.location.href = "/src/game/firstperson.html" +}, 7000) + +