Skip to content

Commit 685b25b

Browse files
Rajkumar-justcoderRajkumar-justcoder
authored
Merge pull request #36 from pranathnaik/main
added created by
2 parents 737bd7d + 60e90da commit 685b25b

File tree

2 files changed

+160
-50
lines changed

2 files changed

+160
-50
lines changed

‎assets/css/style.css

+64-50
Original file line numberDiff line numberDiff line change
@@ -1,88 +1,102 @@
11
* {
2-
font-family: 'Inter', sans-serif;
3-
margin: 0;
4-
padding: 0;
5-
box-sizing: border-box
2+
font-family: 'Inter', sans-serif;
3+
margin: 0;
4+
padding: 0;
5+
box-sizing: border-box;
66
}
77

88
:root {
9-
--bg-btn-card: #141417;
10-
--forground-main-color: rgb(255 255 255 / 1);
11-
--background-main-color: rgb(0, 0, 0);
9+
--bg-btn-card: #141417;
10+
--forground-main-color: rgb(255 255 255 / 1);
11+
--background-main-color: rgb(0, 0, 0);
1212
}
1313

1414
body {
15-
padding: 0 20px;
16-
max-width: 1100px;
17-
margin: 3rem auto;
18-
background-color: var(--background-main-color);
19-
color: var(--forground-main-color);
15+
padding: 0 20px;
16+
max-width: 1100px;
17+
margin: 3rem auto;
18+
background-color: var(--background-main-color);
19+
color: var(--forground-main-color);
2020
}
2121

2222
body::-webkit-scrollbar {
23-
width: 8px;
24-
background-color: rgb(64, 63, 63);
23+
width: 8px;
24+
background-color: rgb(64, 63, 63);
2525
}
2626

2727
body::-webkit-scrollbar-thumb {
28-
border-radius: 11px;
29-
/* -webkit-box-shadow: inset -5px 0px 29px 0 #ec4896; */
30-
background-color:rgb(99, 99, 99);
28+
border-radius: 11px;
29+
/* -webkit-box-shadow: inset -5px 0px 29px 0 #ec4896; */
30+
background-color: rgb(99, 99, 99);
3131
}
3232

33-
main{
34-
display: flex;
35-
align-items: center;
33+
main {
34+
display: flex;
35+
align-items: center;
3636
}
3737

38-
.navbar{
39-
display: flex;
40-
flex-direction: column;
41-
align-items: center;
42-
justify-content: center;
43-
text-align: center;
38+
.navbar {
39+
display: flex;
40+
flex-direction: column;
41+
align-items: center;
42+
justify-content: center;
43+
text-align: center;
4444
}
4545

46-
.title{
47-
font-size:3rem;
48-
padding-top: 0rem;
49-
font-weight: 700;
46+
.title {
47+
font-size: 3rem;
48+
padding-top: 0rem;
49+
font-weight: 700;
5050
}
51-
.content-text{
52-
padding:1rem 0rem 3rem 0rem;
53-
font-size: 1.2rem;
51+
.content-text {
52+
padding: 1rem 0rem 3rem 0rem;
53+
font-size: 1.2rem;
5454
}
5555

5656
.button-container {
5757
display: flex;
5858
align-items: center;
5959
justify-content: center;
60-
width: 18rem;
61-
height: 18rem;
62-
background-color: var(--bg-btn-card);
63-
transition: 0.4s;
64-
border-radius: 30px;
60+
width: 18rem;
61+
height: 18rem;
62+
background-color: var(--bg-btn-card);
63+
transition: 0.4s;
64+
border-radius: 30px;
65+
overflow: hidden;
66+
position: relative;
6567
}
68+
6669
.button-container:hover {
67-
transform: translateY(-5px);
70+
transform: translateY(-5px);
6871
}
6972

7073
.container {
71-
display: flex;
72-
justify-content: center;
73-
flex-wrap: wrap;
74-
gap: 2rem;
75-
74+
display: flex;
75+
justify-content: center;
76+
flex-wrap: wrap;
77+
gap: 2rem;
7678
}
7779

78-
footer{
79-
padding-top: 3rem;
80-
text-align: center;
80+
.createdby-section {
81+
width: 100%;
82+
text-align: center;
83+
padding: 8px 0;
84+
background-color: #212128;
85+
position: absolute;
86+
bottom: 0;
8187
}
8288

83-
footer > a{
84-
color: white;
85-
font-weight: 700;
89+
.createdby-section a {
90+
color: rgb(129 120 255 / 1);
91+
text-decoration: none;
8692
}
8793

94+
footer {
95+
padding-top: 3rem;
96+
text-align: center;
97+
}
8898

99+
footer > a {
100+
color: white;
101+
font-weight: 700;
102+
}

‎index.html

+96
Original file line numberDiff line numberDiff line change
@@ -29,14 +29,33 @@
2929
<div class="container">
3030
<div class="button-container">
3131
<button class="button-def button-1"><span>Hover Me</span></button>
32+
<div class="createdby-section">
33+
Created by
34+
<a href="">Design and Code</a>
35+
</div>
3236
</div>
3337
<div class="button-container">
3438
<button class="button-def button-2">
3539
<span><span>New page</span></span>
3640
</button>
41+
<div class="createdby-section">
42+
Created by
43+
<a href="">Design and Code</a>
44+
</div>
3745
</div>
3846
<div class="button-container">
3947
<button class="button-def button-3"><span>Render</span></button>
48+
<div class="createdby-section">
49+
Created by
50+
<a href="">Design and Code</a>
51+
</div>
52+
</div>
53+
<div class="button-container">
54+
<button class="button-def button-3"><span>Render</span></button>
55+
<div class="createdby-section">
56+
Created by
57+
<a href="">Design and Code</a>
58+
</div>
4059
</div>
4160
<div class="button-container">
4261
<button class="button-def button-4">
@@ -50,6 +69,10 @@
5069
</div>
5170
</div>
5271
</button>
72+
<div class="createdby-section">
73+
Created by
74+
<a href="">Design and Code</a>
75+
</div>
5376
</div>
5477
<div class="button-container">
5578
<button class="button-def button-5">
@@ -63,9 +86,24 @@
6386
</div>
6487
</div>
6588
</button>
89+
<div class="createdby-section">
90+
Created by
91+
<a href="">Design and Code</a>
92+
</div>
6693
</div>
6794
<div class="button-container">
6895
<button class="button-def button-6"><span>Hover me</span></button>
96+
<div class="createdby-section">
97+
Created by
98+
<a href="">Design and Code</a>
99+
</div>
100+
</div>
101+
<div class="button-container">
102+
<button class="button-def button-6"><span>Hover me</span></button>
103+
<div class="createdby-section">
104+
Created by
105+
<a href="">Design and Code</a>
106+
</div>
69107
</div>
70108

71109
<!-- buttons starts from here -->
@@ -82,6 +120,10 @@
82120
<button class="button button--shiny-gradient">
83121
<span>Hover Me</span>
84122
</button>
123+
<div class="createdby-section">
124+
Created by
125+
<a href="">Design and Code</a>
126+
</div>
85127
</div>
86128

87129
<!-- buttons end here -->
@@ -91,20 +133,37 @@
91133
<button class="button-8" type="button">
92134
<span>HOVER ME, THEN CLICK ME!</span>
93135
</button>
136+
<div class="createdby-section">
137+
Created by
138+
<a href="">Design and Code</a>
139+
</div>
94140
</div>
95141
<!-- button ends here -->
96142

97143
<!-- button starts here -->
98144
<div class="button-container">
99145
<button class="button-101">Button</button>
146+
<div class="createdby-section">
147+
Created by
148+
<a href="">Design and Code</a>
149+
</div>
100150
</div>
101151

102152
<div class="button-container">
103153
<button class="button-102"><span>Hover Me</span></button>
154+
155+
<div class="createdby-section">
156+
Created by
157+
<a href="">Design and Code</a>
158+
</div>
104159
</div>
105160

106161
<div class="button-container">
107162
<button class="button-103">Hover Me</button>
163+
<div class="createdby-section">
164+
Created by
165+
<a href="">Design and Code</a>
166+
</div>
108167
</div>
109168
<!-- button ends here -->
110169

@@ -114,6 +173,10 @@
114173
class="button-container flex align-items-center justify-content-center"
115174
>
116175
<button class="Mahekjain-button-9" role="button">Hover Me</button>
176+
<div class="createdby-section">
177+
Created by
178+
<a href="">Design and Code</a>
179+
</div>
117180
</div>
118181
<!-- button end here -->
119182

@@ -131,37 +194,70 @@
131194
Neon button!!<br />Hover Me
132195
</a>
133196
</div>
197+
198+
<div class="createdby-section">
199+
Created by
200+
<a href="">Design and Code</a>
201+
</div>
134202
</div>
135203
<!-- button end here -->
136204

137205
<!-- button starts here -->
138206
<div
139207
class="button-container flex align-items-center justify-content-center">
140208
<button class="ingrzs-button-11"><span>Button</span></button>
209+
<div class="createdby-section">
210+
Created by
211+
<a href="">Design and Code</a>
212+
</div>
141213
</div>
142214
<!-- button end here -->
143215

144216
<!-- mahi-btn starts -->
145217
<div class="button-container">
146218
<button class="mahi-btn-1 button-def">Bright</button>
219+
<div class="createdby-section">
220+
Created by
221+
<a href="">Design and Code</a>
222+
</div>
223+
147224
</div>
148225

149226
<div class="button-container">
150227
<button class="mahi-btn-2 button-def">Bright 2</button>
228+
229+
<div class="createdby-section">
230+
Created by
231+
<a href="">Design and Code</a>
232+
</div>
233+
151234
</div>
152235

153236
<div class="button-container">
154237
<button class="mahi-btn-3 button-def">Bright 3</button>
238+
<div class="createdby-section">
239+
Created by
240+
<a href="">Design and Code</a>
241+
</div>
155242
</div>
156243

157244
<div class="button-container">
158245
<button class="mahi-btn-4 button-def">Bright 4</button>
246+
<div class="createdby-section">
247+
Created by
248+
<a href="">Design and Code</a>
249+
</div>
159250
</div>
160251
<!-- mahi-btn ends -->
161252

162253
<!-- Button 9 -->
163254
<div class="button-container">
164255
<button class="button-9" type="button"><span>HOVER ME</span></button>
256+
<div class="createdby-section">
257+
Created by
258+
<a href="">Design and Code</a>
259+
</div>
260+
165261
</div>
166262
<!--END-->
167263
</div>

0 commit comments

Comments
 (0)