Skip to content

Commit 2303fa3

Browse files
Pankajcoder1Pankajcoder1
committed
chenges
1 parent 4a69e7b commit 2303fa3

File tree

6 files changed

+603
-1
lines changed

6 files changed

+603
-1
lines changed

‎css/dark_mode.css

+4
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,4 @@
1+
body
2+
{
3+
background-color: red;
4+
}

‎css/index.css

+379
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,379 @@
1+
/*font for intro*/
2+
@import url('https://fonts.googleapis.com/css2?family=Source+Sans+Pro&display=swap');
3+
4+
/*css start*/
5+
/* css to handle different media will later write */
6+
7+
body
8+
{
9+
overflow-x: scroll;
10+
}
11+
.section-heading
12+
{
13+
height: 50px;
14+
font-size: 35px;
15+
font-weight: 500;
16+
}
17+
/*css for navbar start*/
18+
nav li a
19+
{
20+
font-weight: 700;
21+
}
22+
.nav-link
23+
{
24+
font-size: 17px;
25+
}
26+
.nav-link:hover
27+
{
28+
font-weight: 500;
29+
}
30+
.dropdown-menu li
31+
{
32+
width: 180px;
33+
margin: 5px;
34+
}
35+
.dropdown-item
36+
{
37+
font-size: 18px;
38+
font-weight: 500;
39+
}
40+
.dropdown-menu li a:hover
41+
{
42+
font-weight: 800;
43+
}
44+
/* css for media query of navbar section*/
45+
46+
@media(max-width: 992px) and (min-width: 768px)
47+
{
48+
nav .container
49+
{
50+
margin: 0px;
51+
padding: 0px;
52+
}
53+
.nav-link
54+
{
55+
font-size: 15px;
56+
}
57+
}
58+
59+
@media(max-width: 768px)
60+
{
61+
nav .container
62+
{
63+
margin-left: 0px;
64+
margin-right: 0px;
65+
}
66+
.nav-link
67+
{
68+
font-size: 14px;
69+
}
70+
}
71+
/* css for media query of navbar section end here*/
72+
/*css end for navbar*/
73+
74+
/*css for main section start*/
75+
.about
76+
{
77+
min-height: 850px;
78+
}
79+
.about-div .row .col-sm
80+
{
81+
min-height: 600px;
82+
padding-top: 90px;
83+
margin-right: 0px;
84+
animation-name: about-translate;
85+
animation-duration: 2s;
86+
animation-iteration-count: 1;
87+
animation-timing-function: ease;
88+
}
89+
@keyframes about-translate
90+
{
91+
from
92+
{
93+
margin-top: 100px;
94+
}
95+
to
96+
{
97+
margin-top: 0px;
98+
}
99+
}
100+
.about-intro-div
101+
{
102+
margin-top: 5%;
103+
}
104+
.about-intro-div h1
105+
{
106+
border-bottom: rgb(0,0,0,0.5) 1px solid;
107+
border-bottom-width: 2px;
108+
width: 100px;
109+
}
110+
.row div img
111+
{
112+
height: 400px;
113+
width: 350px;
114+
padding: 15px;
115+
margin: 15px;
116+
border-radius: 48%;
117+
}
118+
.intro
119+
{
120+
padding: 5px;
121+
font-size: 25px;
122+
font-family: 'Source Sans Pro', sans-serif;
123+
font-weight: 500;
124+
}
125+
.explore-button a
126+
{
127+
text-decoration: none;
128+
font-size: 20px;
129+
}
130+
131+
/*css for media query for main section*/
132+
@media(max-width: 992px) and (min-width: 768px)
133+
{
134+
.row div img
135+
{
136+
height: 350px;
137+
width: 410px;
138+
padding: 15px;
139+
margin: 15px;
140+
border-radius: 48%;
141+
}
142+
}
143+
144+
@media(max-width: 768px)
145+
{
146+
.about-div .row .col-sm
147+
{
148+
padding-top: 10px;
149+
min-height: 400px;
150+
}
151+
.row div img
152+
{
153+
height: 360px;
154+
width: 370px;
155+
padding: 15px;
156+
margin-left: 30px;
157+
border-radius: 48%;
158+
}
159+
}
160+
@media(max-width: 576px)
161+
{
162+
.about-div .row .col-sm
163+
{
164+
padding-top: 10px;
165+
min-height: 250px;
166+
}
167+
/* to align img at center */
168+
/*.row .col-xl-5
169+
{
170+
background-color: red;
171+
left: 0%;
172+
}*/
173+
.row div img
174+
{
175+
height: 260px;
176+
width: 250px;
177+
padding: 15px;
178+
margin: 15px;
179+
border-radius: 48%;
180+
}
181+
nav .container
182+
{
183+
margin-left: 0px;
184+
margin-right: 0px;
185+
}
186+
.row div img
187+
{
188+
margin-left: 0px;
189+
}
190+
.intro
191+
{
192+
font-size: 18px;
193+
}
194+
}
195+
/*css end for main section*/
196+
197+
198+
/* css start for skill section */
199+
200+
.skill-section
201+
{
202+
min-height: 500px;
203+
}
204+
.skill-section .container h1
205+
{
206+
padding-bottom: 15px;
207+
}
208+
.skill-section .container .row div>p
209+
{
210+
font-size: 20px;
211+
font-weight: 900;
212+
}
213+
.skill-section .container .row ul li
214+
{
215+
margin-left: -50px;
216+
list-style-type: none;
217+
font-size: 19px;
218+
font-family: 'Source Sans Pro', sans-serif;
219+
}
220+
221+
/* css end for skill section*/
222+
223+
224+
/* css start for project section*/
225+
.project-section
226+
{
227+
padding-top: 15px;
228+
min-height: 820px;
229+
}
230+
.description
231+
{
232+
font-size: 17px;
233+
}
234+
.table1 thead
235+
{
236+
font-size: 18px;
237+
}
238+
.table1 tbody tr td a i
239+
{
240+
font-size: 20px;
241+
}
242+
.table1 tbody tr:hover a i
243+
{
244+
font-size: 28px;
245+
}
246+
tr td:nth-child(2)
247+
{
248+
text-transform: capitalize;
249+
font-size: 15px;
250+
}
251+
tr td:nth-child(1)
252+
{
253+
font-size: 15px;
254+
}
255+
@media (max-width: 768px)
256+
{
257+
.project-section
258+
{
259+
min-height: 550px;
260+
}
261+
/* description column create problem in mobile and tab view so I remove it for that device only */
262+
.description
263+
{
264+
display: none;
265+
}
266+
}
267+
/* css end for project section */
268+
269+
/* css for contact me section start */
270+
.contact
271+
{
272+
min-height: 350px;
273+
}
274+
275+
.contact .container .row .col-lg-4 div
276+
{
277+
min-height: 190px;
278+
width: auto;
279+
margin: 10px;
280+
border: 1px solid #7456c6;
281+
border-radius: 10px;
282+
}
283+
.contact .container .row i
284+
{
285+
padding-top: 20px;
286+
font-size: 52px;
287+
}
288+
.contact .container .row :hover i
289+
{
290+
padding-top: 20px;
291+
font-size: 60px;
292+
}
293+
/* css for contact me section end here */
294+
295+
/* css start for connect me section*/
296+
.connect-me
297+
{
298+
padding-top: 10px;
299+
min-height: 200px;
300+
}
301+
.connect-me div .row ul li
302+
{
303+
list-style-type: none;
304+
}
305+
.connect-me div .row ul li a i,img
306+
{
307+
height: 60px;
308+
padding-top: 20px;
309+
font-size: 30px;
310+
}
311+
312+
.connect-me div .row ul li
313+
{
314+
float: left;
315+
margin-left: 22%;
316+
}
317+
@media (max-width: 576px)
318+
{
319+
.connect-me div .row ul li
320+
{
321+
float: left;
322+
margin-left: 0%;
323+
}
324+
.connect-me div .row ul li a i
325+
{
326+
height: 35px;
327+
width: 40px;
328+
}
329+
}
330+
/* css for connect me section end here */
331+
332+
/* css for footer section */
333+
.footer
334+
{
335+
height: 50px;
336+
}
337+
.footer div
338+
{
339+
top: 50%;
340+
font-size: 14px;
341+
position: relative;
342+
transform: translateY(-50%);
343+
}
344+
/* css end for footer section */
345+
/* css for top button start */
346+
.top-button
347+
{
348+
display: none;
349+
position: fixed;
350+
bottom: 3%;
351+
right: 3%;
352+
cursor: pointer;
353+
border-radius: 19%;
354+
font-size: 25px;
355+
width: 45px;
356+
/*max-height: 50px;*/
357+
}
358+
/* css end for top button */
359+
/* css to just debug some thing*/
360+
361+
@media(max-width: 300px)
362+
{
363+
.connect-me div .row ul li
364+
{
365+
padding-top: 30px;
366+
float: left;
367+
display: block;
368+
}
369+
.github
370+
{
371+
margin-left: 50%;
372+
}
373+
}
374+
375+
/* css used during debuging and fixing issues */
376+
/* css end for debuging */
377+
/* issue not fixed yet */
378+
/* for very small device max-width: 300px ; last section that is connect with me
379+
is not responsive */

0 commit comments

Comments
 (0)