Skip to content

Commit 3757b85

Browse files
committed
Fixed mobile view and added fontawesome
1 parent 9af3692 commit 3757b85

File tree

2 files changed

+24
-36
lines changed

2 files changed

+24
-36
lines changed

assets/styles/style.css

Lines changed: 10 additions & 23 deletions
Original file line numberDiff line numberDiff line change
@@ -2,26 +2,21 @@
22
--gradient-color-one: #020024;
33
--gradient-color-two: #27254d;
44
--gradient-color-three: #425162;
5-
65
--text-color: #fefefe;
76
--text-selection-color: #aeaeae;
87
--text-selection-bg: #383838;
9-
108
--header-one-color: #d4f1ff;
119
--header-two-color: #d6d8f5;
12-
1310
--container-bg: #92b9bd1c;
1411
--border-color: #606680;
1512
--container-shadow: #00000075;
16-
1713
--link-color: #7f8c8d;
1814
--link-border: #6066808e;
1915
--link-shadow: #00000030;
2016
--link-hover: #6cb4e4;
2117
--link-hover-bg: #3d416386;
2218
--link-selection: #67cbec;
2319
--link-selection-bg: #3d4163;
24-
2520
--footer-bg: #758b8d11;
2621
--footer-border: #758b8d3f;
2722
--footer-shadow: #00000020;
@@ -31,21 +26,18 @@
3126
--footer-link-selection: #7ccce6;
3227
--footer-link-selection-bg: #3d4163;
3328
}
34-
3529
*,
3630
*::before,
3731
*::after {
3832
margin: 0;
3933
padding: 0;
4034
box-sizing: border-box;
4135
}
42-
4336
html {
4437
font-size: 62.5%;
4538
min-height: 100%;
4639
font-family: "Rubik farsi";
4740
}
48-
4941
body {
5042
height: 100dvh;
5143
justify-content: center;
@@ -56,24 +48,21 @@ body {
5648
background-image: linear-gradient(
5749
20deg,
5850
var(--gradient-color-one) 0%,
59-
var(--gradient-color-two) 33%,
60-
var(--gradient-color-three) 80%
51+
var(--gradient-color-two) 33%,
52+
var(--gradient-color-three) 80%
6153
);
6254
background-attachment: fixed;
6355
color: var(--text-color);
6456
font-size: 1.2rem;
6557
}
66-
6758
*::-moz-selection {
6859
color: var(--text-selection-color);
6960
background-color: var(--text-selection-bg);
7061
}
71-
7262
*::selection {
7363
color: var(--text-selection-color);
7464
background-color: var(--text-selection-bg);
7565
}
76-
7766
a:link,
7867
a:visited {
7968
text-decoration: none;
@@ -85,14 +74,12 @@ a:visited {
8574
padding: 0.5rem 1rem;
8675
transition: color 0.2s, background-color 0.2s;
8776
}
88-
8977
a:hover,
9078
a:focus {
9179
outline: none;
9280
background-color: var(--link-selection-bg);
9381
color: var(--link-selection);
9482
}
95-
9683
a.inline:link,
9784
a.inline:visited {
9885
text-decoration: none;
@@ -103,25 +90,21 @@ a.inline:visited {
10390
border: none;
10491
padding: 0;
10592
}
106-
10793
a.inline:hover,
10894
a.inline:focus {
10995
outline: none;
11096
color: var(--link-selection);
11197
}
112-
11398
main {
11499
display: flex;
115100
flex-direction: column;
116101
justify-content: center;
117102
align-items: center;
118103
}
119-
120104
p {
121105
line-height: 2;
122106
margin: 0.6rem;
123107
}
124-
125108
ul {
126109
list-style: none;
127110
display: flex;
@@ -130,26 +113,30 @@ ul {
130113
border: 1px solid var(--border-color);
131114
padding: 0.8rem;
132115
border-radius: 1rem;
116+
flex-wrap: wrap;
117+
justify-content: center;
133118
}
134-
135119
.title {
136120
display: flex;
137121
flex-direction: column;
138122
gap: 0.8rem;
139123
margin: 1rem 0;
140124
line-height: 1.4;
141125
}
142-
143126
.img-profile {
144127
aspect-ratio: 1/1;
145128
border-radius: 10%;
146129
height: auto !important;
147130
}
148-
149131
.title-name {
150132
font-weight: 800;
151133
}
152-
153134
.title-desc {
154135
font-weight: 600;
155136
}
137+
138+
/* Added styles for FontAwesome icons */
139+
.fab, .fas {
140+
margin-left: 0.5rem;
141+
font-size: 1.4rem;
142+
}

index.html

Lines changed: 14 additions & 13 deletions
Original file line numberDiff line numberDiff line change
@@ -8,8 +8,10 @@
88
<link rel="stylesheet" href="./assets/styles/fonts.css" />
99
<link rel="stylesheet" href="./assets/styles/queries.css" />
1010
<link rel="shortcut icon" href="https://fav.farm/🫣" />
11-
1211
<link rel="me" href="https://persadon.com/@sohrab" />
12+
<link rel="me" href="https://mastodon.bsd.cafe/@sohrab" />
13+
<!-- Add FontAwesome -->
14+
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.7.1/css/all.min.css" />
1315
</head>
1416
<body align="center">
1517
<main>
@@ -33,23 +35,22 @@ <h2 class="title-desc">
3335
</p>
3436
<p>میتونید از لینک های زیر برای ارتباط با من استفاده کنید:</p>
3537
<ul>
36-
<li><a href="https://github.com/behdanisohrab">گیت‌هاب</a></li>
38+
<li><a href="https://github.com/behdanisohrab"><i class="fab fa-github"></i> گیت‌هاب</a></li>
3739
<li>
38-
<a href="https://linkedin.com/in/sohrab-behdani-047275254"
39-
>لینکداین</a
40-
>
40+
<a href="https://linkedin.com/in/sohrab-behdani-047275254"><i class="fab fa-linkedin"></i> لینکداین</a>
4141
</li>
42-
<li><a href="https://persadon.com/@sohrab">ماستادون</a></li>
43-
<li><a href="https://www.youtube.com/@sohrabbehdani">یوتیوب</a></li>
42+
<li><a href="https://mastodon.bsd.cafe/@sohrab"><i class="fab fa-mastodon"></i> ماستادون</a></li>
43+
<li><a href="https://www.youtube.com/@sohrabbehdani"><i class="fab fa-youtube"></i> یوتیوب</a></li>
4444
</ul>
4545
<p>دیگر لینک های من:</p>
4646
<ul>
47-
<li><a href="https://sohrabbehdani.ir/blog"> بلاگ انگلیسی</a></li>
48-
<li><a href="https://sohrabbehdani.ir/blogfa"> بلاگ فارسی</a></li>
49-
<li><a href="https://www.daramet.com/sohrabbehdani">دونیت</a></li>
50-
<li><a href="https://t.me/sohrabcontents">تلگرام</a></li>
51-
<li><a href="https://twitter.com/sbehdani">توییتر</a></li>
52-
<li><a href="https://matrix.to/#/@sohrabbehdani:matrix.org">ماتریکس</a></li>
47+
<li><a href="https://blog.sohrabbehdani.ir/"><i class="fas fa-blog"></i> بلاگ انگلیسی</a></li>
48+
<li><a href="https://blogfa.sohrabbehdani.ir/"><i class="fas fa-blog"></i> بلاگ فارسی</a></li>
49+
<li><a href="https://www.daramet.com/sohrabbehdani"><i class="fas fa-hand-holding-heart"></i> دونیت</a></li>
50+
<li><a href="https://t.me/sohrabcontents"><i class="fab fa-telegram"></i> تلگرام</a></li>
51+
<li><a href="https://twitter.com/sbehdani"><i class="fab fa-x-twitter"></i> توییتر</a></li>
52+
<li><a href="https://matrix.to/#/@sohrab:matrix.bsd.cafe"><i class="fas fa-rocket"></i> ماتریکس</a></li>
53+
<li><a href="https://bsky.app/profile/sohrabbehdani.ir"><i class="fa-brands fa-bluesky"></i></i> بلواسکای</a></li>
5354
</ul>
5455
</main>
5556
<script>

0 commit comments

Comments
 (0)