fix icon position and make string translatable

This commit is contained in:
Mario Vavti 2018-02-26 20:17:53 +01:00
parent f8f69767b7
commit 3bd2288ea9
3 changed files with 21 additions and 9 deletions

View File

@ -23,7 +23,8 @@ class Notifications {
'label' => t('Mark all notifications read') 'label' => t('Mark all notifications read')
], ],
'filter' => [ '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') 'label' => t('Mark all notifications seen')
], ],
'filter' => [ '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') 'label' => t('Mark all notifications seen')
], ],
'filter' => [ 'filter' => [
'label' => t('Show new posts only') 'posts_label' => t('Show new posts only'),
'name_label' => t('Filter by name')
] ]
]; ];
} }

View File

@ -179,14 +179,14 @@ a.wikilist {
overflow: auto; overflow: auto;
} }
.notifications-textinput input {
font-family: sans-serif, ForkAwesome;
}
.notifications-textinput { .notifications-textinput {
padding: .75rem 0.85rem; padding: .75rem 0.85rem;
} }
.notifications-textinput input {
padding-left: 1.75rem;
}
.notifications-textinput-clear { .notifications-textinput-clear {
padding: .5rem; padding: .5rem;
line-height: 1; line-height: 1;
@ -196,6 +196,14 @@ a.wikilist {
cursor: pointer; cursor: pointer;
} }
.notifications-textinput-filter {
padding: .5rem;
line-height: 1;
position: absolute;
top: .75rem;
left: 0.75rem;
}
.notification-content.collapsing { .notification-content.collapsing {
overflow: hidden; overflow: hidden;
} }

View File

@ -154,10 +154,11 @@
{{/if}} {{/if}}
{{if $notification.filter}} {{if $notification.filter}}
<div class="list-group-item cursor-pointer" id="tt-{{$notification.type}}-only"> <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>
<div class="list-group-item clearfix notifications-textinput" id="cn-{{$notification.type}}-only"> <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 id="cn-{{$notification.type}}-input-clear" class="text-muted notifications-textinput-clear d-none"><i class="fa fa-times"></i></div>
</div> </div>
{{/if}} {{/if}}