adding style to the registration profile details

adding event icons to event profile details and stying the profile image
to set max bounds

diff --git a/css/front.css b/css/front.css
index bc8c808..ea46591 100644 (file)
--- a/css/front.css
+++ b/css/front.css
@@ -19,6 +19,12 @@
         padding-left: 0;
     }
 }
+.glm-reg-image-container{
+    padding: 0;
+    max-height: 350px;
+    overflow: hidden;
+    text-align: center;
+}
 .glm-reg-map{
     width: 100%;
     margin: 0;
@@ -42,7 +48,7 @@
 }
 .glm-reg-time::before{
     content: "";
-    background-image: url(../assets/events/calendar-icon-24x24.png);
+    background-image: url(../assets/events/time-icon-24x24.png);
     background-height: 24px;
     background-width: 24px;
     position: absolute;
@@ -50,13 +56,27 @@
     height: 24px;
     left: -36px;
 }
+.glm-reg-location::before{
+    content: "";
+    background-image: url(../assets/events/location-icon-24x24.png);
+    background-height: 24px;
+    background-width: 24px;
+    position: absolute;
+    width: 24px;
+    height: 24px;
+    left: -36px;
+}
+.glm-reg-event-profile-details{
+    margin-bottom: 15px;
+}
 #glm-reg-map-container{
     height: 0px;
     margin: 0;
     overflow: hidden;
 }
 .glm-reg-event-profile-details-container{
-    padding: 0;
+    padding: 0 0 0 50px;
+    
 }
 .glm-reg-class-container{
     padding: 0;

diff --git a/views/front/registrations/registration.html b/views/front/registrations/registration.html
index 1d9bff5..0c2941b 100644 (file)
--- a/views/front/registrations/registration.html
+++ b/views/front/registrations/registration.html
@@ -21,6 +21,7 @@
                 <div class="glm-small-12 glm-medium-4 glm-columns glm-reg-image-container"> 
                     <img src="{$imgBaseUrl}/medium/{$regEvent.image}"/>
                     
+                    
                 </div>
                 {/if}
                 <div class="glm-small-12 glm-medium-4 glm-columns glm-reg-event-profile-details-container">
@@ -32,7 +33,7 @@
                         {else}
                              <div class="glm-small-12 glm-columns glm-reg-event-profile-details glm-reg-time"> {$regEvent.first_datetime.timestamp|date_format:"%l:%M %p"}</div>
                         {/if}
-                        <div class="glm-small-12 glm-columns glm-reg-event-profile-details"> {$regEvent.locations.name}</div>
+                        <div class="glm-small-12 glm-columns glm-reg-event-profile-details glm-reg-location"> {$regEvent.locations.name}</div>
                     </div>
                 </div>