Updated featured-post indicator and post selection styles

Refs https://github.com/TryGhost/Team/issues/2923

ghost/admin/app/components/posts-list/list-item.hbs

@@ -47,13 +47,13 @@
     {{else}}
         <LinkTo @route="editor.edit" @models={{array this.post.displayName this.post.id}} class="permalink gh-list-data gh-post-list-title">
             <h3 class="gh-content-entry-title">
+                {{#if @post.featured}}
+                    {{svg-jar "star" class="gh-featured-post"}}
+                {{/if}}
                 {{@post.title}}
                 {{#if @post.lexical}}
                     <span class="gh-lexical-indicator">L</span>
                 {{/if}}
-                {{#if @post.featured}}
-                    <span class="gh-lexical-indicator">★</span>
-                {{/if}}
             </h3>
             {{#unless @hideAuthor }}
                 <p class="gh-content-entry-meta">

ghost/admin/app/styles/layouts/content.css

@@ -154,16 +154,11 @@
 }
 
 /* START Temporary styles to move post list to use flex instead of tables */
-.gh-posts-list-item-group {
-    padding: 0 var(--main-layout-content-sidepadding);
-    margin: 0 calc(var(--main-layout-content-sidepadding) * -1 + 10px);
-    border-radius: 5px;
-}
-
 .gh-posts-list-item-group .gh-list-row {
     display: flex;
     align-items: stretch;
     justify-content: space-between;
+    margin: 0;
 }
 
 .gh-posts-list-item-group .gh-list-row .gh-list-data {
@@ -185,21 +180,33 @@
 }
 
 .posts-list .gh-posts-list-item-group:hover {
-    background: #fafafb;
+    background: linear-gradient(315deg, var(--whitegrey-l2) 60%, var(--white) 100%);
 }
 
 .posts-list[data-ctrl] .gh-posts-list-item-group:hover {
-    background: #f3f3f9;
+    background: linear-gradient(315deg, var(--whitegrey-l1) 75%, var(--white) 100%);
 }
 
 .gh-posts-list-item-group[data-selected] {
-    background: #eae5ff !important;
+    background: linear-gradient(315deg, var(--whitegrey-l1) 75%, var(--white) 100%) !important;
 }
 
 .gh-posts-list-item-group .gh-posts-list-item:hover .gh-list-data {
     background: transparent !important;
 }
 
+.gh-posts-list-item-group .gh-list-data {
+    border-top: 0 !important;
+}
+
+.gh-posts-list-item-group {
+    border-top: 1px solid var(--whitegrey);
+}
+
+.gh-posts-list-item-group[data-selected]:not(:first-of-type),
+.gh-posts-list-item-group[data-selected] + .gh-posts-list-item-group:hover {
+    border-top: 1px solid var(--white) !important;
+}
 /* END Temporary styles to move post list to use flex instead of tables */
 
 .gh-posts-list-item {
@@ -257,6 +264,12 @@
     font-size: 1.2rem;
 }
 
+.gh-post-list-title .gh-featured-post {
+    width: 12px;
+    height: 12px;
+    margin: -2px 6px 0 0;
+}
+
 .gh-post-list-external {
     width: 13px;
     height: 13px;

ghost/admin/public/assets/icons/star.svg

@@ -0,0 +1,3 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="currentColor">
+  <path d="M23.56 8.73a1.51 1.51 0 0 0-1.41-1h-6.09a.5.5 0 0 1-.47-.33l-2.18-6.2A1.52 1.52 0 0 0 12 .25a1.49 1.49 0 0 0-1.4 1L8.41 7.42a.5.5 0 0 1-.47.33H1.85a1.5 1.5 0 0 0-1.41 1 1.52 1.52 0 0 0 .45 1.65l5.18 4.3a.5.5 0 0 1 .16.54l-2.18 6.53a1.5 1.5 0 0 0 2.31 1.69l5.34-3.92a.49.49 0 0 1 .59 0l5.35 3.92A1.5 1.5 0 0 0 20 21.77l-2.18-6.53a.5.5 0 0 1 .16-.54l5.19-4.31a1.51 1.51 0 0 0 .39-1.66Z"/>
+</svg>