Skip to content

Commit 62e62c2

Browse files
committed
Refactor CSS for portfolio styling; maintain existing styles while ensuring consistency and readability across the layout.
1 parent 9a8571a commit 62e62c2

File tree

1 file changed

+161
-161
lines changed

1 file changed

+161
-161
lines changed

CSS/style-portfolio.css

Lines changed: 161 additions & 161 deletions
Original file line numberDiff line numberDiff line change
@@ -1,161 +1,161 @@
1-
@import url("https://fonts.googleapis.com/css2?family=Poppins:wght@300;400;500;600;700;800;900&display=swap");
2-
3-
html{
4-
scroll-behavior: smooth;
5-
}
6-
7-
*{
8-
margin: 0;
9-
padding: 0;
10-
box-sizing: border-box;
11-
}
12-
13-
body {
14-
background: #081b29;
15-
color: #ededed;
16-
}
17-
18-
.header {
19-
width: 100%;
20-
padding: 20px 10%;
21-
background: transparent;
22-
display: flex;
23-
justify-content: space-between;
24-
align-items: center;
25-
}
26-
27-
.navbar a {
28-
font-size: 18px;
29-
font-family: "Poppins", sans-serif;
30-
color: #ededed;
31-
text-decoration: none;
32-
font-weight: 500;
33-
margin-left: 35px;
34-
transition: 0.3s;
35-
}
36-
37-
.navbar a:hover{
38-
color: #00abf0;
39-
}
40-
41-
.achievement-navbar{
42-
display: flex;
43-
justify-content: space-between;
44-
margin-left: 7%;
45-
margin-right: 7%;
46-
}
47-
48-
.achievement-navbar a {
49-
font-size: 26px;
50-
font-family: "Poppins", sans-serif;
51-
color: #ededed;
52-
text-decoration: none;
53-
font-weight: 500;
54-
transition: 0.5s;
55-
}
56-
57-
.achievement-navbar a:hover{
58-
color: aqua;
59-
}
60-
61-
.logo {
62-
font-size: 20px;
63-
color: #ededed;
64-
text-decoration: none;
65-
font-family: "Poppins", sans-serif;
66-
font-weight: 600;
67-
}
68-
69-
.container {
70-
display: flex;
71-
flex-direction: column;
72-
margin: auto;
73-
}
74-
75-
.intro {
76-
display: flex;
77-
margin: auto;
78-
}
79-
80-
.photo img {
81-
height: 400px;
82-
width: 400px;
83-
}
84-
85-
.details {
86-
display: flex;
87-
flex-direction: column;
88-
justify-content: center;
89-
margin-left: 10px;
90-
}
91-
92-
.name {
93-
font-family: "Gill Sans", "Gill Sans MT", Calibri, "Trebuchet MS", sans-serif;
94-
font-size: 40px;
95-
}
96-
97-
.info {
98-
font-size: 20px;
99-
font-family: "Barlow Condensed", sans-serif;
100-
max-width: 800px;
101-
}
102-
103-
a {
104-
text-decoration: none;
105-
}
106-
107-
.achievements{
108-
margin: auto;
109-
}
110-
111-
.achievements .mainHeading {
112-
font-size: 70px;
113-
font-family: "Dancing Script", cursive;
114-
display: flex;
115-
padding: 15px;
116-
justify-content: center;
117-
font-weight: bolder;
118-
}
119-
120-
.details-tabs-heading {
121-
font-size: 50px;
122-
font-family: "Luxurious Roman", cursive;
123-
font-weight: bolder;
124-
}
125-
126-
.details-tabs {
127-
text-align: center;
128-
margin-top: 5px;
129-
margin-bottom: 30px;
130-
padding: 20px;
131-
font-size: 20px;
132-
font-family: "Barlow Condensed", sans-serif;
133-
background-color: rgb(237, 237, 237, 0.6);
134-
max-width: 1210px;
135-
border-radius: 50px;
136-
}
137-
138-
.details-tabs img {
139-
height: 20px;
140-
width: 20px;
141-
}
142-
143-
.scroll-to-top {
144-
position: fixed;
145-
bottom: 30px;
146-
right: 30px;
147-
height: 45px;
148-
width: 45px;
149-
}
150-
151-
.scroll-to-top a {
152-
display: flex;
153-
height: 45px;
154-
width: 45px;
155-
background: #ededed;
156-
text-align: center;
157-
font-size: 20px;
158-
border-radius: 50%;
159-
text-decoration: none;
160-
}
161-
1+
@import url("https://fonts.googleapis.com/css2?family=Poppins:wght@300;400;500;600;700;800;900&display=swap");
2+
3+
html{
4+
scroll-behavior: smooth;
5+
}
6+
7+
*{
8+
margin: 0;
9+
padding: 0;
10+
box-sizing: border-box;
11+
}
12+
13+
body {
14+
background: #081b29;
15+
color: #ededed;
16+
}
17+
18+
.header {
19+
width: 100%;
20+
padding: 20px 10%;
21+
background: transparent;
22+
display: flex;
23+
justify-content: space-between;
24+
align-items: center;
25+
}
26+
27+
.navbar a {
28+
font-size: 18px;
29+
font-family: "Poppins", sans-serif;
30+
color: #ededed;
31+
text-decoration: none;
32+
font-weight: 500;
33+
margin-left: 35px;
34+
transition: 0.3s;
35+
}
36+
37+
.navbar a:hover{
38+
color: #00abf0;
39+
}
40+
41+
.achievement-navbar{
42+
display: flex;
43+
justify-content: space-between;
44+
margin-left: 7%;
45+
margin-right: 7%;
46+
}
47+
48+
.achievement-navbar a {
49+
font-size: 26px;
50+
font-family: "Poppins", sans-serif;
51+
color: #ededed;
52+
text-decoration: none;
53+
font-weight: 500;
54+
transition: 0.5s;
55+
}
56+
57+
.achievement-navbar a:hover{
58+
color: aqua;
59+
}
60+
61+
.logo {
62+
font-size: 20px;
63+
color: #ededed;
64+
text-decoration: none;
65+
font-family: "Poppins", sans-serif;
66+
font-weight: 600;
67+
}
68+
69+
.container {
70+
display: flex;
71+
flex-direction: column;
72+
margin: auto;
73+
}
74+
75+
.intro {
76+
display: flex;
77+
margin: auto;
78+
}
79+
80+
.photo img {
81+
height: 400px;
82+
width: 400px;
83+
}
84+
85+
.details {
86+
display: flex;
87+
flex-direction: column;
88+
justify-content: center;
89+
margin-left: 10px;
90+
}
91+
92+
.name {
93+
font-family: "Gill Sans", "Gill Sans MT", Calibri, "Trebuchet MS", sans-serif;
94+
font-size: 40px;
95+
}
96+
97+
.info {
98+
font-size: 20px;
99+
font-family: "Barlow Condensed", sans-serif;
100+
max-width: 800px;
101+
}
102+
103+
a {
104+
text-decoration: none;
105+
}
106+
107+
.achievements{
108+
margin: auto;
109+
}
110+
111+
.achievements .mainHeading {
112+
font-size: 70px;
113+
font-family: "Dancing Script", cursive;
114+
display: flex;
115+
padding: 15px;
116+
justify-content: center;
117+
font-weight: bolder;
118+
}
119+
120+
.details-tabs-heading {
121+
font-size: 50px;
122+
font-family: "Luxurious Roman", cursive;
123+
font-weight: bolder;
124+
}
125+
126+
.details-tabs {
127+
text-align: center;
128+
margin-top: 5px;
129+
margin-bottom: 30px;
130+
padding: 20px;
131+
font-size: 20px;
132+
font-family: "Barlow Condensed", sans-serif;
133+
background-color: rgb(237, 237, 237, 0.6);
134+
max-width: 1210px;
135+
border-radius: 50px;
136+
}
137+
138+
.details-tabs img {
139+
height: 20px;
140+
width: 20px;
141+
}
142+
143+
.scroll-to-top {
144+
position: fixed;
145+
bottom: 30px;
146+
right: 30px;
147+
height: 45px;
148+
width: 45px;
149+
}
150+
151+
.scroll-to-top a {
152+
display: flex;
153+
height: 45px;
154+
width: 45px;
155+
background: #ededed;
156+
text-align: center;
157+
font-size: 20px;
158+
border-radius: 50%;
159+
text-decoration: none;
160+
}
161+

0 commit comments

Comments
 (0)