itcn/backend_parkir
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects 1 Releases Wiki Activity

Penambahan FrontEnd All-New-Manufacture

Browse Source
This commit is contained in:
pand03
2026-01-31 14:23:04 +07:00
parent 1b2e320b2b
commit 4feb21dcbc
2891 changed files with 426849 additions and 135 deletions
Download Patch File Download Diff File Expand all files Collapse all files

247
public/scss/pages/_my-profile.scss Normal file
View File

@@ -0,0 +1,247 @@
.profile-back{
position:relative;
img{
width:100%;
height:25rem;
object-fit: cover;
border-radius: 1.25rem;
@include respond ('phone'){
height:20rem;
}
}
.social-btn{
position:absolute;
bottom: 3rem;
#{$dlab-pos-right}: 2rem;
z-index:1;
.social{
background:rgba(239, 239, 239, 0.22);
border:0;
color: $white;
margin-#{$dlab-pos-right}:1rem;
}
.btn{
&:hover{
color:$white;
}
&.btn-light{
&:focus{
color:$white;
}
}
}
@include respond ('tab-port'){
bottom:unset;
top:2rem;
}
@include respond ('phone'){
#{$dlab-pos-right}:0;
padding:0 15px;
.social{
margin-#{$dlab-pos-right}:0.2rem;
margin-bottom:0.5rem;
}
}
.btn.btn-primary{
@include respond ('phone'){
margin-bottom:0.5rem;
}
}
}
&:after{
position:absolute;
content:"";
height:100%;
width:100%;
top:0;
#{$dlab-pos-left}:0;
border-radius:1.25rem;
background: linear-gradient(to bottom, rgba(0,0,0,0.35) 0%,rgba(0,0,0,0.57) 100%);
}
}
.profile-pic{
margin-top: -9rem;
position: relative;
padding-#{$dlab-pos-left}:3rem;
img{
height: 11.688rem;
width: 11.688rem;
border-radius:1.25rem;
border:0.5rem solid $white;
margin-#{$dlab-pos-right}:1.5rem;
}
.profile-info2{
color:$white;
padding-top: 1rem;
h2{
font-size:2rem;
font-weight:600;
color:$white;
@include respond ('phone'){
font-size: 1.25rem;
}
}
h4{
font-size:1rem;
font-weight:500;
color:rgba($white,.8);
@include respond ('phone'){
font-size: 0.875rem;
}
}
}
@include respond ('tab-port'){
margin-top:-8rem;
align-items:center;
img{
height:6.688rem;
width:6.688rem;
margin-#{$dlab-pos-right}:1rem;
border-width:3px;
}
.profile-info2{
padding-top: 0;
}
padding-#{$dlab-pos-left}:1rem;
padding-#{$dlab-pos-right}:1rem;
}
@include respond ('phone'){
margin-top:-6.7rem;
img {
height: 5.688rem;
width: 5.688rem;
border-width: 2px;
border-radius: 10px;
}
}
}
.contacts-social{
span{
i{
height: 2.563rem;
width: 2.563rem;
background: var(--primary);
color: #fff;
border-radius: 2.563rem;
text-align: center;
line-height: 2.563rem;
font-size: 1rem;
display: block;
}
}
}
.bg-facebook{
&.light{
background:rgba(71,113,213,0.15);
color: var(--text-dark);
&:hover{
background-color:#3d6adc;
color:$white;
.text-facebook{
color:$white;
}
}
}
}
.bg-linkedin{
&.light{
background:rgba(14,121,179,0.15);
color: var(--text-dark);
&:hover{
background-color:#0073b1;
color:$white;
.text-linkedin{
color:$white;
}
}
}
}
.bg-dribble{
&.light{
background:rgba(231,85,141,0.15);
color: var(--text-dark);
&:hover{
background-color:#EA4C89;
color:$white;
.text-dribble{
color:$white;
}
}
}
}
.bg-youtube{
&.light{
background:rgba(251,14,14,0.15);
color: var(--text-dark);
&:hover{
background-color:#FF0000;
color:$white;
.text-youtube{
color:$white;
}
}
}
}
.text-facebook{
color:#3D6AD6;
}
.text-linkedin{
color:#0073B1;
}
.text-dribble{
color:#EA4C89;
}
.text-youtube{
color:#FF0000;
}
.text-youtube,
.text-linkedin,
.text-facebook,
.text-dribble{
position:relative;
margin-#{$dlab-pos-right}:35px;
&:after{
position: absolute;
content: "";
background-color: rgba(255, 255, 255, 0.7);
top: -7px;
#{$dlab-pos-left}: 22px;
width: 1px;
height: 31px;
}
}
.upload{
a{
height: 3.313rem;
width: 3.313rem;
border-radius: 2.313rem;
background: rgba(255, 255, 255, 0.2);
display: block;
text-align: center;
line-height: 3.313rem;
font-size: 1.5rem;
color: #fff;
}
}