Issue #161 : amélioration rendu

Le titre se fait plus discret dans la barre de la date
La date disparaît en mode mobile

3 files changed, 62 insertions, 27 deletions

diff --git a/app/views/helpers/view/normal_view.phtml b/app/views/helpers/view/normal_view.phtml
index 4299b5fdb..43e5c0cd2 100644
--- a/app/views/helpers/view/normal_view.phtml
+++ b/app/views/helpers/view/normal_view.phtml
@@ -16,13 +16,24 @@ if (isset ($this->entryPaginator) && !$this->entryPaginator->isEmpty ()) {
 	<?php foreach ($items as $item) { ?>
 
 	<?php if ($display_today && $item->isDay (Days::TODAY)) { ?>
-	<div class="day"><?php echo Translate::t ('today'); ?> - <?php echo timestamptodate (time (), false); ?> : <em><?php echo $this->currentName; ?></em></div>
+	<div class="day">
+		<?php echo Translate::t ('today'); ?>
+		<span class="date"> - <?php echo timestamptodate (time (), false); ?></span>
+		<span class="name"><?php echo $this->currentName; ?></span>
+	</div>
 	<?php $display_today = false; } ?>
 	<?php if ($display_yesterday && $item->isDay (Days::YESTERDAY)) { ?>
-	<div class="day"><?php echo Translate::t ('yesterday'); ?> - <?php echo timestamptodate (time () - 86400, false); ?> : <em><?php echo $this->currentName; ?></em></div>
+	<div class="day">
+		<?php echo Translate::t ('yesterday'); ?>
+		<span class="date"> - <?php echo timestamptodate (time () - 86400, false); ?></span>
+		<span class="name"><?php echo $this->currentName; ?></span>
+	</div>
 	<?php $display_yesterday = false; } ?>
 	<?php if ($display_others && $item->isDay (Days::BEFORE_YESTERDAY)) { ?>
-	<div class="day"><?php echo Translate::t ('before_yesterday'); ?> : <em><?php echo $this->currentName; ?></em></div>
+	<div class="day">
+		<?php echo Translate::t ('before_yesterday'); ?>
+		<span class="name"><?php echo $this->currentName; ?></span>
+	</div>
 	<?php $display_others = false; } ?>
 
 	<div class="flux<?php echo !$item->isRead () ? ' not_read' : ''; ?><?php echo $item->isFavorite () ? ' favorite' : ''; ?>" id="flux_<?php echo $item->id (); ?>">
diff --git a/public/themes/default/freshrss.css b/public/themes/default/freshrss.css
index 23838c016..a108ff3f6 100644
--- a/public/themes/default/freshrss.css
+++ b/public/themes/default/freshrss.css
@@ -180,17 +180,16 @@
 	.day:first-child {
 		border-top: none;
 	}
-	.day em {
-		color:#AAB;
-		font-size:2em;
-		height:1.5em;
-		opacity:.4;
-		overflow:hidden;
-		padding:0 .2em 0 0;
-		position:absolute;
-		right:0;
-		text-align:right;
-		width:75%
+	.day .name {
+		position: absolute;
+		right: 0;
+		padding: 0 10px 0 0;
+		overflow: hidden;
+		color: #aab;
+		font-size: 1.8em;
+		opacity: .3;
+		text-shadow: 0px -1px 0px #333;
+		font-style: italic;
 	}
 
 .flux {
@@ -679,7 +678,25 @@
 		width: 100%;
 	}
 
+	.nav_menu .btn {
+		margin: 5px 10px;
+	}
+	.nav_menu .stick {
+		margin: 0 10px;
+	}
+	.nav_menu .stick .btn {
+		margin: 5px 0;
+	}
+
 	#panel {
 		left: 5px; right: 5px;
 	}
+
+	.day .date {
+		display: none;
+	}
+	.day .name {
+		font-size: 1em;
+		text-shadow: none;
+	}
 }
diff --git a/public/themes/flat-design/freshrss.css b/public/themes/flat-design/freshrss.css
index b72751e3b..e6b33c313 100644
--- a/public/themes/flat-design/freshrss.css
+++ b/public/themes/flat-design/freshrss.css
@@ -179,17 +179,16 @@ body {
 	background: #ecf0f1;
 	border-radius: 0 20px 20px 0;
 }
-	.day em {
-		color:#AAB;
-		font-size:2em;
-		height:1.5em;
-		opacity:.4;
-		overflow:hidden;
-		padding:0 .2em 0 0;
-		position:absolute;
-		right:0;
-		text-align:right;
-		width:75%;
+	.day .name {
+		position: absolute;
+		right: 0;
+		padding: 0 10px 0 0;
+		overflow: hidden;
+		color: #aab;
+		font-size: 1.8em;
+		opacity: .3;
+		text-shadow: 0px -1px 0px #333;
+		font-style: italic;
 	}
 
 .flux {
@@ -693,16 +692,24 @@ body {
 	}
 
 	.nav_menu .btn {
-		margin: 10px;
+		margin: 5px 10px;
 	}
 	.nav_menu .stick {
 		margin: 0 10px;
 	}
 	.nav_menu .stick .btn {
-		margin: 10px 0;
+		margin: 5px 0;
 	}
 
 	#panel {
 		left: 5px; right: 5px;
 	}
+
+	.day .date {
+		display: none;
+	}
+	.day .name {
+		font-size: 1em;
+		text-shadow: none;
+	}
 }