add grw-recent-changes & move tag code

src/client/js/components/Sidebar/RecentChanges.jsx

@@ -117,7 +117,7 @@ class RecentChanges extends React.Component {
             <i className="icon icon-reload"></i>
           </button>
         </div>
-        <div className="grw-sidebar-content-body p-3">
+        <div className="grw-sidebar-content-body grw-recent-changes p-3">
           <ul className="list-group list-group-flush">
             { recentlyUpdatedPages.map(page => <PageItem key={page.id} page={page} />) }
           </ul>

src/client/styles/scss/_recent-changes.scss

@@ -1,11 +1,5 @@
 .list-group {
   .list-group-item {
-    .grw-tag-label {
-      font-size: 10px;
-      font-weight: normal;
-      border-radius: $border-radius-sm;
-    }
-
     .footstamp-icon {
       svg {
         width: 13.92px;

src/client/styles/scss/_tag.scss

@@ -17,3 +17,11 @@
     height: auto;
   }
 }
+
+.grw-recent-changes {
+  .grw-tag-label {
+    font-size: 10px;
+    font-weight: normal;
+    border-radius: $border-radius-sm;
+  }
+}

src/client/styles/scss/theme/_apply-colors.scss

@@ -264,15 +264,17 @@ ul.pagination {
     }
   }
 
-  .list-group {
-    .list-group-item {
-      .grw-tag-label {
-        color: $secondary;
-        background-color: $gray-200;
-      }
+  .grw-recent-changes {
+    .list-group {
+      .list-group-item {
+        .grw-tag-label {
+          color: $secondary;
+          background-color: $gray-200;
+        }
 
-      .icon-lock {
-        color: $color-link;
+        .icon-lock {
+          color: $color-link;
+        }
       }
     }
   }