Fix "Mobile tag alignment events", Events overview and register for events page. In the mobile view tags overlapped with the title.

Author: Erik2609

layouts/events/overview.html

@@ -62,22 +62,22 @@
                                                 <div class="col-12 col-lg-2 p-0 mt-0 text-center">
                                                     <img class="img-fluid img-event p-4" src="{{$event.image}}" />
                                                 </div>
-                                                <div class="col pt-3 pb-5" style="background-color: #ffffff;">
+                                                <div class="col py-3" style="background-color: #ffffff;">
                                                     <div class="row align-items-center">
                                                         <h4 class="mb-4 mx-3" style="color: #005aa7;">
                                                             {{$event.title}}
                                                         </h4>
                                                     </div>
-                                                    <div class="row pl-3" style="position: absolute; bottom: 0; font-weight: 300; font-size: 15px;">
+                                                    <div class="row pl-3" style="font-weight: 300; font-size: 15px;">
                                                         {{ if $event.date }}
-                                                        <span class="highlight-red-sm mr-2">
+                                                        <span class="highlight-red-sm m-1">
                                                             {{ $event.date }}
                                                         </span>
                                                         {{ end }}
                                                         {{ range $facet := $event.facets }}
                                                         {{ if $facet.hide }}
                                                         {{ else }}
-                                                        <span class="highlight-red-sm">{{$facet.label}}</span>
+                                                        <span class="highlight-red-sm m-1">{{$facet.label}}</span>
                                                         {{ end }}
                                                         {{end}}
                                                     </div>

layouts/shortcodes/accordion_item_open.html

@@ -5,17 +5,16 @@
                 <div class="col-12 col-lg-2 text-center">
                     <img class="img-fluid img-action" src={{.Get "image"}} />
                 </div>
-                <div class="col pt-3 pb-5 px-5">
+                <div class="col px-5 py-3">
                     <div class="row align-items-center">
                         <h4 class="mb-4 mx-1" style="color: #005aa7;">
                             {{.Get "title"}}
                         </h4>
                     </div>
-                    <div class="row"
-                        style="position: absolute; bottom: 0; font-weight: 300; font-size: 15px;">
+                    <div class="row" style="font-weight: 300; font-size: 15px;">
                         {{ $date := .Get "date" }}
                         {{ if $date }}
-                        <span style="color:#005aa7;" class="mr-1 mb-2 px-2 py-1 mx-1">
+                        <span class="highlight-red-sm m-1">
                             {{ $date }}
                         </span>
                         {{ end }}