Fix info-row img not being scaled correctly (#5173)

* Fix info-row img not being scaled correctly

* improve centering when fully colored img-icon is used
This commit is contained in:
Richard Schreiber
2025-05-28 11:44:58 +02:00
committed by GitHub
parent 5fb1fc23ce
commit 72b39932b7
2 changed files with 11 additions and 8 deletions

View File

@@ -4,7 +4,7 @@
{% if ev.location and show_location %}
<div class="info-row">
<div class="info-row-icon" role="img" aria-label="{% trans "Where does the event happen?" %}">
{% icon "map-marker fa-fw" %}
{% icon "map-marker" %}
</div>
<p>
{{ ev.location|linebreaksbr }}
@@ -14,7 +14,7 @@
{% if ev.settings.show_dates_on_frontpage %}
<div class="info-row">
<div class="info-row-icon" role="img" aria-label="{% trans "When does the event happen?" %}">
{% icon "clock-o fa-fw" %}
{% icon "clock-o" %}
</div>
<p>
{{ ev.get_date_range_display_as_html }}

View File

@@ -295,18 +295,21 @@ a:hover .panel-primary > .panel-heading {
min-height: 30px;
margin-bottom: 10px;
.info-row-icon {
.info-row-icon,
& > img {
position: absolute;
top: -5px;
left: 0;
top: -6px;
left: 3px;
font-size: 26px;
text-align: center;
color: $brand-primary;
margin-top: 3px;
width: 26px;
height: auto;
.fa {
vertical-align: top;
}
}
.info-row-icon .fa {
vertical-align: top;
width: auto;
}
p {
margin-left: 40px;