Skip to content

Commit 657518b

Browse files
committed
feat: CC & favicon & MDJAmin
1 parent 846ed48 commit 657518b

3 files changed

Lines changed: 151 additions & 57 deletions

File tree

favicon.svg

Lines changed: 24 additions & 0 deletions
Loading

index.html

Lines changed: 99 additions & 56 deletions
Original file line numberDiff line numberDiff line change
@@ -1,67 +1,110 @@
11
<!DOCTYPE html>
22
<html lang="en">
3-
4-
<head>
5-
<meta charset="UTF-8">
6-
<meta name="viewport" content="width=device-width, initial-scale=1.0">
7-
<link href="https://stackpath.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css" rel="stylesheet"
8-
integrity="sha384-wvfXpqpZZVQGK6TAh5PVlGOfQNHSoD2xbE+QkPxCAFlNEevoEH3Sl0sibVcOQVnN" crossorigin="anonymous">
9-
<link rel="stylesheet" href="style.css">
3+
<head>
4+
<meta charset="UTF-8" />
5+
<meta
6+
name="viewport"
7+
content="width=device-width, initial-scale=1.0"
8+
/>
9+
<link
10+
href="https://stackpath.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css"
11+
rel="stylesheet"
12+
integrity="sha384-wvfXpqpZZVQGK6TAh5PVlGOfQNHSoD2xbE+QkPxCAFlNEevoEH3Sl0sibVcOQVnN"
13+
crossorigin="anonymous"
14+
/>
15+
<link
16+
rel="stylesheet"
17+
href="style.css"
18+
/>
19+
<link
20+
rel="shortcut icon"
21+
href="favicon.svg"
22+
type="image/x-icon"
23+
/>
1024
<title>Social Media Card Hover</title>
11-
</head>
12-
<body>
25+
</head>
26+
<body>
1327
<div class="container">
14-
<div class="card">
15-
<div class="face face1">
16-
<div class="content">
17-
<div class="icon">
18-
<i class="fa fa-linkedin-square" aria-hidden="true"></i>
19-
</div>
20-
</div>
21-
</div>
22-
<div class="face face2">
23-
<div class="content">
24-
<h3>
25-
<a href="#" target="_blank">Linkedin</a>
26-
</h3>
27-
<p>This is where I share info about this section.</p>
28-
</div>
28+
<div class="card">
29+
<div class="face face1">
30+
<div class="content">
31+
<div class="icon">
32+
<i
33+
class="fa fa-linkedin-square"
34+
aria-hidden="true"
35+
></i>
2936
</div>
37+
</div>
3038
</div>
31-
<div class="card">
32-
<div class="face face1">
33-
<div class="content">
34-
<div class="icon">
35-
<i class="fa fa-youtube-square" aria-hidden="true"></i>
36-
</div>
37-
</div>
38-
</div>
39-
<div class="face face2">
40-
<div class="content">
41-
<h3>
42-
<a href="#" target="_blank">Youtube</a>
43-
</h3>
44-
<p>This is where I share info about this section.</p>
45-
</div>
46-
</div>
39+
<div class="face face2">
40+
<div class="content">
41+
<h3>
42+
<a
43+
href="#"
44+
target="_blank"
45+
>Linkedin</a
46+
>
47+
</h3>
48+
<p>Professional networking.</p>
49+
</div>
4750
</div>
48-
<div class="card">
49-
<div class="face face1">
50-
<div class="content">
51-
<div class="icon">
52-
<i class="fa fa-github-square" aria-hidden="true"></i>
53-
</div>
54-
</div>
51+
</div>
52+
<div class="card">
53+
<div class="face face1">
54+
<div class="content">
55+
<div class="icon">
56+
<i
57+
class="fa fa-youtube-square"
58+
aria-hidden="true"
59+
></i>
5560
</div>
56-
<div class="face face2">
57-
<div class="content">
58-
<h3>
59-
<a href="#" target="_blank">GitHub</a>
60-
</h3>
61-
<p>This is where I share info about this section.</p>
62-
</div>
61+
</div>
62+
</div>
63+
<div class="face face2">
64+
<div class="content">
65+
<h3>
66+
<a
67+
href="#"
68+
target="_blank"
69+
>Youtube</a
70+
>
71+
</h3>
72+
<p>Video sharing.</p>
73+
</div>
74+
</div>
75+
</div>
76+
<div class="card">
77+
<div class="face face1">
78+
<div class="content">
79+
<div class="icon">
80+
<i
81+
class="fa fa-github-square"
82+
aria-hidden="true"
83+
></i>
6384
</div>
85+
</div>
86+
</div>
87+
<div class="face face2">
88+
<div class="content">
89+
<h3>
90+
<a
91+
href="#"
92+
target="_blank"
93+
>GitHub</a
94+
>
95+
</h3>
96+
<p>Code collaboration.</p>
97+
</div>
6498
</div>
99+
</div>
100+
</div>
101+
<div class="MDJAminDiv">
102+
<a
103+
class="MDJAmin"
104+
href="https://github.com/MDJAmin"
105+
target="_blank"
106+
>MDJAmin</a
107+
>
65108
</div>
66-
</body>
67-
</html>
109+
</body>
110+
</html>

style.css

Lines changed: 28 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -38,7 +38,7 @@ body {
3838
}
3939

4040
.container .card:nth-child(2) .icon {
41-
background: #f00;
41+
background: #f00;
4242
}
4343

4444
.container .card:nth-child(3) .icon {
@@ -136,3 +136,30 @@ i {
136136
text-decoration: none;
137137
color: #414141;
138138
}
139+
140+
.MDJAminDiv {
141+
z-index: 4444;
142+
position: fixed;
143+
bottom: 5%;
144+
left: 2%;
145+
}
146+
147+
.MDJAmin {
148+
text-decoration: none;
149+
/* border-bottom: 1px dashed rgb(204, 204, 204); */
150+
/* border-top: 1px dashed rgb(204, 204, 204); */
151+
border-bottom: 1px dashed rgb(44, 44, 44);
152+
border-top: 1px dashed rgb(44, 44, 44);
153+
padding: 4px 0;
154+
color: rgba(44, 44, 44, 0.525);
155+
/* color: rgba(204, 204, 204, 0.414); */
156+
font-family: monospace;
157+
font-style: italic;
158+
font-size: 1.1em;
159+
transition: all 0.5s;
160+
}
161+
162+
.MDJAmin:hover {
163+
color: #000000;
164+
/* color: white; */
165+
}

0 commit comments

Comments
 (0)