Live demo
15
Sep
15th Annual Meeting
- dimanche
- 02:00 PM - 06:00 PM
- Genève
Lorem ipsum dolsit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore...
08
Nov
Joomla World Conference 2019
- vendredi
- 08:30 AM - 06:00 PM
- London
Lorem ipsum dolsit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore...
21
Déc
Christmas Charity Concert
- samedi
- 02:00 PM - 06:00 PM
- Genève
Lorem ipsum dolsit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore...
Links are disabled in the demo
Markup
<?php
/**
* @package Joomla.Site
* @subpackage mod_articles_category
* @Author web-eau.net
* @copyright Copyright (C) 2005 - 2018 Open Source Matters, Inc. All rights reserved.
* @license GNU General Public License version 2 or later; see LICENSE.txt
*/
defined('_JEXEC') or die;
?>
<div class="container">
<?php foreach ($list as $item) : ?>
<div class="row row-striped">
<!-- Date event -->
<div class="col-2 text-right">
<h1 class="display-4"><span class="badge badge-danger"><?php echo JHtml::_('date', $item->created, "d"); ?></span></h1>
<h2 class="text-danger mr-2"><?php echo JHtml::_('date', $item->created, "M"); ?></h2>
</div>
<div class="col-10">
<!-- title -->
<h3 class="text-uppercase"><strong>
<?php if ($params->get('link_titles') == 1) : ?>
<a class="mod-articles-category-title <?php echo $item->active; ?>" href="/<?php echo $item->link; ?>"><?php echo $item->title; ?></a>
<?php else : ?>
<?php echo $item->title; ?>
<?php endif; ?>
</strong></h3>
<!-- custom fields -->
<?php $customFields = FieldsHelper::getFields('com_content.article', $item, true);
foreach ($customFields as $customField){
$customFields[$customField->name] = $customField;
}?>
<ul class="list-inline">
<li class="list-inline-item"><i class="fa fa-calendar-o" aria-hidden="true"></i> <?php echo $customFields['jour']->value; ?></li>
<li class="list-inline-item"><i class="fa fa-clock-o" aria-hidden="true"></i> <?php echo $customFields['horaires']->value; ?></li>
<li class="list-inline-item"><i class="fa fa-location-arrow" aria-hidden="true"></i> <?php echo $customFields['lieu']->value; ?></li>
</ul>
<!-- intro text -->
<?php if ($params->get('show_introtext')) : ?>
<p class="mod-articles-category-introtext">
<?php echo $item->displayIntrotext; ?>
</p>
<?php endif; ?>
</div>
</div>
<?php endforeach; ?>
</div>
CSS
.row-striped:nth-of-type(odd){
background-color: #efefef;
border-left: 4px #000000 solid;
}
.row-striped:nth-of-type(even){
background-color: #ffffff;
border-left: 4px #efefef solid;
}
.row-striped {
padding: 15px 0;
}
Inspiration: https://bootsnipp.com/snippets/mvQbM
(sdc override-upcoming-events.zip)