Agenda activities

: mod_articles_news

Live demo

 

Agenda Activities

8:30 am - 11:00 am
Annual meeting

Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut

1:00 pm - 2:00 pm
Lunch with Google Team

Eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud.

5:00 pm - 7:00 pm
Boarding at airport

Consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. 

 

Markup

<?php
	/**
		* @package     Joomla.Site
		* @subpackage  mod_articles_news
		* @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">
    <div class="row">   
		<div class="recent-activities card">
			
			<div class="card-header text-info text-center">
				<h3 class="h4">Agenda Activities</h3> <!-- category title -->
			</div>
			
			<div class="card-body no-padding">	
			
			<?php foreach ($list as $item) : ?>
			
				<div class="item">
					<div class="row">			
			
						<div class="col-4 date-holder text-right">
							<div class="icon"><i class="fa fa-clock-o"></i></div>							
							<div class="date"> 
								<?php $item->urls = new JRegistry($item->urls); ?>
								<span class="text-info"><?php echo $item->urls->get('urlatext'); ?> <!-- text A url --> - <?php echo $item->urls->get('urlbtext'); ?></span><!-- text B url -->
							</div>
						</div>

						<div class="col-8 content">									
							<h5>								
								<a class="mod-articles-category-title <?php echo $item->active; ?>" href="/<?php echo $item->link; ?>"><?php echo $item->title; ?></a>
							</h5>
							<p class="card-text description"><?php echo $item->introtext; ?></p>	
						</div>
					
					</div>
				</div>
			<?php endforeach; ?>
			
			</div>
		</div>
	</div>
</div>

CSS

.recent-activities .item {
    padding: 0 15px;
    border-bottom: 1px solid #eee
}
.recent-activities .item div[class*='col-'] {
    padding: 15px
}
.recent-activities h5 {
    font-weight: 400;
    color: #333
}
.recent-activities p {
    font-size: 0.75em;
    color: #999
}
.recent-activities .icon {
    width: 35px;
    height: 35px;
    line-height: 35px;
    background: #f5f5f5;
    text-align: center;
    display: inline-block
}
.recent-activities .date {
    font-size: 0.75em;
    color: #999;
    padding: 10px
}
.recent-activities .date-holder {
    padding: 0 !important;
    border-right: 1px solid #eee
}
A PROPOS DE L'AUTEUR :
Webmaster freelance passionné par Joomla depuis 2007, Daniel défend la veuve et l'orphelin du web en créant des sites respectueux du W3C. Fort d'une expérience de plusieurs années, il partage ses connaissances dans un état d'esprit open source.
Daniel est également très impliqué dans la communauté Joomla depuis 2014 en étant membre actif de plusieurs projets, conférencier et fondateur du JUG Breizh.