enhance accessibility on buttons

This commit is contained in:
Nicolas Constant 2019-09-28 01:55:12 -04:00
parent c85eaee78b
commit cf78c57b55
No known key found for this signature in database
GPG Key ID: 1E9F677FB01A5688
3 changed files with 12 additions and 5 deletions

View File

@ -148,6 +148,11 @@ $counter-width: 90px;
background-color: darken($status-editor-footer-background, 20%);
}
outline: inherit;
&:focus {
background-color: darken($status-editor-footer-background, 20%);
}
& span {
margin: 0;
padding: 0;

View File

@ -1,12 +1,12 @@
<div class="stream-edition">
<div class="stream-edition__settings">
<div class="stream-edition__setting">
<input [(ngModel)]="hideBoosts" (change)="settingsChanged()"
<input [(ngModel)]="hideBoosts" (change)="settingsChanged()"
class="stream-edition__setting--checkbox" type="checkbox" id="hideBoosts"> <label for="hideBoosts" class="noselect">hide
boosts</label><br />
</div>
<div class="stream-edition__setting">
<input [(ngModel)]="hideReplies" (change)="settingsChanged()"
<input [(ngModel)]="hideReplies" (change)="settingsChanged()"
class="stream-edition__setting--checkbox" type="checkbox" id="hideReplies"> <label for="hideReplies" class="noselect">hide
replies</label><br />
</div>
@ -17,7 +17,8 @@
</div>
</div>
<div>
<button (click)="delete()" class="stream-edition__button stream-edition__button--delete" title="remove column">
<button (click)="delete()"
class="stream-edition__button stream-edition__button--delete" title="remove column" >
<fa-icon [icon]="faTimes"></fa-icon> <span class="stream-edition__button--delete--label">remove</span>
</button>
@ -26,7 +27,8 @@
title="move right">
<fa-icon [icon]="faChevronRight"></fa-icon>
</button>
<button (click)="moveLeft()" class="stream-edition__button stream-edition__button--move" title="move left">
<button (click)="moveLeft()"
class="stream-edition__button stream-edition__button--move" title="move left">
<fa-icon [icon]="faChevronLeft"></fa-icon>
</button>
</div>

View File

@ -13,5 +13,5 @@
padding: 0;
font: inherit;
cursor: pointer;
outline: inherit;
// outline: inherit;
}