added secret idea.todo
|
Before Width: | Height: | Size: 145 B |
|
Before Width: | Height: | Size: 148 B |
|
Before Width: | Height: | Size: 146 B |
|
Before Width: | Height: | Size: 149 B |
|
Before Width: | Height: | Size: 156 B |
|
Before Width: | Height: | Size: 149 B |
@@ -1,32 +0,0 @@
|
|||||||
<!DOCTYPE html>
|
|
||||||
<html>
|
|
||||||
<head>
|
|
||||||
<meta charset="UTF-8">
|
|
||||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
|
||||||
|
|
||||||
<link rel="stylesheet" href="style.css">
|
|
||||||
<link rel="shortcut icon" href="./icon.png" type="image/x-icon">
|
|
||||||
|
|
||||||
<title>Quess Number 1D6</title>
|
|
||||||
</head>
|
|
||||||
<body>
|
|
||||||
<article class="gameBack">
|
|
||||||
<h1>Guess The Number!</h1>
|
|
||||||
<h3>You are: <span id="answear"></span></h3>
|
|
||||||
<img src="./6.png" alt="" id="dice">
|
|
||||||
<div class="ques">
|
|
||||||
<h3 class="que">Quessing:</h3>
|
|
||||||
<select id="num">
|
|
||||||
<option value="1">1</option>
|
|
||||||
<option value="2">2</option>
|
|
||||||
<option value="3">3</option>
|
|
||||||
<option value="4">4</option>
|
|
||||||
<option value="5">5</option>
|
|
||||||
<option value="6">6</option>
|
|
||||||
</select>
|
|
||||||
</div>
|
|
||||||
<button onclick="roll()">Roll<br>the<br>Dice!</button>
|
|
||||||
</article>
|
|
||||||
<script src="main.js"></script>
|
|
||||||
</body>
|
|
||||||
</html>
|
|
||||||
@@ -1,17 +0,0 @@
|
|||||||
const dice = document.querySelector('#dice'); //img
|
|
||||||
let answear = document.querySelector('#answear'); //text ans
|
|
||||||
let number = document.querySelector('#num'); //num selec
|
|
||||||
|
|
||||||
function roll(){
|
|
||||||
let newDice = Math.floor(Math.random()*6);
|
|
||||||
|
|
||||||
console.log(newDice);
|
|
||||||
|
|
||||||
dice.src = `./${newDice+1}.png`;
|
|
||||||
|
|
||||||
if(number.value == newDice+1){
|
|
||||||
answear.innerHTML = `<p class='won'>Correct! +10 coins</p>`;
|
|
||||||
}else{
|
|
||||||
answear.innerHTML = `<p class='lose'>Wrong!</p>`
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
Before Width: | Height: | Size: 2.8 MiB |
|
Before Width: | Height: | Size: 2.8 MiB |
@@ -1,99 +0,0 @@
|
|||||||
*{
|
|
||||||
margin: 0;
|
|
||||||
padding: 0;
|
|
||||||
box-sizing: border-box;
|
|
||||||
}
|
|
||||||
body{
|
|
||||||
display: flex;
|
|
||||||
justify-content: center;
|
|
||||||
align-items: center;
|
|
||||||
flex-direction: column;
|
|
||||||
min-height: 100vh;
|
|
||||||
background-color: #333;
|
|
||||||
background-image: url("./pc.jpg");
|
|
||||||
background-repeat: no-repeat;
|
|
||||||
background-position: center;
|
|
||||||
background-size: cover;
|
|
||||||
color: #fff;
|
|
||||||
text-align: center;
|
|
||||||
}
|
|
||||||
|
|
||||||
img{
|
|
||||||
width: 100px;
|
|
||||||
height: 100px;
|
|
||||||
margin: 1.25rem;
|
|
||||||
border-radius: 15px;
|
|
||||||
filter: drop-shadow(1.5px 1.5px 6px #aaa);
|
|
||||||
}
|
|
||||||
h1{
|
|
||||||
filter: drop-shadow(1.5px 1.5px 6px #333);
|
|
||||||
}
|
|
||||||
h3{
|
|
||||||
filter: drop-shadow(1.5px 1.5px 6px #333);
|
|
||||||
}
|
|
||||||
.ques{
|
|
||||||
display: flex;
|
|
||||||
flex-direction: row;
|
|
||||||
}
|
|
||||||
.ques p{
|
|
||||||
margin-right: .5rem;
|
|
||||||
filter: drop-shadow(1.5px 1.5px 6px #333);
|
|
||||||
}
|
|
||||||
.ques select{
|
|
||||||
border: none;
|
|
||||||
background: none;
|
|
||||||
border-radius: 7px;
|
|
||||||
backdrop-filter: blur(10px);
|
|
||||||
box-shadow:
|
|
||||||
inset 1.5px 1.5px 3px #fff,
|
|
||||||
10px 10px 20px #333;
|
|
||||||
}
|
|
||||||
|
|
||||||
button{
|
|
||||||
text-transform: uppercase;
|
|
||||||
height: 69px;
|
|
||||||
width: 69px;
|
|
||||||
margin-top: 1rem;
|
|
||||||
border-radius: 10px;
|
|
||||||
border: none;
|
|
||||||
background: none;
|
|
||||||
color: #fff;
|
|
||||||
text-shadow: 2px 2px 2.5px #333;
|
|
||||||
/*filter: drop-shadow(10px 10px 20px #333);*/
|
|
||||||
backdrop-filter: blur(10px);
|
|
||||||
box-shadow:
|
|
||||||
inset 2.5px 2.5px 5px #fff,
|
|
||||||
10px 10px 20px #333;
|
|
||||||
}
|
|
||||||
.que{
|
|
||||||
margin-right: 1rem;
|
|
||||||
}
|
|
||||||
.won{
|
|
||||||
color: lime;/*
|
|
||||||
text-transform: uppercase;*/
|
|
||||||
}
|
|
||||||
.lose{
|
|
||||||
color: red;/*
|
|
||||||
text-transform: uppercase;*/
|
|
||||||
}
|
|
||||||
|
|
||||||
.gameBack{
|
|
||||||
padding: 1rem;
|
|
||||||
height: 450px;
|
|
||||||
width: 300px;
|
|
||||||
display: flex;
|
|
||||||
justify-content: space-around;
|
|
||||||
align-items: center;
|
|
||||||
flex-direction: column;
|
|
||||||
backdrop-filter: blur(5px);
|
|
||||||
border-radius: 50px;
|
|
||||||
box-shadow:
|
|
||||||
inset 10px 10px 20px #fff,
|
|
||||||
10px 10px 20px #333;
|
|
||||||
}
|
|
||||||
|
|
||||||
@media screen and (max-width: 500px){
|
|
||||||
body{
|
|
||||||
background-image: url("./mobile.jpg");
|
|
||||||
}
|
|
||||||
}
|
|
||||||
4
Games/idea.todo
Normal file
@@ -0,0 +1,4 @@
|
|||||||
|
5 dices - WAR, WAR NEVER CHANGES (Done 100%)
|
||||||
|
6 dices - Counting (Done 0%)
|
||||||
|
1 dice - quess (Done 100%)
|
||||||
|
Without money
|
||||||
