Skip to content

Commit 5d0d4a3

Browse files
Mayur-666Mayur-666
authored
Merge branch 'TusharKesarwani:main' into sidebranch
2 parents 449b320 + b3ac80a commit 5d0d4a3

17 files changed

Lines changed: 537 additions & 65 deletions

File tree

‎Projects/3D Rotating Cube/README.md‎

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,2 @@
1+
### A 3D rotating cube
2+
Created a 3D rotating cube using HTML, CSS, and JavaScript. The end result will be an interactive cube that rotates in 3D space.

‎Projects/3D Rotating Cube/index.html‎

Lines changed: 26 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,26 @@
1+
<!DOCTYPE html>
2+
<html>
3+
<head>
4+
<title>Modern Rotating 3D Cube Animation</title>
5+
<link rel="stylesheet" href="styles.css">
6+
</head>
7+
<body>
8+
<div class="container">
9+
<div class="cube">
10+
<div class="face front">
11+
</div>
12+
<div class="face back">
13+
</div>
14+
<div class="face right">
15+
</div>
16+
<div class="face left">
17+
18+
</div>
19+
<div class="face top">
20+
</div>
21+
<div class="face bottom">
22+
</div>
23+
</div>
24+
</div>
25+
</body>
26+
</html>

‎Projects/3D Rotating Cube/styles.css‎

Lines changed: 73 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,73 @@
1+
body {
2+
background: linear-gradient(to bottom right, #18427d, #5d7ac4);
3+
height: 100vh;
4+
display: flex;
5+
align-items: center;
6+
justify-content: center;
7+
margin: 0;
8+
box-shadow: 0 20px 20px rgba(0, 0, 0, 0.2); /* Updated box-shadow */
9+
10+
}
11+
12+
.container {
13+
perspective: 800px;
14+
15+
}
16+
17+
.cube {
18+
width: 200px;
19+
height: 200px;
20+
position: relative;
21+
transform-style: preserve-3d;
22+
animation: rotate 6s infinite linear;
23+
transform: rotateX(-20deg) rotateY(-30deg);
24+
background: linear-gradient(to bottom right, #695c29, #e67e22);
25+
}
26+
27+
.face {
28+
position: absolute;
29+
width: 200px;
30+
height: 200px;
31+
color: rgb(255, 255, 255);
32+
font-size: 24px;
33+
display: flex;
34+
align-items: center;
35+
justify-content: center;
36+
text-transform: uppercase;
37+
box-shadow: 0 2px 10px rgba(0, 0, 0, 0.2);
38+
}
39+
40+
.front {
41+
background: linear-gradient(to bottom right, #477422, #77f12c); transform: translateZ(100px);
42+
}
43+
44+
.back {
45+
background: linear-gradient(to bottom right, #105561, #0ed7e9); transform: translateZ(-100px) rotateY(180deg);
46+
}
47+
48+
.right {
49+
background: linear-gradient(to bottom right, #b8a249, #e67e22); transform: translateX(100px) rotateY(90deg);
50+
}
51+
52+
.left {
53+
background: linear-gradient(to bottom right, #3e8575, #13eca0); transform: translateX(-100px) rotateY(-90deg);
54+
}
55+
56+
.top {
57+
background: linear-gradient(to bottom right, #f1c40f, #e67e22); transform: translateY(-100px) rotateX(90deg);
58+
}
59+
60+
.bottom {
61+
background: linear-gradient(to bottom right, #d16725, #ce905a); transform: translateY(100px) rotateX(-90deg);
62+
}
63+
64+
65+
@keyframes rotate {
66+
0% {
67+
transform: rotateX(-20deg) rotateY(-30deg);
68+
}
69+
100% {
70+
transform: rotateX(340deg) rotateY(330deg);
71+
}
72+
}
73+

‎Projects/Bookcase/css/style.css‎

Lines changed: 3 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -8,7 +8,8 @@
88

99
html {
1010
scroll-behavior: smooth;
11-
11+
overflow-y: scroll;
12+
overflow-x: hidden;
1213
}
1314

1415
body {
@@ -399,7 +400,7 @@ footer {
399400
background: #B8A481;
400401
padding: 20px 23px;
401402
color: #fff;
402-
width: 100%;
403+
width: 102%;
403404
height: 60px;
404405
clear: both;
405406
}

‎Projects/Expense Tracker/index.html‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -8,7 +8,7 @@
88
<title>Expense Tracker</title>
99
</head>
1010
<body>
11-
<h2>Expense Tracker</h2>
11+
<h2>EXPENSE TRACKER</h2>
1212

1313
<div class="container">
1414
<h4>Your Balance</h4>

‎Projects/Expense Tracker/script.js‎

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -110,4 +110,5 @@ function init() {
110110

111111
init();
112112

113-
form.addEventListener('submit', addTransaction);
113+
form.addEventListener('submit', addTransaction);
114+

‎Projects/Expense Tracker/signup.html‎

Lines changed: 69 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,69 @@
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>Login Box</title>
8+
<link rel="stylesheet" href="stylelogin.css">
9+
</head>
10+
<body>
11+
<div class="container">
12+
<div class="wrapper">
13+
<div class="form-box login">
14+
<h2>Login</h2>
15+
<form action="index.html">
16+
<div class="input-box">
17+
<span class="icon"><ion-icon name="mail"></ion-icon></span>
18+
<input autocomplete="off" autofocus type="email" id="email1" required>
19+
<label>Email</label>
20+
</div>
21+
<div class="input-box">
22+
<span class="icon"><ion-icon name="lock-closed"></ion-icon></span>
23+
<input autocomplete="off" autofocus type="password" id="password1" required>
24+
<label>Password</label>
25+
</div>
26+
<div class="remember-forgot">
27+
<label><input type="checkbox">Remember me</label>
28+
<a href="#">Forgot Password?</a>
29+
</div>
30+
<button type="submit" class="btn">Login</button>
31+
<div class="login-register">
32+
<p>Don't have an account? <a href="#" class="register-link">Register</a></p>
33+
</div>
34+
</form>
35+
</div>
36+
37+
<div class="form-box register">
38+
<h2>Registration</h2>
39+
<form action="#" onsubmit="register()">
40+
<div class="input-box">
41+
<span class="icon"><ion-icon name="person"></ion-icon></span>
42+
<input autocomplete="off" autofocus type="text" id="username" required>
43+
<label>Username</label>
44+
</div>
45+
<div class="input-box">
46+
<span class="icon"><ion-icon name="mail"></ion-icon></span>
47+
<input autocomplete="off" autofocus type="email" id="email" required>
48+
<label>Email</label>
49+
</div>
50+
<div class="input-box">
51+
<span class="icon"><ion-icon name="lock-closed"></ion-icon></span>
52+
<input autocomplete="off" autofocus type="password" id="password" required>
53+
<label>Password</label>
54+
</div>
55+
<div class="remember-forgot">
56+
<label><input type="checkbox">I agree to the terms and conditions</label>
57+
</div>
58+
<button type="submit" class="btn">Register</button>
59+
<div class="login-register">
60+
<p>Already have an account? <a href="#" class="login-link">Login</a></p>
61+
</div>
62+
</form>
63+
</div>
64+
</div>
65+
</div>
66+
67+
<script src="signup_script.js"></script>
68+
</body>
69+
</html>

‎Projects/Expense Tracker/signup_script.js‎

Lines changed: 16 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,16 @@
1+
const wrapper=document.querySelector('.wrapper');
2+
const loginLink=document.querySelector('.login-link');
3+
const registerLink=document.querySelector('.register-link');
4+
5+
registerLink.addEventListener('click',()=>{
6+
wrapper.classList.add('active');
7+
});
8+
9+
loginLink.addEventListener('click',()=>{
10+
wrapper.classList.remove('active');
11+
});
12+
13+
function register(){
14+
alert("You have registered succesfully.");
15+
wrapper.classList.remove('active');
16+
}

‎Projects/Expense Tracker/style.css‎

Lines changed: 5 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -23,11 +23,15 @@ body {
2323
.container {
2424
margin: 10px auto;
2525
width: 350px;
26+
border: 2px solid white;
27+
border-radius: 10px;
28+
padding: 5px 5px;
2629
}
2730

2831
h1 {
2932
letter-spacing: 1px;
3033
margin: 0;
34+
text-align: center;
3135
}
3236

3337
h3 {
@@ -39,6 +43,7 @@ h3 {
3943
h4 {
4044
margin: 0;
4145
text-transform: uppercase;
46+
text-align: center;
4247
}
4348

4449
.inc-exp-container {

0 commit comments

Comments
 (0)