Skip to content

Commit 7f6eeff

Browse files
committed
Fixed bugs in the button and changed font style
1 parent 333904f commit 7f6eeff

File tree

3 files changed

+104
-91
lines changed

3 files changed

+104
-91
lines changed

fonts/Poppins-Regular.otf

92.9 KB
Binary file not shown.

index.html

+5-5
Original file line numberDiff line numberDiff line change
@@ -132,15 +132,15 @@ <h1 style="text-align: center; color: rgb(151, 201, 216); font-style: italic;">S
132132
/>
133133
</div>
134134
<br />
135-
<div style="text-align: center">
135+
<div style="text-align: center; margin-top: 40px;">
136136

137137

138-
<button class="btn" >
139-
<a href="https://github.com/rakshit234/HacktoberFest2020" target="_blank">Link to code</a>
140-
</button>
138+
<!-- <button class="btn" > -->
139+
<a href="https://github.com/rakshit234/HacktoberFest2020" target="_blank" class="btn">Link to code</a>
140+
<!-- </button> -->
141141

142142
</div>
143-
</div>
143+
<!-- </div> -->
144144
<footer id="foot">
145145

146146
<h4 style="text-align:center; color:white;"> © 2020 DigitalOcean, LLC. All rights reserved.</h4>

style.css

+99-86
Original file line numberDiff line numberDiff line change
@@ -1,18 +1,22 @@
1+
@font-face {
2+
font-family: "Poppins";
3+
src: url(fonts/Poppins-Regular.otf) format("opentype");
4+
}
15
body {
2-
overflow-x: hidden;
3-
background-color: #003367;
6+
overflow-x: hidden;
7+
background-color: #003367;
48
}
59

610
h1 {
7-
property: Lucida Bright;
8-
text-align: center;
9-
font-size: 60px;
10-
color: #da47cc;
11+
/* property: Lucida Bright; */
12+
text-align: center;
13+
font-size: 60px;
14+
color: #da47cc;
1115
}
12-
16+
1317
h2 {
14-
background-color: #004992;
15-
text-align: center;
18+
background-color: #004992;
19+
text-align: center;
1620
}
1721

1822
div.sticky {
@@ -25,112 +29,121 @@ div.sticky {
2529
}
2630

2731
p {
28-
text-align: center;
29-
font-size: 60px;
30-
color: white;
31-
text-shadow: 1px 1px 2px #9c4768, 0 0 25px #84b5d4, 0 0 5px #f78ee0;
32+
text-align: center;
33+
font-size: 60px;
34+
color: white;
35+
text-shadow: 1px 1px 2px #9c4768, 0 0 25px #84b5d4, 0 0 5px #f78ee0;
3236
}
3337

3438
.center {
35-
display: block;
36-
margin-left: auto;
37-
margin-right: auto;
38-
width: 50%;
39+
display: block;
40+
margin-left: auto;
41+
margin-right: auto;
42+
width: 50%;
3943
}
4044

4145
.image {
42-
width: 60%
46+
width: 60%;
4347
}
4448

4549
a {
46-
color: #db70c5;
47-
font-size: larger;
48-
transition-duration: 0.5s;
50+
color: #db70c5;
51+
font-size: larger;
52+
transition-duration: 0.5s;
4953
}
5054

5155
a:hover {
52-
color: black;
53-
text-decoration: none;
54-
}
55-
.list-style{
56-
text-align: center;
57-
display: flex;
58-
justify-content: center;
59-
color: white;
60-
margin: 1em;
61-
}
62-
.list-style li{
63-
width: 40%;
64-
font-size: large;
65-
background-color: rgba(55, 17, 59, 0.63);
66-
box-shadow: 0px 0px 12px -1px rgb(214, 158, 222);
67-
}
68-
.list-style li ul{
69-
margin: 1em;
70-
padding: 0.5em;
71-
border-bottom: 1px solid rgba(255, 255, 255, 0.644);
72-
text-align: justify;
73-
}
74-
.list-style li ul a{
75-
color: rgb(248, 201, 255);
76-
text-decoration: none;
77-
}
78-
.list-style li ul a:hover{
79-
color: cyan);
56+
color: black;
57+
text-decoration: none;
58+
}
59+
.list-style {
60+
font-family: "Poppins";
61+
text-align: center;
62+
display: flex;
63+
justify-content: center;
64+
color: white;
65+
margin: 1em;
66+
letter-spacing: 0.5px;
67+
}
68+
.list-style li {
69+
width: 40%;
70+
/* font-size: large; */
71+
background-color: rgba(55, 17, 59, 0.63);
72+
box-shadow: 0px 0px 12px -1px rgb(214, 158, 222);
73+
}
74+
.list-style li ul {
75+
margin: 1em;
76+
padding: 0.5em;
77+
border-bottom: 1px solid rgba(255, 255, 255, 0.644);
78+
text-align: justify;
79+
}
80+
.list-style li ul a {
81+
color: rgb(248, 201, 255);
82+
text-decoration: none;
8083
}
84+
/* .list-style li ul a:hover {
85+
color: whitesmoke;
86+
} */
8187

88+
a {
89+
text-decoration: none;
90+
}
8291
.btn {
8392
background-color: rgba(52, 17, 54, 0.63);
8493
border: none;
85-
color: black;
94+
font-family: "Poppins";
8695
padding: 16px 32px;
8796
text-align: center;
8897
font-size: 16px;
89-
margin: 4px 2px;
98+
/* margin: 400px 0px; */
9099
transition: 0.3s;
91100
font-weight: bold;
92101
box-shadow: 0px 0px 12px -1px rgb(210, 158, 219);
102+
transition: all 0.5s;
103+
text-transform: uppercase;
104+
letter-spacing: 1.2px;
93105
}
94106

95107
.btn:hover {
96108
background-color: cyan;
97-
color: white;
98-
text-decoration: none;
109+
color: #db70c5;
110+
}
111+
#foot {
112+
margin-top: 80px;
99113
}
100-
101114
@media (min-width: 320px) and (max-width: 480px) {
102-
p {
103-
font-size: 20px
104-
}
105-
h1 {
106-
font-size: 20px
107-
}
108-
h2 {
109-
width: 100%;
110-
font-size: 20px;
111-
}
112-
.main {
113-
max-width: 90%;
114-
overflow: hidden;
115-
margin: 0 auto
116-
}
117-
.image {
118-
width: 100%;
119-
padding: 10px
120-
}
115+
p {
116+
font-size: 20px;
117+
}
118+
h1 {
119+
font-size: 20px;
120+
}
121+
h2 {
122+
width: 100%;
123+
font-size: 20px;
124+
}
125+
.main {
126+
max-width: 90%;
127+
overflow: hidden;
128+
margin: 0 auto;
129+
}
130+
.image {
131+
width: 100%;
132+
padding: 10px;
133+
}
121134
}
122135

123-
@media screen and (max-width:480px){
124-
.list-style{
125-
padding: 0;
126-
margin:1em 0;
127-
}
128-
.list-style li{
129-
width:100%;
130-
}
131-
img{
132-
width:100% !important;
133-
padding:0;
134-
margin: 0 auto !important;
135-
}
136+
@media screen and (max-width: 480px) {
137+
.list-style {
138+
padding: 0;
139+
margin: 1em 0;
140+
}
141+
.list-style li {
142+
width: 100%;
143+
}
144+
img {
145+
width: 100% !important;
146+
padding: 0;
147+
margin: 0 auto !important;
148+
}
136149
}

0 commit comments

Comments
 (0)