Skip to content

Commit 3f3a39b

Browse files
Hello World!
1 parent aea67c7 commit 3f3a39b

File tree

8 files changed

+372
-5
lines changed

8 files changed

+372
-5
lines changed

contact.html

Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -14,6 +14,9 @@
1414
</head>
1515

1616
<body>
17+
<!-- Cursor Starts -->
18+
<div class="cursor"></div>
19+
<!-- Cursor Ends -->
1720
<!-- Loader screen -->
1821
<div class="se-pre-con"></div>
1922
<!-- Loader Screen Ends -->

css/style.css

Lines changed: 139 additions & 0 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

css/style.css.map

Lines changed: 1 addition & 1 deletion
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

css/style.scss

Lines changed: 82 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -6,13 +6,95 @@ body {
66
padding: 0;
77
color: #ffffff;
88
font-family: 'Ubuntu', sans-serif;
9+
background-color: #fafafa;
910
}
1011

1112
hr {
1213
border: 1px solid #000000;
1314
width: 20%;
1415
}
1516

17+
/* Cursor Starts */
18+
.cursor {
19+
width: 100px;
20+
height: 100px;
21+
border: 1px solid #fff;
22+
background-color: #fff;
23+
border-radius: 50%;
24+
position: absolute;
25+
pointer-events: none;
26+
transition-duration: 200ms;
27+
transition-timing-function: ease-out;
28+
animation: cursorAnim .5s infinite alternate;
29+
mix-blend-mode: exclusion;
30+
z-index: 9999999;
31+
}
32+
33+
.cursor::after {
34+
content: "";
35+
width: 100px;
36+
height: 100px;
37+
position: absolute;
38+
border: 8px solid gray;
39+
border-radius: 50%;
40+
opacity: .5;
41+
42+
animation: cursorAnim2 .5s infinite alternate;
43+
}
44+
45+
.contrast {
46+
animation: contrast .5s forwards;
47+
}
48+
49+
.expand {
50+
animation: expand .8s forwards;
51+
}
52+
53+
@keyframes cursorAnim {
54+
from {
55+
transform: scale(1);
56+
}
57+
58+
to {
59+
transform: scale(.7);
60+
}
61+
}
62+
63+
@keyframes cursorAnim2 {
64+
from {
65+
transform: scale(1);
66+
}
67+
68+
to {
69+
transform: scale(.1);
70+
}
71+
}
72+
73+
@keyframes expand {
74+
0% {
75+
transform: scale(.1);
76+
}
77+
78+
50% {
79+
transform: scale(1.2);
80+
}
81+
82+
100% {
83+
transform: scale(1);
84+
}
85+
}
86+
87+
@keyframes contrast {
88+
from {
89+
transform: scale(1);
90+
}
91+
92+
to {
93+
transform: scale(.1);
94+
}
95+
}
96+
97+
/* Cursor Ends*/
1698
/* Loader Screen */
1799
.se-pre-con {
18100
position: fixed;

cursor.html

Lines changed: 28 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,28 @@
1+
<!DOCTYPE html>
2+
<html lang="en">
3+
4+
<head>
5+
<meta charset="UTF-8">
6+
<meta name="viewport" content="width=device-width, initial-scale=1.0">
7+
<title>Document</title>
8+
<style>
9+
body {
10+
margin: 0;
11+
padding: 0;
12+
background-color: #000000;
13+
height: 100vh;
14+
}
15+
</style>
16+
</head>
17+
18+
<body>
19+
20+
<div style="color: wheat;">
21+
Hello World!
22+
</div>
23+
<script>
24+
25+
</script>
26+
</body>
27+
28+
</html>

index.html

Lines changed: 9 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -42,11 +42,15 @@
4242
<link rel="stylesheet" href="css/owl.carousel.min.css">
4343
<link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.8.1/css/all.css">
4444
<link rel="stylesheet" href="css/animate.min.css" />
45+
<link rel="stylesheet" href="css/kursor.css">
4546
<link rel="stylesheet" href="css/style.css">
4647
<link rel="stylesheet" href="css/responsive.css">
4748
</head>
4849

4950
<body>
51+
<!-- Cursor Starts -->
52+
<div class="cursor"></div>
53+
<!-- Cursor Ends -->
5054
<!-- Loader screen -->
5155
<div class="se-pre-con"></div>
5256
<!-- Loader Screen Ends -->
@@ -117,8 +121,8 @@ <h2>I Love Coding.</h2>
117121
</section>
118122
<!-- Header Ends -->
119123
<!-- About Me Starts -->
120-
<section>
121-
<div class="about" id="about">
124+
<section id="about">
125+
<div class="about">
122126
<div class="container">
123127
<div class="row">
124128
<div class="col-12">
@@ -155,8 +159,8 @@ <h2 class="wow animate__animated animate__zoomInUp">About Me</h2>
155159
</section>
156160
<!-- About Me Ends -->
157161
<!-- My Skills -->
158-
<section>
159-
<div class="skills" id="skills">
162+
<section id="skills">
163+
<div class="skills">
160164
<div class="container-fluid">
161165
<div class="row">
162166
<div class="col-12">
@@ -297,6 +301,7 @@ <h3 class="text-light">
297301
Gaurav Gupta &copy;2019
298302
</div>
299303
</section>
304+
<!-- Footer Ends -->
300305
<script type="application/ld+json">
301306
{
302307
"@context": "http://schema.org",

0 commit comments

Comments
 (0)