Skip to content

Commit 5b2d797

Browse files
Fathi7maFathi7ma
authored
Merge branch 'main' into feature
2 parents 7bdaba9 + d1752f7 commit 5b2d797

File tree

254 files changed

+59445
-819
lines changed

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

254 files changed

+59445
-819
lines changed

‎.DS_Store‎

18 KB
Binary file not shown.

‎.vscode/settings.json‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,3 +1,3 @@
11
{
2-
"liveServer.settings.port": 5501
2+
"liveServer.settings.port": 5502
33
}

‎2048 Game/README.md‎

Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -21,3 +21,6 @@ I coded this game by following the tutorial from [Code with Ania Kubów](https:/
2121
# Screenshot
2222

2323
![screenshot](https://github.com/Gyynnn/Web-dev-mini-projects/blob/2048game/2048%20Game/screenshot.PNG)
24+
25+
# For Further
26+
This game is there in the playstore fdo checkout (https://github.com/Ayushparikh-code/Web-dev-mini-projects)

‎AI Quote Generator/index.html‎

Lines changed: 21 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,21 @@
1+
<!DOCTYPE html>
2+
<html lang="en">
3+
<head>
4+
<meta charset="UTF-8">
5+
<meta name="viewport" content="width=device-width, initial-scale=1.0">
6+
<title>AI Quotes Generator</title>
7+
<link rel="stylesheet" href="styles.css">
8+
</head>
9+
<body>
10+
<header>
11+
<h1>AI Quotes Generator</h1>
12+
</header>
13+
<div class="container">
14+
<div id="quoteContainer">
15+
<p id="quoteText"></p>
16+
</div>
17+
<button id="getQuoteBtn" style="background-color: 3498db;">Get Quote</button>
18+
</div>
19+
<script src="script.js"></script>
20+
</body>
21+
</html>

‎AI Quote Generator/script.js‎

Lines changed: 28 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,28 @@
1+
const getQuoteBtn = document.getElementById("getQuoteBtn");
2+
const quoteText = document.getElementById("quoteText");
3+
4+
getQuoteBtn.addEventListener("click", () => {
5+
getQuoteBtn.classList.add("loading");
6+
getQuoteBtn.textContent = "Loading...";
7+
getQuote();
8+
});
9+
10+
// Initially, remove loading state
11+
getQuoteBtn.classList.remove("loading");
12+
getQuoteBtn.textContent = "Get Quote";
13+
14+
function getQuote() {
15+
fetch("https://api.quotable.io/random")
16+
.then((response) => response.json())
17+
.then((data) => {
18+
quoteText.innerHTML = `"${data.content}" - ${data.author}`;
19+
getQuoteBtn.classList.remove("loading");
20+
getQuoteBtn.textContent = "Get Quote";
21+
})
22+
.catch((error) => {
23+
console.error("Error fetching quote:", error);
24+
quoteText.innerHTML = "Failed to fetch a quote. Please try again later.";
25+
getQuoteBtn.classList.remove("loading");
26+
getQuoteBtn.textContent = "Get Quote";
27+
});
28+
}

‎AI Quote Generator/styles.css‎

Lines changed: 56 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,56 @@
1+
body {
2+
font-family: Arial, sans-serif;
3+
background-color: #3498db;
4+
margin: 0;
5+
padding: 0;
6+
display: flex;
7+
flex-direction: column;
8+
align-items: center;
9+
justify-content: flex-start; /* Adjusted to align header at the top */
10+
height: 100vh;
11+
}
12+
13+
header {
14+
background-color: #2c3e50;
15+
color: #ecf0f1;
16+
text-align: center;
17+
padding: 10px;
18+
width: 100%;
19+
}
20+
21+
.container {
22+
text-align: center;
23+
background-color: #fff;
24+
padding: 20px;
25+
margin-left: 2%;
26+
margin-right: 2%;
27+
border-radius: 5px;
28+
box-shadow: 0 0 10px rgba(0, 0, 0, 0.2);
29+
}
30+
31+
button {
32+
padding: 10px 20px;
33+
font-size: 18px;
34+
cursor: pointer; /* Set default cursor to pointer */
35+
background-color: #3498db; /* Default background color */
36+
color: #fff;
37+
border: none;
38+
border-radius: 5px;
39+
transition: background-color 0.3s, transform 0.3s, filter 0.3s;
40+
}
41+
42+
button.loading {
43+
background-color: #ddd;
44+
cursor: not-allowed;
45+
}
46+
47+
button:hover {
48+
background-color: #2980b9;
49+
transform: scale(1.05); /* Zoom in effect on hover */
50+
filter: brightness(0.9); /* Darken the button on hover */
51+
}
52+
53+
#quoteContainer {
54+
margin-top: 20px;
55+
font-size: 20px;
56+
}

‎Age Calculator/index.html‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -10,7 +10,7 @@
1010
<body>
1111
<div class="container">
1212
<p id="currDate"> </p>
13-
<p>Enter the DOB in format : (MM/DD/YYYY)</p>
13+
<p>Enter the DOB badri in format : (MM/DD/YYYY)</p>
1414
<input type="text" placeholder="Enter your D.O.B" id="DOB">
1515
<button id="CalcAge">Age</button>
1616
</div>
@@ -20,4 +20,4 @@
2020
<script src="script.js">
2121
</script>
2222
</body>
23-
</html>
23+
</html>

‎Amazon-Prime-Login-Page-Clone/index.html‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -5,7 +5,7 @@
55
<meta charset="UTF-8">
66
<meta http-equiv="X-UA-Compatible" content="IE=edge">
77
<meta name="viewport" content="width=device-width, initial-scale=1.0">
8-
<title>Welcome to Prime Video</title>
8+
<title>Welcome to Prime Videos</title>
99
<link rel="stylesheet" href="index.css">
1010
<script src="https://code.iconify.design/1/1.0.7/iconify.min.js"></script>
1111
</head>

‎Animated Car/1‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1 @@
1+
kmgkrsgmkfdsmkgmnrd

‎Animated-rainbow/README.md‎

Lines changed: 28 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,28 @@
1+
### Animated-Rainbow
2+
3+
It's a simple animated Rainbow without using Javascript..
4+
5+
6+
### Used Technologies
7+
* HTML5
8+
* CSS3
9+
10+
11+
12+
#### Steps to Use:
13+
14+
---
15+
16+
- Download or clone the repository
17+
18+
```
19+
git clone https://github.com/VaibhavSuryavanshi93/Web-dev-mini-projects.git
20+
```
21+
22+
- Go to the directory
23+
- Run the Rainbow.html file
24+
25+
26+
## Screenshots
27+
![Rainbow](rainbow.png)
28+
![Default View](rainbow.png)

0 commit comments

Comments
 (0)