app/javascript/src/templates/itineraries/thumbnail.handlebars
<div class="col-lg-6">
<div class="card itinerary-thumbnail mb-2" data-itinerary-id="{{id}}">
<div class="itinerary-thumbnail__stroke" style="background-color: {{backgroundColor}}"></div>
<div class="card-body">
<div class="d-flex">
<div class="flex-shrink-0">
<img alt="" class="me-2" height="50" src="{{user.image}}" width="50">
</div>
<div class="flex-grow-1">
<h5 class="mb-0"><a class="pre-line" href="{{url}}">{{title}}</a></h5>
<p>{{user.name}}</p>
</div>
</div>
<p class="card-text">{{#if pink}}<span class="text-pink"> <span class="fas fa-lock"></span> {{translate "activerecord.attributes.itinerary.pink"}} </span><br>{{/if}}{{#if daily}}<br> <span class="fas fa-redo"></span> <span class="text-body-secondary">{{translate "activerecord.attributes.itinerary.daily"}} </span> <span class="fas fa-clock"></span> {{localize "time.formats.time_only" leave_date}} {{else}} <span class="text-body-secondary">{{translate "activerecord.attributes.itinerary.leave_date"}}: </span>{{localize "date.formats.long" leave_date}} <span class="fas fa-clock"></span> {{localize "time.formats.time_only" leave_date}} {{#if round_trip}}<br><span class="text-body-secondary">{{translate "activerecord.attributes.itinerary.return_date"}}: </span>{{localize "date.formats.long" return_date}} <span class="fas fa-clock"></span> {{localize "time.formats.time_only" return_date}}{{/if}}{{/if}}<br><span class="text-body-secondary">{{translate "activerecord.attributes.itinerary.fuel_cost"}}: </span>{{currency fuel_cost}} <br><span class="text-body-secondary">{{translate "activerecord.attributes.itinerary.tolls"}}: </span>{{currency tolls}} </p>
<a class="card-link show-itinerary-on-map" href="#"> <span class="fas fa-map-marker-alt"></span> {{translate "templates.itineraries.show_on_map"}}</a>
<a class="card-link" href="{{url}}"> <span class="fas fa-info-circle"></span> {{translate "templates.itineraries.read_more"}}</a>
</div>
</div>
</div>