harivansh-afk/React-Portfolio
1
0
Fork 0
mirror of https://github.com/harivansh-afk/React-Portfolio.git synced 2026-04-21 17:00:49 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions

chore: project page edits etc

Browse source
This commit is contained in:
Harivansh Rathi 2025-01-03 19:02:52 +05:30
parent 7bacec764b
commit 1b599490ae
6 changed files with 248 additions and 118 deletions
Download patch file Download diff file Expand all files Collapse all files

147
src/components/socialicons/style.css
View file

@ -1,86 +1,101 @@
.stick_follow_icon {
top: 50%;
left: 30px;
width: 20px;
height: 200px;
position: fixed;
margin-top: -100px;
top: 50%;
left: 30px;
width: 20px;
height: 200px;
position: fixed;
margin-top: -100px;
z-index: 10;
}
@media (max-width: 1200px) {
.stick_follow_icon {
left: 15px;
}
}
@media (max-width: 1100px) {
.stick_follow_icon {
left: 10px;
}
}
.stick_follow_icon ul {
list-style: none;
padding: 0;
margin: 0;
list-style: none;
padding: 0;
margin: 0;
}
.stick_follow_icon svg {
width: 1.3em;
height: 1.3em;
fill: var(--text-color)
width: 1.3em;
height: 1.3em;
fill: var(--text-color);
}
.stick_follow_icon p {
top: 70px;
left: -24px;
width: 68px;
height: 20px;
color: var(--text-color);
font-size: 12px;
font-weight: 600;
line-height: 1.2;
white-space: nowrap;
position: relative;
transform: rotate( -90deg);
top: 70px;
left: -24px;
width: 68px;
height: 20px;
color: var(--text-color);
font-size: 12px;
font-weight: 600;
line-height: 1.2;
white-space: nowrap;
position: relative;
transform: rotate(-90deg);
}
.stick_follow_icon ul li {
display: block;
font-size: 12px;
text-align: center;
margin-bottom: 10px;
transition: all .3s;
display: block;
font-size: 12px;
text-align: center;
margin-bottom: 10px;
transition: all 0.3s;
}
.stick_follow_icon p:after {
top: 9px;
right: -48px;
width: 40px;
height: 1px;
content: "";
display: block;
position: absolute;
background-color: var(--text-color);
top: 9px;
right: -48px;
width: 40px;
height: 1px;
content: "";
display: block;
position: absolute;
background-color: var(--text-color);
}
@media only screen and (max-width: 991px) {
.stick_follow_icon {
width: unset;
height: unset;
position: static;
margin-top: unset;
display: flex;
flex-direction: row-reverse;
justify-content: center;
padding: 40px 0;
align-items: center;
}
.stick_follow_icon p {
top: unset;
left: unset;
width: unset;
height: unset;
white-space: nowrap;
position: relative;
transform: unset;
font-size: 17px;
margin-right: 65px;
}
.stick_follow_icon ul {
margin-bottom: 20px;
}
.stick_follow_icon ul li {
display: inline;
margin-bottom: 29px;
margin-right: 10px;
}
.stick_follow_icon {
width: 100%;
height: auto;
position: static;
margin-top: 40px;
display: flex;
flex-direction: row-reverse;
justify-content: center;
padding: 20px 0;
align-items: center;
background: var(--background-color);
z-index: 1;
}
.stick_follow_icon p {
top: unset;
left: unset;
width: unset;
height: unset;
white-space: nowrap;
position: relative;
transform: unset;
font-size: 17px;
margin-right: 65px;
}
.stick_follow_icon ul {
margin-bottom: 20px;
}
.stick_follow_icon ul li {
display: inline;
margin-bottom: 29px;
margin-right: 10px;
}
}