style(frontend): remove borders and backgrounds from image containers
Make image preview and detail screens transparent Remove borders and padding from entity card marks and profile images
This commit is contained in:
@@ -1802,15 +1802,13 @@ button:disabled,
|
|||||||
min-height: 220px;
|
min-height: 220px;
|
||||||
display: grid;
|
display: grid;
|
||||||
place-items: center;
|
place-items: center;
|
||||||
border: 2px solid rgba(23, 32, 54, 0.18);
|
border: 0;
|
||||||
border-radius: var(--radius-card);
|
border-radius: var(--radius-card);
|
||||||
background:
|
background: transparent;
|
||||||
linear-gradient(135deg, rgba(255, 203, 5, 0.24), rgba(42, 117, 187, 0.12)),
|
|
||||||
#ffffff;
|
|
||||||
}
|
}
|
||||||
|
|
||||||
.pokemon-image-preview__screen img {
|
.pokemon-image-preview__screen img {
|
||||||
width: min(100%, 360px);
|
width: 100%;
|
||||||
max-height: 220px;
|
max-height: 220px;
|
||||||
object-fit: contain;
|
object-fit: contain;
|
||||||
}
|
}
|
||||||
@@ -2471,11 +2469,11 @@ button:disabled,
|
|||||||
font-weight: 950;
|
font-weight: 950;
|
||||||
}
|
}
|
||||||
|
|
||||||
.entity-card__mark--image {
|
.entity-card__mark.entity-card__mark--image {
|
||||||
padding: 3px;
|
padding: 0;
|
||||||
background:
|
border: 0;
|
||||||
linear-gradient(135deg, rgba(255, 203, 5, 0.22), rgba(42, 117, 187, 0.12)),
|
background: transparent;
|
||||||
#ffffff;
|
box-shadow: none;
|
||||||
}
|
}
|
||||||
|
|
||||||
.entity-card__icon {
|
.entity-card__icon {
|
||||||
@@ -5591,6 +5589,12 @@ button:disabled,
|
|||||||
var(--surface-soft);
|
var(--surface-soft);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.entity-detail-image__frame:not(.entity-detail-image__frame--placeholder) {
|
||||||
|
padding: 0;
|
||||||
|
border: 0;
|
||||||
|
background: transparent;
|
||||||
|
}
|
||||||
|
|
||||||
.entity-detail-image__frame img {
|
.entity-detail-image__frame img {
|
||||||
width: 100%;
|
width: 100%;
|
||||||
height: 100%;
|
height: 100%;
|
||||||
@@ -5702,17 +5706,14 @@ button:disabled,
|
|||||||
min-height: 260px;
|
min-height: 260px;
|
||||||
display: grid;
|
display: grid;
|
||||||
place-items: center;
|
place-items: center;
|
||||||
border: 4px solid #172036;
|
border: 0;
|
||||||
border-radius: var(--radius-card);
|
border-radius: var(--radius-card);
|
||||||
background:
|
background: transparent;
|
||||||
linear-gradient(90deg, rgba(42, 117, 187, 0.08) 1px, transparent 1px) 0 0 / 18px 18px,
|
|
||||||
linear-gradient(rgba(42, 117, 187, 0.08) 1px, transparent 1px) 0 0 / 18px 18px,
|
|
||||||
#eef9ff;
|
|
||||||
}
|
}
|
||||||
|
|
||||||
.pokemon-image-detail__screen img {
|
.pokemon-image-detail__screen img {
|
||||||
width: min(100%, 380px);
|
width: 100%;
|
||||||
max-height: 250px;
|
max-height: 260px;
|
||||||
object-fit: contain;
|
object-fit: contain;
|
||||||
}
|
}
|
||||||
|
|
||||||
@@ -5804,6 +5805,13 @@ button:disabled,
|
|||||||
cursor: pointer;
|
cursor: pointer;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.pokemon-profile-image:not(.pokemon-profile-image--placeholder) {
|
||||||
|
padding: 0;
|
||||||
|
border: 0;
|
||||||
|
background: transparent;
|
||||||
|
box-shadow: none;
|
||||||
|
}
|
||||||
|
|
||||||
.pokemon-profile-image:not(.pokemon-profile-image--placeholder):hover,
|
.pokemon-profile-image:not(.pokemon-profile-image--placeholder):hover,
|
||||||
.pokemon-profile-image:not(.pokemon-profile-image--placeholder):focus-visible {
|
.pokemon-profile-image:not(.pokemon-profile-image--placeholder):focus-visible {
|
||||||
border-color: var(--pokemon-blue);
|
border-color: var(--pokemon-blue);
|
||||||
|
|||||||
Reference in New Issue
Block a user