Tag list visuals

- long tag text overflow in post-view and tag-list
- tag usage visualized in tag-list

public_html/media/css/post-view.css

@@ -21,6 +21,10 @@ embed {
 	margin: 0;
 	padding: 0;
 }
+#sidebar .tags li {
+	overflow: hidden;
+	text-overflow: ellipsis;
+}
 #sidebar .tags li .count {
 	padding-left: 0.5em;
 	color: silver;

public_html/media/css/tag-list.css

@@ -6,11 +6,17 @@
 	-moz-column-width: 14em;
 	-webkit-column-width: 14em;
 }
+.tags li a:hover {
+	opacity: 1 !important;
+}
 .tags li {
 	margin: 0.2em 0.5em;
 	text-align: top;
 	width: 14em;
 	display: inline-block;
+	white-space: nowrap;
+	overflow: hidden;
+	text-overflow: ellipsis;
 }
 
 .form-wrapper {

src/Views/post-view.phtml

@@ -29,7 +29,7 @@
 		<h1>tags (<?php echo count($this->context->transport->post->sharedTag) ?>)</h1>
 		<ul>
 			<?php foreach ($this->context->transport->post->sharedTag as $tag): ?>
-				<li>
+				<li title="<?php echo $tag->name ?>">
 					<a href="<?php echo \Chibi\UrlHelper::route('post', 'list', ['query' => $tag->name]) ?>">
 						<?php echo $tag->name ?>
 					</a>

src/Views/tag-list.phtml

@@ -1,8 +1,9 @@
+<?php $max = max($this->context->transport->tagDistribution) ?>
 <div class="tags">
 	<ul>
 		<?php foreach ($this->context->transport->tagDistribution as $tagName => $count): ?>
-			<li class="tag">
+			<li class="tag" title="<?php echo $tagName ?> (<?php echo $count ?>)">
-				<a href="<?php echo \Chibi\UrlHelper::route('post', 'list', ['query' => $tagName]) ?>">
+				<a href="<?php echo \Chibi\UrlHelper::route('post', 'list', ['query' => $tagName]) ?>" style="opacity: <?php printf('%.02f', 0.25 + 0.75 *  log($count) / log($max)) ?>">
 					<?php echo $tagName . ' (' . $count . ')' ?>
 				</a>
 			</li>