View Issue Details

IDProjectCategoryView StatusLast Update
0022131mantisbttimelinepublic2017-01-31 04:02
ReporterdregadAssigned Todregad 
PrioritynormalSeveritytweakReproducibilityalways
Status closedResolutionfixed 
Product Version2.0.0-beta.1 
Target Version2.1.0Fixed in Version2.1.0 
Summary0022131: Remove yellow background in timeline date range
Description

I never liked the yellow background style used for the timeline's date range, it is not used anywhere on the page, and does not look good.

It would be better if the timeline's style was more similar to other boxes shown on the My View page.

TagsNo tags attached.

Activities

dregad

dregad

2017-01-06 18:15

developer   ~0054967

PR https://github.com/mantisbt/mantisbt/pull/985

dregad

dregad

2017-01-24 05:41

developer   ~0055282

Original patch submitted before revising the code based on syncguru's suggestion.



f20-22131-timeline-dates-original.patch (3,418 bytes)
From 38b0d407481f3be5e132e395d466c94a78156ab4 Mon Sep 17 00:00:00 2001
From: Damien Regad <dregad@mantisbt.org>
Date: Sat, 7 Jan 2017 00:05:17 +0100
Subject: [PATCH] Timeline date range and prev/next buttons in title bar

The original layout with the yellow background for the timeline date
range did not look good.

The new layout is similar to the other My View boxes', with the date
range as well as the Prev/Next buttons moved to the widget's title bar;
this also saves screen real estate.

Unlike other boxes' 'View Issues' button, the Prev/Next buttons are not
hidden on xs width.

This also removes 2 seemingly unnecessary divs, previously under widget
body.

Fixes #22031
---
 core/timeline_inc.php | 57 ++++++++++++++++++++++++++++-----------------------
 1 file changed, 31 insertions(+), 26 deletions(-)

diff --git a/core/timeline_inc.php b/core/timeline_inc.php
index 46e18b3..107fd24 100644
--- a/core/timeline_inc.php
+++ b/core/timeline_inc.php
@@ -37,41 +37,46 @@ $t_block_icon = $t_collapse_block ? 'fa-chevron-down' : 'fa-chevron-up';
 	<div class="widget-header widget-header-small">
 		<h4 class="widget-title lighter">
 			<i class="ace-icon fa fa-clock-o"></i>
-			<?php echo lang_get( 'timeline_title' ) ?>
+			<?php
+				echo lang_get( 'timeline_title' );
+
+				# Display date range
+				$t_short_date_format = config_get( 'short_date_format' );
+				echo '<span class="badge"> '
+					. date( $t_short_date_format, $t_start_time )
+					. ' .. '
+					. date( $t_short_date_format, $t_end_time )
+					. ' </span>';
+			?>
 		</h4>
 		<div class="widget-toolbar">
 			<a data-action="collapse" href="#">
 				<i class="1 ace-icon fa <?php echo $t_block_icon ?> bigger-125"></i>
 			</a>
 		</div>
-	</div>
-
-	<div class="widget-body">
-		<div class="widget-toolbox">
-			<div class="btn-toolbar">
+		<div class="widget-toolbar no-border">
+			<div class="widget-menu">
 				<?php
-				$t_short_date_format = config_get( 'short_date_format' );
-				echo '&#160;&#160;';
-				echo '<span class="label label-yellow"> ' . date( $t_short_date_format, $t_start_time ) . ' </span>';
-				echo  ' .. ';
-				echo '<span class="label label-yellow"> ' . date( $t_short_date_format, $t_end_time ) . ' </span>';
-				echo '&#160;&#160;';
-
-				echo '<div class="btn-group">';
-				echo ' <a class="btn btn-primary btn-xs btn-white btn-round" href="my_view_page.php?days=' .
-					( $f_days + 7 ) . '">' . lang_get( 'prev' ) . '</a>';
+					# Display Prev/Next buttons
+					print_small_button(
+						'my_view_page.php?days=' . ( $f_days + 7 ),
+						lang_get( 'prev' )
+					);
 
-				$t_next_days = ( $f_days - 7 ) > 0 ? $f_days - 7 : 0;
-
-				if( $t_next_days != $f_days ) {
-					echo ' <a class="btn btn-primary btn-xs btn-white btn-round" href="my_view_page.php?days=' .
-						$t_next_days . '">' . lang_get( 'next' ) . '</a>';
-				}
-
-			echo '</div></div></div><div class="widget-main no-padding"><div class="profile-feed">';
-
-	echo '</div></div>';
+					$t_next_days = max( $f_days - 7, 0 );
+					if( $t_next_days != $f_days ) {
+						print_small_button(
+							'my_view_page.php?days=' . $t_next_days,
+							lang_get( 'next' )
+						);
+					}
+				?>
+			</div>
+		</div>
+	</div>
 
+	<div class="widget-body">
+<?php
 	if( !$f_all && count( $t_events ) > MAX_EVENTS ) {
 		$t_events = array_slice( $t_events, 0, MAX_EVENTS );
 		timeline_print_events( $t_events );
-- 
1.9.1

Related Changesets

MantisBT: master 078444f4

2017-01-24 05:37:57

dregad

Details Diff
Change timeline dates background color to grey

The original layout with the yellow background for the timeline date
range did not look good.

Fixes 0022031
mod - core/timeline_inc.php Diff File

Issue History

Date Modified Username Field Change
2017-01-06 18:01 dregad New Issue
2017-01-06 18:01 dregad Status new => assigned
2017-01-06 18:01 dregad Assigned To => dregad
2017-01-06 18:15 dregad Note Added: 0054967
2017-01-24 05:41 dregad File Added: f20-22131-timeline-dates-original.patch
2017-01-24 05:41 dregad Note Added: 0055282
2017-01-24 05:52 dregad Target Version 2.0.1 => 2.1.0
2017-01-24 05:53 dregad Summary Make timeline date range display more like other my view boxes => Remove yellow background in timeline date range
2017-01-30 09:46 dregad Changeset attached => MantisBT master 078444f4
2017-01-30 09:46 dregad Status assigned => resolved
2017-01-30 09:46 dregad Resolution open => fixed
2017-01-30 09:46 dregad Fixed in Version => 2.1.0
2017-01-31 04:02 vboctor Status resolved => closed