ricardogj08
/
nabu
1
0
Fork 0
Code Issues Pull Requests Projects Releases Activity

[Arreglar] la imagen de perfi dimensiones y posicionamiento

This commit is contained in:
francisco-solis99 2022-05-18 19:17:43 -05:00
parent da791f553b
commit e4db64de6e
6 changed files with 33 additions and 43 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

10
assets/styles/pages/edit-profile/edit-profile-desktop.css
View File

@ -29,18 +29,12 @@ header {
}
.profile-own__image-wrapper {
width: 50%;
}
.profile-own__image {
width: 100%;
height: 100%;
object-fit: contain;
max-width: 180px;
}
/* Estilos para los bototnes de editar fotos de perfil y fondo */
.edit__field-avatar::before {
top: -100px;
top: -120px;
font-size: 2.8rem;
}

13
assets/styles/pages/edit-profile/edit-profile.css
View File

@ -66,11 +66,9 @@ header::before {
}
.profile-own__image-wrapper {
display: flex;
width: 45%;
min-width: 40px;
max-width: 200px;
border-radius: 50%;
display: inline-flex;
max-width: 120px;
border-radius: 100%;
overflow: hidden;
background-color: var(--color-black);
}
@ -78,8 +76,9 @@ header::before {
.profile-own__image {
width: 100%;
height: 100%;
object-fit: contain;
object-fit: cover;
filter: opacity(0.7);
aspect-ratio: 1 / 1;
}
.profile-own__title {
@ -142,7 +141,7 @@ input[type="file"] {
}
.edit__field-avatar::before {
top: -70px;
top: -80px;
left: 50%;
transform: translateX(-50%);
font-size: 1.8rem;

14
assets/styles/pages/profile/profile-desktop.css
View File

@ -47,7 +47,7 @@ header {
} */
.profile-own {
bottom: -125px;
bottom: -135px;
}
.profile-own__title {
@ -60,22 +60,16 @@ header {
}
.profile-own__image-wrapper {
width: 50%;
}
.profile-own__image {
width: 100%;
height: 100%;
object-fit: contain;
max-width: 150px;
}
.profile__link-edit {
right: 35px;
right: 15px;
font-size: 2.8rem;
}
.public-posts {
margin-top: 140px;
margin-top: 160px;
}
.public-posts__title {

26
assets/styles/pages/profile/profile.css
View File

@ -81,26 +81,25 @@ header::before {
align-items: center;
justify-content: center;
position: absolute;
bottom: -105px;
bottom: -120px;
left: 50%;
transform: translateX(-50%);
z-index: 1;
/* background-color: tomato; */
}
.profile-own__image-wrapper {
display: flex;
width: 45%;
min-width: 40px;
max-width: 200px;
border-radius: 50%;
display: inline-flex;
max-width: 120px;
border-radius: 100%;
overflow: hidden;
background-color: var(--color-black);
}
.profile-own__image {
width: 100%;
height: 100%;
object-fit: contain;
object-fit: cover;
aspect-ratio: 1 / 1;
}
.profile-own__title {
@ -113,15 +112,22 @@ header::before {
}
.profile__link-edit {
width: 25px;
height: 25px;
display: inline-flex;
justify-content: center;
align-items: center;
position: absolute;
right: 25px;
font-size: 2.4rem;
text-decoration: none;
color: var(--color-black);
color: var(--color-background);
background-color: rgba(0, 0, 0, .6);
border-radius: 100%;
}
.public-posts {
margin-top: 110px;
margin-top: 150px;
width: 100%;
min-width: 320px;
padding: 23px 0;

9
assets/styles/pages/signup/signup.css
View File

@ -25,13 +25,12 @@
* Metodología => BEM
*/
html {
/* html {
position: relative;
min-height: 100%;
}
} */
body {
margin-bottom: 90px;
background-color: rgba(0, 183, 255, 0.4);
background-size: cover;
background-repeat: no-repeat;
@ -188,10 +187,8 @@ body {
/* Cambia los estilos del footer */
.footer {
position: absolute;
bottom: 0;
width: 100%;
background-color: var(--color-black);
bottom: auto;
}
.footer .rights {

4
views/pages/edit-profile.php
View File

@ -55,11 +55,11 @@
<input type="hidden" name="csrf" value="<?= $token ?>">
<label for="avatar" class="edit__field-out edit__field-avatar">
<input type="file" id="avatar" name="avatar" accept="<?= NABU_DEFAULT['image-formats'] ?>" class='edit__btn-photo btn-photo'>
<input type="file" id="avatar" name="avatar" accept="<?= NABU_DEFAULT['image-formats'] ?>" class='edit__btn-photo'>
</label>
<label for="background" class="edit__field-out edit__field-background">
<input type="file" id="background" name="background" accept="<?= NABU_DEFAULT['image-formats'] ?>" class='edit__btn-photo btn-backPhoto'>
<input type="file" id="background" name="background" accept="<?= NABU_DEFAULT['image-formats'] ?>" class='edit__btn-photo'>
</label>