Commit 6e25089e authored by Roisin Pearson's avatar Roisin Pearson Committed by Cecilia Vela Gurovic
Browse files

Bug #1742347 Editing overall style of timeline



Change-Id: Ia33e77d4892b6599c6533f165c18a244f8fad849
Signed-off-by: default avatarRoisin Pearson <roisinpearson@catalyst.net.nz>
parent 3e5c72e8
...@@ -11,3 +11,5 @@ Changes: ...@@ -11,3 +11,5 @@ Changes:
* Removed demo examples * Removed demo examples
* Adjusted ajax setting to accept parameters from Mahara * Adjusted ajax setting to accept parameters from Mahara
* Moved the css styles to htdocs/theme/raw/sass/features/_timeline.scss
* Added prev / next arrows for the events
/* -------------------------------- /* --------------------------------
NOTE: These styles are now used in htdocs/theme/raw/sass/features/_timeline.sass
Please update the styles there and not here - this is just kept to help upgrade process
Primary style Primary style
......
...@@ -46,6 +46,7 @@ ...@@ -46,6 +46,7 @@
timelineComponents['timelineDates'] = parseDate(timelineComponents['timelineEvents']); timelineComponents['timelineDates'] = parseDate(timelineComponents['timelineEvents']);
timelineComponents['eventsMinLapse'] = minLapse(timelineComponents['timelineDates']); timelineComponents['eventsMinLapse'] = minLapse(timelineComponents['timelineDates']);
timelineComponents['timelineNavigation'] = timeline.find('.cd-timeline-navigation'); timelineComponents['timelineNavigation'] = timeline.find('.cd-timeline-navigation');
timelineComponents['timelineNavigationViewport'] = timeline.find('.cd-timeline-navigation-second');
timelineComponents['eventsContent'] = timeline.children('.events-content'); timelineComponents['eventsContent'] = timeline.children('.events-content');
//assign a left postion to the single events along the timeline //assign a left postion to the single events along the timeline
setDatePosition(timelineComponents, options.eventsMinDistance); setDatePosition(timelineComponents, options.eventsMinDistance);
...@@ -73,6 +74,41 @@ ...@@ -73,6 +74,41 @@
updateFilling($(this), timelineComponents['fillingLine'], timelineTotWidth); updateFilling($(this), timelineComponents['fillingLine'], timelineTotWidth);
updateVisibleContent($(this), timelineComponents['eventsContent']); updateVisibleContent($(this), timelineComponents['eventsContent']);
}); });
//detect click on the next viewport arrow
timelineComponents['timelineNavigationViewport'].on('click', '.next', function (event) {
event.preventDefault();
// $().addClass('selected');
var currentSelected = $('#jtlinesection .events a.selected');
currentSelected.removeClass('selected');
console.log(currentSelected);
var nextSelected = currentSelected.closest('li').next().find('a');
nextSelected.addClass('selected');
console.log(nextSelected);
updateOlderEvents(nextSelected);
updateFilling(nextSelected, timelineComponents['fillingLine'], timelineTotWidth);
updateVisibleContent(nextSelected, timelineComponents['eventsContent']);
updateSlide(timelineComponents, timelineTotWidth, 'next');
});
//detect click on the prev viewport arrow
timelineComponents['timelineNavigationViewport'].on('click', '.prev', function (event) {
event.preventDefault();
var currentSelected = $('#jtlinesection .events ol li a.selected');
currentSelected.removeClass('selected');
console.log(currentSelected);
var nextSelected = currentSelected.closest('li').next().find('a');
nextSelected.removeClass('selected');
var prevSelected = currentSelected.closest('li').prev().find('a');
prevSelected.addClass('selected');
updateOlderEvents(prevSelected);
updateFilling(prevSelected, timelineComponents['fillingLine'], timelineTotWidth);
updateVisibleContent(prevSelected, timelineComponents['eventsContent']);
updateSlide(timelineComponents, timelineTotWidth, 'prev');
// prevSelected.removeClass('older-event');
console.log(prevSelected);
});
//on swipe, show next/prev event content //on swipe, show next/prev event content
timelineComponents['eventsContent'].on('swipeleft', function () { timelineComponents['eventsContent'].on('swipeleft', function () {
...@@ -110,6 +146,10 @@ ...@@ -110,6 +146,10 @@
var visibleContent = timelineComponents['eventsContent'].find('.selected'), var visibleContent = timelineComponents['eventsContent'].find('.selected'),
newContent = (string == 'next') ? visibleContent.next() : visibleContent.prev(); newContent = (string == 'next') ? visibleContent.next() : visibleContent.prev();
var showOldContent = function (timelineComponents, timelineTotWidth, string) {
var visibleContent = timelineComponents['eventsContent'].find('.selected'),
oldContent = (string == 'prev') ? visibleContent.prev() : visibleContent.next();
if (newContent.length > 0) { //if there's a next/prev event - show it if (newContent.length > 0) { //if there's a next/prev event - show it
var selectedDate = timelineComponents['eventsWrapper'].find('.selected'), var selectedDate = timelineComponents['eventsWrapper'].find('.selected'),
newEvent = (string == 'next') ? selectedDate.parent('li').next('li').children('a') : selectedDate.parent('li').prev('li').children('a'); newEvent = (string == 'next') ? selectedDate.parent('li').next('li').children('a') : selectedDate.parent('li').prev('li').children('a');
...@@ -122,6 +162,7 @@ ...@@ -122,6 +162,7 @@
updateTimelinePosition(string, newEvent, timelineComponents); updateTimelinePosition(string, newEvent, timelineComponents);
} }
} }
}
var updateTimelinePosition = function (string, event, timelineComponents) { var updateTimelinePosition = function (string, event, timelineComponents) {
//translate timeline to the left/right according to the position of the selected event //translate timeline to the left/right according to the position of the selected event
...@@ -144,6 +185,8 @@ ...@@ -144,6 +185,8 @@
//update navigation arrows visibility //update navigation arrows visibility
(value == 0) ? timelineComponents['timelineNavigation'].find('.prev').addClass('inactive') : timelineComponents['timelineNavigation'].find('.prev').removeClass('inactive'); (value == 0) ? timelineComponents['timelineNavigation'].find('.prev').addClass('inactive') : timelineComponents['timelineNavigation'].find('.prev').removeClass('inactive');
(value == totWidth) ? timelineComponents['timelineNavigation'].find('.next').addClass('inactive') : timelineComponents['timelineNavigation'].find('.next').removeClass('inactive'); (value == totWidth) ? timelineComponents['timelineNavigation'].find('.next').addClass('inactive') : timelineComponents['timelineNavigation'].find('.next').removeClass('inactive');
(value == 0) ? timelineComponents['timelineNavigationViewport'].find('.prev').addClass('inactive') : timelineComponents['timelineNavigationViewport'].find('.prev').removeClass('inactive');
(value == totWidth) ? timelineComponents['timelineNavigationViewport'].find('.next').addClass('inactive') : timelineComponents['timelineNavigationViewport'].find('.next').removeClass('inactive');
} }
var updateFilling = function (selectedEvent, filling, totWidth) { var updateFilling = function (selectedEvent, filling, totWidth) {
...@@ -237,10 +280,11 @@ ...@@ -237,10 +280,11 @@
classLeaving = 'leave-right'; classLeaving = 'leave-right';
} }
selectedContent.attr('class', classEnetering); selectedContent.addClass(classEnetering);
visibleContent.attr('class', classLeaving).one('webkitAnimationEnd oanimationend msAnimationEnd animationend', function () { visibleContent.addClass(classLeaving).one('webkitAnimationEnd oanimationend msAnimationEnd animationend', function () {
visibleContent.removeClass('leave-right leave-left'); visibleContent.removeClass('leave-right leave-left selected');
selectedContent.removeClass('enter-left enter-right'); selectedContent.removeClass('enter-left enter-right');
selectedContent.addClass('selected');
}); });
eventsContent.css('height', selectedContentHeight + 'px'); eventsContent.css('height', selectedContentHeight + 'px');
} }
...@@ -431,8 +475,12 @@ ...@@ -431,8 +475,12 @@
$liTimeLineCollection += point.pointCnt + '</a></li>'; $liTimeLineCollection += point.pointCnt + '</a></li>';
// ----------------- // -----------------
$liEventContentCollection += '<li '; $liEventContentCollection += '<li ';
if (isSelectedPoint) if (isSelectedPoint) {
$liEventContentCollection += 'class="selected"'; $liEventContentCollection += 'class="lineli selected"';
}
else {
$liEventContentCollection += 'class="lineli"';
}
$liEventContentCollection += ' data-date="' + point.dateValue + '">' + formatTitle(point.title, dataCollection[i]) + formatSubTitle(point.subTitle, dataCollection[i]) + formatBodyContent(point.bodyCnt, dataCollection[i]) + '</li>'; $liEventContentCollection += ' data-date="' + point.dateValue + '">' + formatTitle(point.title, dataCollection[i]) + formatSubTitle(point.subTitle, dataCollection[i]) + formatBodyContent(point.bodyCnt, dataCollection[i]) + '</li>';
} }
...@@ -442,8 +490,8 @@ ...@@ -442,8 +490,8 @@
var $container = $(mainObject); var $container = $(mainObject);
var $sectionStart = '<section id="jtlinesection" class="jtline">'; var $sectionStart = '<section id="jtlinesection" class="jtline">';
var $timeline = '<div class="timeline"><div class="events-wrapper"><div class="events"><ol>' + $liTimeLineCollection + '</ol><span class="filling-line" aria-hidden="true"></span></div></div><ul class="cd-timeline-navigation"><li><a href="#0" class="prev inactive">Prev</a></li><li><a href="#0" class="next">Next</a></li></ul></div>'; var $timeline = '<div class="timeline"><div class="events-wrapper"><div class="events"><ol>' + $liTimeLineCollection + '</ol><span class="filling-line" aria-hidden="true"></span></div></div><ul class="cd-timeline-navigation"><li class="lineli"><a href="#0" class="prev inactive">Prev</a></li><li lineli><a href="#0" class="next">Next</a></li></ul></div>';
var $eventsContent = '<div class="events-content"><ol>' + $liEventContentCollection + '</ol></div>'; var $eventsContent = '<div class="events-content"><ol>' + $liEventContentCollection + '</ol><ul class="cd-timeline-navigation-second"><li><a href="#0" class="prev inactive">Prev</a></li><li><a href="#0" class="next">Next</a></li></ul></div>';
var $sectionEnd = '</section>'; var $sectionEnd = '</section>';
var allHtml = $sectionStart + $timeline + $eventsContent + $sectionEnd; var allHtml = $sectionStart + $timeline + $eventsContent + $sectionEnd;
...@@ -477,7 +525,7 @@ ...@@ -477,7 +525,7 @@
if (formatBodyCnt) if (formatBodyCnt)
return options.formatBodyContent(bodyCnt, obj); return options.formatBodyContent(bodyCnt, obj);
else else
return '<p>' + bodyCnt + '</p>'; return '<p class="linep">' + bodyCnt + '</p>';
} }
var _attacheEvents = function () { var _attacheEvents = function () {
......
...@@ -254,6 +254,7 @@ $string['blocknotinview'] = 'The block with ID "%d" is not in the page.'; ...@@ -254,6 +254,7 @@ $string['blocknotinview'] = 'The block with ID "%d" is not in the page.';
$string['viewcreatedsuccessfully'] = 'Page created successfully'; $string['viewcreatedsuccessfully'] = 'Page created successfully';
$string['viewaccesseditedsuccessfully'] = 'Page access saved successfully'; $string['viewaccesseditedsuccessfully'] = 'Page access saved successfully';
$string['viewsavedsuccessfully'] = 'Page saved successfully'; $string['viewsavedsuccessfully'] = 'Page saved successfully';
$string['savedtotimeline'] = 'Saved to timeline';
$string['updatedaccessfornumviews1'] = array( $string['updatedaccessfornumviews1'] = array(
'Access rules were updated for 1 page.', 'Access rules were updated for 1 page.',
'Access rules were updated for %d pages.', 'Access rules were updated for %d pages.',
...@@ -520,3 +521,6 @@ $string['advanced'] = 'Advanced'; ...@@ -520,3 +521,6 @@ $string['advanced'] = 'Advanced';
// Versioning strings // Versioning strings
$string['timeline'] = 'Timeline'; $string['timeline'] = 'Timeline';
$string['timelinespecific'] = 'Timeline for %s';
$string['savetimeline'] = 'Save to timeline';
$string['savetimelinespecific'] = 'Save timeline for %s';
...@@ -7082,7 +7082,8 @@ class View { ...@@ -7082,7 +7082,8 @@ class View {
if ($records = get_records_sql_array("SELECT vv.*, v.title AS viewname, v.owner, v.institution if ($records = get_records_sql_array("SELECT vv.*, v.title AS viewname, v.owner, v.institution
FROM {view_versioning} vv FROM {view_versioning} vv
JOIN {view} v ON v.id = vv.view JOIN {view} v ON v.id = vv.view
WHERE vv.ctime < ? AND vv.ctime > ? AND vv.view = ?", array($todate, $fromdate, $view))) { WHERE vv.ctime < ? AND vv.ctime > ? AND vv.view = ?
ORDER BY vv.ctime ASC", array($todate, $fromdate, $view))) {
$versions->count = count($records); $versions->count = count($records);
$versions->data = $records; $versions->data = $records;
} }
...@@ -7091,7 +7092,8 @@ class View { ...@@ -7091,7 +7092,8 @@ class View {
if ($records = get_records_sql_array("SELECT vv.*,v.title AS viewname, v.owner, v.institution if ($records = get_records_sql_array("SELECT vv.*,v.title AS viewname, v.owner, v.institution
FROM {view_versioning} vv FROM {view_versioning} vv
JOIN {view} v ON v.id = vv.view JOIN {view} v ON v.id = vv.view
WHERE vv.view = ?", array($view))) { WHERE vv.view = ?
ORDER BY vv.ctime ASC", array($view))) {
$versions->count = count($records); $versions->count = count($records);
$versions->data = $records; $versions->data = $records;
} }
...@@ -7104,12 +7106,12 @@ class View { ...@@ -7104,12 +7106,12 @@ class View {
require_once('pieforms/pieform/elements/calendar.php'); require_once('pieforms/pieform/elements/calendar.php');
$elements = array( $elements = array(
'from' => array( 'from' => array(
'title' => get_string('from'), 'title' => get_string('From'),
'type' => 'calendar', 'type' => 'calendar',
'defaultvalue' => strtotime($from), 'defaultvalue' => strtotime($from),
), ),
'to' => array( 'to' => array(
'title' => get_string('to'), 'title' => get_string('To'),
'type' => 'calendar', 'type' => 'calendar',
'defaultvalue' => strtotime($to), 'defaultvalue' => strtotime($to),
), ),
...@@ -7134,8 +7136,60 @@ class View { ...@@ -7134,8 +7136,60 @@ class View {
public function build_timeline_results($search, $offset, $limit) { public function build_timeline_results($search, $offset, $limit) {
return false; return false;
} }
public function format_versioning_data($data) {
if (empty($data)) {
return $data;
}
$data=json_decode($data);
$this->numrows = isset($data->numrows) ? $data->numrows : $this->numrows;
$this->layout = isset($data->layout) ? $data->layout : $this->layout;
$this->description = isset($data->description) ? $data->description : '';
$this->tags = isset($data->tags) && is_array($data->tags) ? $data->tags : array();
$colsperrow = array();
if (isset($data->columnsperrow)) {
foreach ($data->columnsperrow as $k=>$v){
$colsperrow[$k] = $v;
}
}
$this->columnsperrow = $colsperrow;
$this->columns = array();
for ($i = 1; $i <= $this->numrows; $i++) {
for ($j = 1; $j <= $data->columnsperrow->{$i}->columns; $j++) {
$this->columns[$i][$j] = array('blockinstances' => array());
}
}
$html = '';
if (!empty($data->blocks)) {
require_once(get_config('docroot') . 'blocktype/lib.php');
foreach ($data->blocks as $k => $v) {
// log_debug($k . ': ' . $v->blocktype);
safe_require('blocktype', $v->blocktype);
$bi = new BlockInstance(0,
array(
'blocktype' => $v->blocktype,
'title' => $v->title,
'view' => $this->get('id'),
'view_obj' => $this,
'row' => $v->row,
'column' => $v->column,
'order' => $v->order,
'configdata' => serialize((array)$v->configdata),
)
);
// $html .= call_static_method(generate_class_name("blocktype", $v->blocktype), "render_instance", $bi);
$this->columns[$v->row][$v->column]['blockinstances'][] = $bi;
}
}
$html = $this->build_rows(true);
// log_debug($html);
$data->html = $html;
return $data;
}
} }
class ViewSubmissionException extends UserException { class ViewSubmissionException extends UserException {
public function strings() { public function strings() {
return array_merge( return array_merge(
......
...@@ -388,6 +388,7 @@ td.action-list-copy { ...@@ -388,6 +388,7 @@ td.action-list-copy {
padding: 1px 4px; padding: 1px 4px;
} }
// Tinymce primary button // Tinymce primary button
.mce-container, .mce-container,
.mce-widget, .mce-widget,
......
...@@ -24,7 +24,7 @@ Main Components ...@@ -24,7 +24,7 @@ Main Components
position: relative; position: relative;
height: 100px; height: 100px;
width: 100%; width: 100%;
max-width: 850px; max-width: 1150px;
margin: 0 auto; margin: 0 auto;
} }
.jtline .events-wrapper { .jtline .events-wrapper {
...@@ -44,13 +44,11 @@ Main Components ...@@ -44,13 +44,11 @@ Main Components
} }
.jtline .events-wrapper::before { .jtline .events-wrapper::before {
left: 0; left: 0;
background-image: -webkit-linear-gradient( left , #f8f8f8, rgba(248, 248, 248, 0));
background-image: linear-gradient(to right, #f8f8f8, rgba(248, 248, 248, 0));
} }
.jtline .events-wrapper::after { .jtline .events-wrapper::after {
right: 0; right: 0;
background-image: -webkit-linear-gradient( right , #f8f8f8, rgba(248, 248, 248, 0)); // background-image: -webkit-linear-gradient( right , #f8f8f8, rgba(248, 248, 248, 0));
background-image: linear-gradient(to left, #f8f8f8, rgba(248, 248, 248, 0)); // background-image: linear-gradient(to left, #f8f8f8, rgba(248, 248, 248, 0));
} }
.jtline .events { .jtline .events {
/* this is the grey line/timeline */ /* this is the grey line/timeline */
...@@ -148,10 +146,17 @@ Main Components ...@@ -148,10 +146,17 @@ Main Components
} }
} }
.cd-timeline-navigation a { ul.cd-timeline-navigation-second{
list-style-type: none !important;
padding: 0;
margin:0;
}
.cd-timeline-navigation a,
.cd-timeline-navigation-second a {
/* these are the left/right arrows to navigate the timeline */ /* these are the left/right arrows to navigate the timeline */
position: absolute; position: absolute;
z-index: 1; z-index: 8;
top: 50%; top: 50%;
bottom: auto; bottom: auto;
-webkit-transform: translateY(-50%); -webkit-transform: translateY(-50%);
...@@ -163,6 +168,7 @@ Main Components ...@@ -163,6 +168,7 @@ Main Components
width: 34px; width: 34px;
border-radius: 50%; border-radius: 50%;
border: 2px solid #dfdfdf; border: 2px solid #dfdfdf;
list-style-type: none !important;
/* replace text with an icon */ /* replace text with an icon */
overflow: hidden; overflow: hidden;
color: transparent; color: transparent;
...@@ -172,7 +178,12 @@ Main Components ...@@ -172,7 +178,12 @@ Main Components
-moz-transition: border-color 0.3s; -moz-transition: border-color 0.3s;
transition: border-color 0.3s; transition: border-color 0.3s;
} }
.cd-timeline-navigation a::after {
.cd-timeline-navigation-second a {
}
.cd-timeline-navigation a::after,
.cd-timeline-navigation-second a::after {
/* arrow icon */ /* arrow icon */
content: ''; content: '';
position: absolute; position: absolute;
...@@ -189,7 +200,8 @@ Main Components ...@@ -189,7 +200,8 @@ Main Components
transform: translateX(-50%) translateY(-50%); transform: translateX(-50%) translateY(-50%);
background: url(../../raw/images/cd-arrow.svg) no-repeat 0 0; background: url(../../raw/images/cd-arrow.svg) no-repeat 0 0;
} }
.cd-timeline-navigation a.prev { .cd-timeline-navigation a.prev,
.cd-timeline-navigation-second a.prev {
left: 0; left: 0;
-webkit-transform: translateY(-50%) rotate(180deg); -webkit-transform: translateY(-50%) rotate(180deg);
-moz-transform: translateY(-50%) rotate(180deg); -moz-transform: translateY(-50%) rotate(180deg);
...@@ -197,24 +209,29 @@ Main Components ...@@ -197,24 +209,29 @@ Main Components
-o-transform: translateY(-50%) rotate(180deg); -o-transform: translateY(-50%) rotate(180deg);
transform: translateY(-50%) rotate(180deg); transform: translateY(-50%) rotate(180deg);
} }
.cd-timeline-navigation a.next { .cd-timeline-navigation a.next,
.cd-timeline-navigation-second a.next {
right: 0; right: 0;
} }
.no-touch .cd-timeline-navigation a:hover { .no-touch .cd-timeline-navigation a:hover,
.no-touch .cd-timeline-navigation-second a:hover {
border-color: #7b9d6f; border-color: #7b9d6f;
} }
.cd-timeline-navigation a.inactive { .cd-timeline-navigation a.inactive,
.cd-timeline-navigation-second a.inactive {
cursor: not-allowed; cursor: not-allowed;
} }
.cd-timeline-navigation a.inactive::after { .cd-timeline-navigation a.inactive::after,
.cd-timeline-navigation-second a.inactive::after {
background-position: 0 -16px; background-position: 0 -16px;
} }
.no-touch .cd-timeline-navigation a.inactive:hover { .no-touch .cd-timeline-navigation a.inactive:hover,
.no-touch .cd-timeline-navigation-second a.inactive:hover {
border-color: #dfdfdf; border-color: #dfdfdf;
} }
.jtline .events-content { .jtline .events-content {
width:800px; // width:900px;
margin:0 auto; margin:0 auto;
position: relative; position: relative;
...@@ -223,7 +240,7 @@ Main Components ...@@ -223,7 +240,7 @@ Main Components
-moz-transition: height 0.4s; -moz-transition: height 0.4s;
transition: height 0.4s; transition: height 0.4s;
} }
.jtline .events-content li { .jtline .events-content li.lineli {
position: absolute; position: absolute;
z-index: 1; z-index: 1;
width: 100%; width: 100%;
...@@ -241,7 +258,9 @@ Main Components ...@@ -241,7 +258,9 @@ Main Components
-webkit-animation-timing-function: ease-in-out; -webkit-animation-timing-function: ease-in-out;
-moz-animation-timing-function: ease-in-out; -moz-animation-timing-function: ease-in-out;
animation-timing-function: ease-in-out; animation-timing-function: ease-in-out;
list-style: none !important;
} }
.jtline .events-content li.selected { .jtline .events-content li.selected {
/* visible event content */ /* visible event content */
position: relative; position: relative;
...@@ -273,15 +292,30 @@ Main Components ...@@ -273,15 +292,30 @@ Main Components
list-style: none !important; list-style: none !important;
} }
.jtline .timeline .cd-timeline-navigation { .jtline .events a:hover {
outline-color: #000;
}
.jtline .timeline .cd-timeline-navigation,
.jtline .timeline .cd-timeline-navigation-second {
list-style: none !important; list-style: none !important;
} }
.jtline .timeline .cd-timeline-navigation ul li,
.jtline #jtlinesection .timeline .cd-timeline-navigation-second li {
list-style-type: none !important;
}
.jtline .timeline ol, .ListeOL { .jtline .timeline ol, .ListeOL {
list-style: none !important; // list-style: none !important;
margin: 0 0 0 0; margin: 0 0 0 0;
padding: 50px; padding: 50px;
} }
.jtline .events-content ol {
// margin: 2px;
}
.jtline .events-content h2 { .jtline .events-content h2 {
font-weight: bold; font-weight: bold;
font-size: 2.6rem; font-size: 2.6rem;
...@@ -298,11 +332,11 @@ padding: 50px; ...@@ -298,11 +332,11 @@ padding: 50px;
.jtline .events-content em::before { .jtline .events-content em::before {
content: '- '; content: '- ';
} }
.jtline .events-content p { .jtline .events-content p.linep {
font-size: 1.4rem; font-size: 1.4rem;
color: #959595; color: #959595;
} }
.jtline .events-content em, .jtline .events-content p { .jtline .events-content em, .jtline .events-content p.linep {
line-height: 1.6; line-height: 1.6;
} }
@media only screen and (min-width: 768px) { @media only screen and (min-width: 768px) {
...@@ -312,7 +346,7 @@ padding: 50px; ...@@ -312,7 +346,7 @@ padding: 50px;
.jtline .events-content em { .jtline .events-content em {