From 3bd2288ea91b512503df3e76b5e2f11f774d87c5 Mon Sep 17 00:00:00 2001
From: Mario Vavti <mario@mariovavti.com>
Date: Mon, 26 Feb 2018 20:17:53 +0100
Subject: [PATCH] fix icon position and make string translatable

---
 Zotlabs/Widget/Notifications.php  |  9 ++++++---
 view/css/widgets.css              | 16 ++++++++++++----
 view/tpl/notifications_widget.tpl |  5 +++--
 3 files changed, 21 insertions(+), 9 deletions(-)

diff --git a/Zotlabs/Widget/Notifications.php b/Zotlabs/Widget/Notifications.php
index d51cb0113..f2619c5cf 100644
--- a/Zotlabs/Widget/Notifications.php
+++ b/Zotlabs/Widget/Notifications.php
@@ -23,7 +23,8 @@ class Notifications {
 					'label' => t('Mark all notifications read')
 				],
 				'filter' => [
-					'label' => t('Show new posts only')
+					'posts_label' => t('Show new posts only'),
+					'name_label' => t('Filter by name')
 				]
 			];
 
@@ -41,7 +42,8 @@ class Notifications {
 					'label' => t('Mark all notifications seen')
 				],
 				'filter' => [
-					'label' => t('Show new posts only')
+					'posts_label' => t('Show new posts only'),
+					'name_label' => t('Filter by name')
 				]
 			];
 
@@ -136,7 +138,8 @@ class Notifications {
 					'label' => t('Mark all notifications seen')
 				],
 				'filter' => [
-					'label' => t('Show new posts only')
+					'posts_label' => t('Show new posts only'),
+					'name_label' => t('Filter by name')
 				]
 			];
 		}
diff --git a/view/css/widgets.css b/view/css/widgets.css
index 03150c67a..f97029aad 100644
--- a/view/css/widgets.css
+++ b/view/css/widgets.css
@@ -179,14 +179,14 @@ a.wikilist {
 	overflow: auto;
 }
 
-.notifications-textinput input {
-	font-family: sans-serif, ForkAwesome;
-}
-
 .notifications-textinput {
 	padding: .75rem 0.85rem;
 }
 
+.notifications-textinput input {
+	padding-left: 1.75rem;
+}
+
 .notifications-textinput-clear {
 	padding: .5rem;
 	line-height: 1;
@@ -196,6 +196,14 @@ a.wikilist {
 	cursor: pointer;
 }
 
+.notifications-textinput-filter {
+	padding: .5rem;
+	line-height: 1;
+	position: absolute;
+	top: .75rem;
+	left: 0.75rem;
+}
+
 .notification-content.collapsing {
 	overflow: hidden;
 }
diff --git a/view/tpl/notifications_widget.tpl b/view/tpl/notifications_widget.tpl
index 211e8e05b..18250cf97 100644
--- a/view/tpl/notifications_widget.tpl
+++ b/view/tpl/notifications_widget.tpl
@@ -154,10 +154,11 @@
 				{{/if}}
 				{{if $notification.filter}}
 				<div class="list-group-item cursor-pointer" id="tt-{{$notification.type}}-only">
-					<i class="fa fa-fw fa-filter"></i> {{$notification.filter.label}}
+					<i class="fa fa-fw fa-filter"></i> {{$notification.filter.posts_label}}
 				</div>
 				<div class="list-group-item clearfix notifications-textinput" id="cn-{{$notification.type}}-only">
-					<input id="cn-{{$notification.type}}-input" type="text" class="form-control form-control-sm" placeholder="&#xf0b0;  Filter by name">
+					<div class="text-muted notifications-textinput-filter"><i class="fa fa-fw fa-filter"></i></div>
+					<input id="cn-{{$notification.type}}-input" type="text" class="form-control form-control-sm" placeholder="{{$notification.filter.name_label}}">
 					<div id="cn-{{$notification.type}}-input-clear" class="text-muted notifications-textinput-clear d-none"><i class="fa fa-times"></i></div>
 				</div>
 				{{/if}}