Skip to content

Commit a58cd72

Browse files
AnuragC07AnuragC07
authored
Merge branch 'thinkswell:master' into ReactPasswordGenerator/AnuragC07
2 parents 28338d0 + 61cc342 commit a58cd72

File tree

25 files changed

+1745
-5
lines changed

25 files changed

+1745
-5
lines changed

‎ExpandableCards/Nchhabra25/Readme.md‎

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,2 @@
1+
# Expandable Cards
2+
![image](https://github.com/Nchhabra25/Gradient-Generator/assets/124149051/b55053a9-b686-43cc-8cae-19b3c43e0467)

‎ExpandableCards/Nchhabra25/index.html‎

Lines changed: 29 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,29 @@
1+
<!DOCTYPE html>
2+
<html lang="en">
3+
<head>
4+
<meta charset="UTF-8">
5+
<meta http-equiv="X-UA-Compatible" content="IE=edge">
6+
<meta name="viewport" content="width=device-width, initial-scale=1.0">
7+
<link rel="stylesheet" href="style.css">
8+
<title>Document</title>
9+
</head>
10+
<body>
11+
<h1>Welcome</h1>
12+
<h3>Click on one of these cards</h3>
13+
<section class="main">
14+
<div class="cards active" id="pvt1">
15+
<h3>stars</h3>
16+
</div>
17+
<div class="cards" id="pvt2">
18+
<h3>beaches</h3>
19+
</div>
20+
<div class="cards" id="pvt3">
21+
<h3>clouds</h3>
22+
</div>
23+
<div class="cards" id="pvt4">
24+
<h3>scenery</h3>
25+
</div>
26+
</section>
27+
<script src="script.js"></script>
28+
</body>
29+
</html>

‎ExpandableCards/Nchhabra25/script.js‎

Lines changed: 12 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,12 @@
1+
const cards=document.querySelectorAll(".cards");
2+
3+
cards.forEach(cards=>{
4+
cards.addEventListener('click',()=>{
5+
cards.classList.toggle('active');
6+
})
7+
})
8+
function remove(){
9+
cards.forEach(cards=>{
10+
cards.classList.remove('active');
11+
})
12+
}

‎ExpandableCards/Nchhabra25/style.css‎

Lines changed: 70 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,70 @@
1+
body{
2+
background: radial-gradient(at left, #81e8f2, #f8bbc5);
3+
}
4+
h1,h3{
5+
text-align: center;
6+
font-family: 'Times New Roman', Times, serif;
7+
color: #202020;
8+
font-size: 2.2rem;
9+
}
10+
.cards{
11+
/*border:2px solid red;*/
12+
margin: 1.5em;
13+
height: 50vh;
14+
width: 5vw;
15+
border-radius: 38px;
16+
display: flex;
17+
align-items: flex-end;
18+
transition: 0.5s ease-out;
19+
}
20+
.cards:hover{
21+
cursor: pointer;
22+
box-shadow: inset 0 0 0 1000px rgba(0, 0, 0, 0.13);
23+
}
24+
.main{
25+
display: flex;
26+
flex-direction: row;
27+
align-items: center;
28+
justify-content: center;
29+
}
30+
.cards h3{
31+
color:white;
32+
font-weight: bold;
33+
position:relative;
34+
left: 10px;
35+
opacity: 0;
36+
transition: 0.5s ease-out;
37+
}
38+
.cards.active{
39+
width:20vw;
40+
transition: 0.5s ease-out;
41+
}
42+
.cards.active h3{
43+
opacity: 1;
44+
transition: 0.5s ease-out;
45+
}
46+
#pvt1{
47+
background-image: url('https://images.unsplash.com/photo-1558979158-65a1eaa08691?ixlib=rb-1.2.1&ixid=eyJhcHBfaWQiOjEyMDd9&auto=format&fit=crop&w=1350&q=80');
48+
}
49+
#pvt2{
50+
background-image: url('https://images.unsplash.com/photo-1572276596237-5db2c3e16c5d?ixlib=rb-1.2.1&ixid=eyJhcHBfaWQiOjEyMDd9&auto=format&fit=crop&w=1350&q=80');
51+
}
52+
#pvt3{
53+
background-image: url('https://images.unsplash.com/photo-1507525428034-b723cf961d3e?ixlib=rb-1.2.1&ixid=eyJhcHBfaWQiOjEyMDd9&auto=format&fit=crop&w=1353&q=80');
54+
}
55+
#pvt4{
56+
background-image: url('https://images.unsplash.com/photo-1549880338-65ddcdfd017b?ixlib=rb-1.2.1&ixid=eyJhcHBfaWQiOjEyMDd9&auto=format&fit=crop&w=1350&q=80');
57+
}
58+
@media(max-width:680px){
59+
.main{
60+
flex-direction: column;
61+
}
62+
.cards{
63+
width:80vw;
64+
height: 10vh;
65+
}
66+
.cards.active{
67+
width:80vw;
68+
height:40vh;
69+
}
70+
}

‎MovieInfoApp/Paulie-Aditya/index.html‎

Lines changed: 23 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,23 @@
1+
<!DOCTYPE html>
2+
<html lang="en">
3+
<head>
4+
<meta charset="UTF-8">
5+
<meta http-equiv="X-UA-Compatible" content="IE=edge">
6+
<meta name="viewport" content="width=device-width, initial-scale=1.0">
7+
<title>Movie Ratings</title>
8+
<link rel="stylesheet" href="style.css">
9+
</head>
10+
<body>
11+
12+
<div class="container">
13+
<h1>Movie Ratings based on IMDb</h1>
14+
<div class="row">
15+
<form onsubmit="fun(event)">
16+
<input type="text" name="name" id="name" required placeholder="Enter movie name and click Enter" >
17+
</form>
18+
<div id="container_1"></div>
19+
</div>
20+
</div>
21+
</body>
22+
<script src="script.js"></script>
23+
</html>

‎MovieInfoApp/Paulie-Aditya/script.js‎

Lines changed: 52 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,52 @@
1+
function fun(e)
2+
{
3+
var search=document.getElementById("name").value;
4+
fetch(`https://www.omdbapi.com/?t=${search}&apikey=16ba5256`)
5+
.then(response => response.json())
6+
.then(data => {
7+
var s = `<table border="2">
8+
<thead>
9+
<h2 align="center">Movie Data</h2>
10+
</thead>
11+
<tbody>
12+
<tr>
13+
<td>Movie Name</td>
14+
<td>${data.Title}</td>
15+
</tr>
16+
<tr>
17+
<td>Released date</td>
18+
<td>${data.Released}</td>
19+
</tr>
20+
<tr>
21+
<td>Genre</td>
22+
<td>${data.Genre}</td>
23+
</tr>
24+
<tr>
25+
<td>Actors</td>
26+
<td>${data.Actors}</td>
27+
</tr>
28+
<tr>
29+
<td>Director</td>
30+
<td>${data.Director}</td>
31+
</tr>
32+
<tr>
33+
<td>Short Note</td>
34+
<td>${data.Plot}</td>
35+
</tr>
36+
<tr>
37+
<td>Poster</td>
38+
<td>
39+
<img src=${data.Poster} alt=${data.Title} />
40+
</td>
41+
</tr>
42+
<tr>
43+
<td>IMDb Rating</td>
44+
<td>${data.imdbRating}</td>
45+
</tr>
46+
</tbody>
47+
</table>`;
48+
document.getElementById("container_1").innerHTML = s;
49+
})
50+
.catch(error => console.log('error', error));
51+
e.preventDefault();
52+
}

‎MovieInfoApp/Paulie-Aditya/style.css‎

Lines changed: 17 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,17 @@
1+
.container{
2+
display: block;
3+
text-align: center;
4+
}
5+
input{
6+
padding: 20px;
7+
margin: 20px;
8+
border-radius: 7px;
9+
color: blue;
10+
}
11+
input::placeholder{
12+
color: red;
13+
}
14+
*{
15+
font-weight: bold;
16+
letter-spacing: 0.1rem;
17+
}

‎RandomQuote/AckermanLevi1/index.css‎

Lines changed: 34 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -8,6 +8,8 @@ q {
88

99
body {
1010
margin: 0;
11+
color: #ffffff;
12+
text-align: center;
1113
width: 100%;
1214
height: 100vh;
1315
background: linear-gradient(-45deg, #ee7752, #e73c7e, #23a6d5, #23d5ab);
@@ -31,38 +33,65 @@ q {
3133
width: 100%;
3234
height: 100%;
3335
display: flex;
34-
justify-content: center;
36+
flex-direction: column;
37+
justify-content: space-evenly;
3538
align-items: center;
3639
}
40+
41+
.glow {
42+
margin-bottom: 20px;
43+
font-size: 40px;
44+
font-weight: 900;
45+
animation: glowText 1s ease-in-out infinite alternate
46+
}
47+
3748

49+
@keyframes glowText {
50+
from {
51+
text-shadow: 0 0 10px #fff, 0 0 20px #fff, 0 0 30px #e60073, 0 0 40px #e60073, 0 0 50px #e60073, 0 0 60px #e60073, 0 0 70px #e60073;
52+
}
53+
to {
54+
text-shadow: 0 0 20px #fff, 0 0 30px #ff4da6, 0 0 40px #ff4da6, 0 0 50px #ff4da6, 0 0 60px #ff4da6, 0 0 70px #ff4da6, 0 0 80px #ff4da6;
55+
}
56+
}
3857
.quote-area {
3958
display: flex;
4059
flex-direction: column;
60+
align-items: center;
4161
background: #fff;
4262
max-width: 600px;
4363
box-sizing: border-box;
4464
padding: 20px;
4565
box-shadow: 0 3px 6px rgba(0,0,0,0.16), 0 3px 6px rgba(0,0,0,0.23);
66+
border: 2px solid #23c6b9;
4667
}
4768

69+
#quote {
70+
font-size: 20px;
71+
}
4872
#quoteAuthor {
49-
padding: 20px 0;
73+
padding: 5px 0;
74+
font-size: 22px;
75+
font-weight: 500;
5076
}
5177

5278
button {
5379
max-width: 200px;
54-
text-align: center;
80+
/* text-align: center; */
5581
line-height: 1.3em;
5682
margin-bottom: 10px;
5783
border: none;
5884
background: #23c6b9;
59-
color: #fff;
6085
font-weight: 900;
6186
padding: 10px;
6287
letter-spacing: .6px;
6388
cursor: pointer;
6489
}
65-
90+
#tweetbtn {
91+
max-width: 200px; ;
92+
margin: auto;
93+
border-radius: 8px;
94+
}
6695
/* Reduce motion options. If on then background is static */
6796
@media (prefers-reduced-motion: reduce) {
6897
body {

‎RandomQuote/AckermanLevi1/index.html‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -8,6 +8,7 @@
88
</head>
99
<body>
1010
<div class="container">
11+
<h1 class="glow">Random Quote Generator</h1>
1112
<div class="quote-area">
1213
<div id="quote">
1314
<q id="quoteText">Finish each day and be done with it. You have done what you could. Some blunders and absurdities no doubt crept in; forget them as soon as you can. Tomorrow is a new day. You shall begin it serenely and with too high a spirit to be encumbered with your old nonsense.</q>

‎ToDoList/0kt1/README.md‎

Lines changed: 19 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,19 @@
1+
# JavaScript Todo Notes App
2+
3+
A ToDo App using NodeJs and MongDb.
4+
5+
This is a simple JavaScript-based Todo Notes app that allows users to add, edit, and delete tasks. Additionally, it utilizes local storage to persist the tasks even after the user closes the browser.
6+
7+
## Features
8+
9+
- User can input tasks to be done.
10+
- The tasks are displayed in the user interface.
11+
- User can delete and edit tasks.
12+
13+
## Screenshots
14+
15+
![App Screenshot 1](images/screenshot1.png)
16+
17+
18+
![App Screenshot 2](images/screenshot2.png)
19+

0 commit comments

Comments
 (0)