diff --git a/UI/Web/src/app/_models/series-filter.ts b/UI/Web/src/app/_models/series-filter.ts
index 51ddca214..a370266f5 100644
--- a/UI/Web/src/app/_models/series-filter.ts
+++ b/UI/Web/src/app/_models/series-filter.ts
@@ -12,6 +12,7 @@ export interface SeriesFilter {
     readStatus: ReadStatus;
     genres: Array<number>;
     writers: Array<number>;
+    artists: Array<number>;
     penciller: Array<number>;
     inker: Array<number>;
     colorist: Array<number>;
diff --git a/UI/Web/src/app/_services/series.service.ts b/UI/Web/src/app/_services/series.service.ts
index b432f3d2a..c73b9f2c0 100644
--- a/UI/Web/src/app/_services/series.service.ts
+++ b/UI/Web/src/app/_services/series.service.ts
@@ -198,6 +198,7 @@ export class SeriesService {
       libraries: [],
       genres: [],
       writers: [],
+      artists: [],
       penciller: [],
       inker: [],
       colorist: [],
diff --git a/UI/Web/src/app/grouped-typeahead/grouped-typeahead.component.scss b/UI/Web/src/app/grouped-typeahead/grouped-typeahead.component.scss
index dec2c2f3b..a6bbd01f0 100644
--- a/UI/Web/src/app/grouped-typeahead/grouped-typeahead.component.scss
+++ b/UI/Web/src/app/grouped-typeahead/grouped-typeahead.component.scss
@@ -41,6 +41,14 @@ input {
         right: 10px;
     }
 
+    @media only screen and (max-width:650px) {
+        .close {
+            top: 50%;
+            transform: translate(0, -60%);
+        }
+    }
+
+
     input {
         outline: 0 !important;
         border-radius: .28571429rem;
diff --git a/UI/Web/src/app/nav-header/nav-header.component.scss b/UI/Web/src/app/nav-header/nav-header.component.scss
index 5c5b3338c..99fe40200 100644
--- a/UI/Web/src/app/nav-header/nav-header.component.scss
+++ b/UI/Web/src/app/nav-header/nav-header.component.scss
@@ -14,7 +14,7 @@ $bg-color: rgb(22, 27, 34);
 /* small devices (phones, 650px and down) */
 @media only screen and (max-width:650px) { //370
     .navbar-nav {
-        width: 34%;
+        width: 0;
     }
 }
 
diff --git a/UI/Web/src/app/nav-header/nav-header.component.ts b/UI/Web/src/app/nav-header/nav-header.component.ts
index ebf7318a9..e039f4eaa 100644
--- a/UI/Web/src/app/nav-header/nav-header.component.ts
+++ b/UI/Web/src/app/nav-header/nav-header.component.ts
@@ -112,8 +112,11 @@ export class NavHeaderComponent implements OnInit, OnDestroy {
     // TODO: Move this to utility service
     this.clearSearch();
     switch(role) {
+      case PersonRole.Writer:
+        this.goTo('writers', filter);
+        break;
       case PersonRole.Artist:
-        this.goTo('artist', filter);
+        this.goTo('artists', filter);
         break;
       case PersonRole.Character:
         this.goTo('character', filter);
@@ -128,7 +131,7 @@ export class NavHeaderComponent implements OnInit, OnDestroy {
         this.goTo('inker', filter);
         break;
       case PersonRole.CoverArtist:
-        this.goTo('coverArtist', filter);
+        this.goTo('coverArtists', filter);
         break;
       case PersonRole.Inker:
         this.goTo('inker', filter);
diff --git a/UI/Web/src/app/shared/_services/utility.service.ts b/UI/Web/src/app/shared/_services/utility.service.ts
index 2a3b414f2..9f8f97167 100644
--- a/UI/Web/src/app/shared/_services/utility.service.ts
+++ b/UI/Web/src/app/shared/_services/utility.service.ts
@@ -150,6 +150,12 @@ export class UtilityService {
       anyChanged = true;
     }
 
+    const artists = snapshot.queryParamMap.get('artists');
+    if (artists !== undefined && artists !== null) {
+      filter.artists = [...filter.artists, ...artists.split(',').map(item => parseInt(item, 10))];
+      anyChanged = true;
+    }
+
     const character = snapshot.queryParamMap.get('character');
     if (character !== undefined && character !== null) {
       filter.character = [...filter.character, ...character.split(',').map(item => parseInt(item, 10))];