#1935 user profile design pyro'ya aktarılması

This commit is contained in:
Muammer Top 2020-09-29 14:34:07 +03:00
parent 90062f2659
commit 27372a7d1a
6 changed files with 49 additions and 34 deletions

View File

@ -1,31 +1,33 @@
.profile-section {
.nav-tabs {
border-bottom: 1px solid rgba(#0a001f, .3);
border-bottom: 1px solid #dee2e6;
padding-bottom: 10px;
}
& .nav-link {
.nav-link {
border: none;
border-radius: 0;
font-size: 16px;
color: #BCBDC3;
padding: 0;
margin-bottom: 5px;
&:not(:last-child) {
border-right: 1px solid rgba(#0a001f, .3);
border-right: 1px solid #dee2e6;
}
img{
img {
opacity: .5;
width: 15px;
}
}
& .nav-link.active {
.nav-link.active {
font-size: 17px;
font-weight: bold;
color: #505050;
img{
img {
opacity: 1;
}
}
@ -34,18 +36,18 @@
.tab-content {
color: #707070;
& #nav-profile {
#nav-profile {
& .username {
.username {
font-size: 19px;
font-weight: 600;
}
& .last-login {
.last-login {
font-weight: 400;
}
& img {
img {
width: 165px;
height: 130px;
object-fit: cover;
@ -63,12 +65,21 @@
margin-right: 10px;
}
& input {
input {
border-radius: 4px;
font-size: 13px;
border: 1px solid #E5E5E5;
}
}
@media (max-width: 992px) {
display: block;
& input {
width: 100%;
}
}
}
.account--disable--content {
@ -79,38 +90,31 @@
margin-top: 50px;
padding: 10px;
font-size: .7em;
@media (max-width: 992px) {
width: 100%;
height: auto;
}
button {
button {
font-size: 14px;
height: 34px;
}
}
}
}
@media (max-width: 992px) {
.tab-content {
& #nav-profile {
@media (max-width: 992px) {
.profile--desc {
flex-direction: column;
text-align: center;
}
& img {
width: 15rem;
& > div {
margin-left: 0 !important;
}
}
img {
height: auto;
margin: auto;
}
.profile--form--area {
display: block;
& input {
width: 100%;
}
}
button {
width: 100%;
}

View File

@ -0,0 +1,3 @@
<svg xmlns="http://www.w3.org/2000/svg" width="17.372" height="19.384" viewBox="0 0 17.372 19.384">
<path id="Path_6076" data-name="Path 6076" d="M6892.426,1441.155a.756.756,0,0,1-.183-.749l.905-2.98a.76.76,0,0,1,.189-.316l4.157-4.148a2.272,2.272,0,0,1,3.212,3.213l-4.148,4.14a.752.752,0,0,1-.333.194l-3.056.847a.756.756,0,0,1-.744-.2Zm2.116-3.107-.449,1.481,1.537-.426,2.789-2.783-1.071-1.071Zm4.023-4.014-.146.146,1.071,1.071.146-.146a.757.757,0,0,0-1.071-1.071Zm-11.537,7.35a3.033,3.033,0,0,1-3.029-3.028v-13.326a3.033,3.033,0,0,1,3.029-3.029h9.31a3.032,3.032,0,0,1,3.028,3.029v4.657a.757.757,0,0,1-1.515,0v-4.657a1.516,1.516,0,0,0-1.514-1.515h-9.31a1.517,1.517,0,0,0-1.515,1.515v13.326a1.516,1.516,0,0,0,1.515,1.514h2.532a.757.757,0,0,1,0,1.514Zm.753-7.269a.757.757,0,0,1,0-1.514h4.736a.757.757,0,0,1,0,1.514Zm0-3.029a.757.757,0,0,1,0-1.515h7.8a.757.757,0,1,1,0,1.515Zm0-3.029a.757.757,0,0,1,0-1.514h7.8a.757.757,0,1,1,0,1.514Z" transform="translate(-6883.999 -1422)" fill="#505050"/>
</svg>

After

Width:  |  Height:  |  Size: 998 B

View File

@ -0,0 +1,3 @@
<svg xmlns="http://www.w3.org/2000/svg" width="16.974" height="19.397" viewBox="0 0 16.974 19.397">
<path id="Path_6075" data-name="Path 6075" d="M6887.03,1441.4a3.035,3.035,0,0,1-3.031-3.031v-6.213a3.035,3.035,0,0,1,3.031-3.031h.908v-2.672a4.547,4.547,0,0,1,9.092,0v2.672h.911a3.035,3.035,0,0,1,3.031,3.031v2.8a.758.758,0,0,1-1.516,0v-2.8a1.517,1.517,0,0,0-1.516-1.516H6887.03a1.517,1.517,0,0,0-1.516,1.516v6.213a1.517,1.517,0,0,0,1.516,1.515h10.911a1.517,1.517,0,0,0,1.516-1.515.758.758,0,0,1,1.516,0,3.035,3.035,0,0,1-3.031,3.031Zm2.424-14.947v2.672h6.062v-2.672a3.032,3.032,0,0,0-6.062,0Zm6.538,8.671a.784.784,0,1,1,.784.785A.784.784,0,0,1,6895.992,1435.121Zm-2.915,0a.785.785,0,1,1,.785.785A.785.785,0,0,1,6893.077,1435.121Zm-2.689,0a.731.731,0,1,1,.729.785A.758.758,0,0,1,6890.388,1435.121Zm-2.914,0a.785.785,0,1,1,.785.785A.785.785,0,0,1,6887.474,1435.121Z" transform="translate(-6883.999 -1422)" fill="#505050"/>
</svg>

After

Width:  |  Height:  |  Size: 930 B

View File

Before

Width:  |  Height:  |  Size: 745 B

After

Width:  |  Height:  |  Size: 745 B

View File

@ -0,0 +1,5 @@
<svg id="social" xmlns="http://www.w3.org/2000/svg" width="19.395" height="19.395" viewBox="0 0 19.395 19.395">
<g id="Group_2839" data-name="Group 2839" transform="translate(0)">
<path id="Path_4053" data-name="Path 4053" d="M19.346,16.619a.758.758,0,0,0-1.483.309.792.792,0,0,1-.16.664.77.77,0,0,1-.606.288H2.3a.77.77,0,0,1-.606-.288.791.791,0,0,1-.16-.664A8.371,8.371,0,0,1,9.5,10.3q.1,0,.2,0t.2,0A8.334,8.334,0,0,1,16.63,14a.758.758,0,1,0,1.259-.844,9.855,9.855,0,0,0-5.106-3.88,5.152,5.152,0,1,0-6.167,0A9.854,9.854,0,0,0,.05,16.619,2.3,2.3,0,0,0,2.3,19.395H17.1a2.3,2.3,0,0,0,2.25-2.776ZM6.061,5.152A3.637,3.637,0,1,1,9.882,8.784l-.184,0-.183,0A3.641,3.641,0,0,1,6.061,5.152Z" transform="translate(0)" fill="#505050"/>
</g>
</svg>

After

Width:  |  Height:  |  Size: 745 B

View File

@ -13,25 +13,25 @@
<div class="row px-3">
<!-- User Profile Form Section-->
<div class="col-md-12 mt-5 bg-light profile-section pb-4">
<div class="col-md-12 bg-light profile-section pb-4">
<nav>
<div class="nav nav-tabs nav-fill" id="nav-tab" role="tablist">
<a class="nav-item nav-link active text-dark" id="nav-profile-tab" data-toggle="tab"
href="#nav-profile"
role="tab" aria-controls="nav-profile" aria-selected="true">
<img src="{{ img('visiosoft.module.profile::images/user.svg').url }}" alt="">
<img src="{{ img('visiosoft.module.profile::images/profile2.svg').url }}" alt="">
{{ trans('visiosoft.module.profile::field.profile.name') }}
</a>
<a class="nav-item nav-link text-dark" id="nav-details-tab" data-toggle="tab"
href="#nav-details"
role="tab" aria-controls="nav-details" aria-selected="false">
<img src="{{ img('visiosoft.module.profile::images/detail.svg').url }}" alt="">
<img src="{{ img('visiosoft.module.profile::images/detail2.svg').url }}" alt="">
{{ trans('visiosoft.module.profile::field.details.name') }}
</a>
<a class="nav-item nav-link text-dark" id="nav-password-tab" data-toggle="tab"
href="#nav-password"
role="tab" aria-controls="nav-password" aria-selected="false">
<img src="{{ img('visiosoft.module.profile::images/password.svg').url }}" alt="">
<img src="{{ img('visiosoft.module.profile::images/password2.svg').url }}" alt="">
{{ trans('visiosoft.module.profile::field.password.name') }}
</a>
{{ addBlock('profile/detail/content-tab')|raw }}
@ -75,7 +75,7 @@
{{ userForm.fields.email.input|raw }}
</div>
</div>
<div class="form-group text-right pr-3">
<div class="form-group text-right">
{{ userForm.actions|raw }}
</div>