Use `Icon` in `LoggedOutMessage`

src/sidebar/components/LoggedOutMessage.js

-import { LinkButton, SvgIcon } from '@hypothesis/frontend-shared';
+import { LinkButton, Icon } from '@hypothesis/frontend-shared';
 
 import { useStoreProxy } from '../store/use-store';
 
@@ -46,7 +46,7 @@ function LoggedOutMessage({ onLogin }) {
           aria-label="Hypothesis homepage"
           title="Hypothesis homepage"
         >
-          <SvgIcon name="logo" className="LoggedOutMessage__logo-icon" />
+          <Icon name="logo" classes="u-icon--xlarge hyp-u-color--grey-7" />
         </a>
       </div>
     </div>

src/styles/sidebar/components/LoggedOutMessage.scss

@@ -24,13 +24,3 @@
   @include layout.row(center);
   margin-top: 25px;
 }
-
-.LoggedOutMessage__logo-icon {
-  width: 30px;
-  height: 30px;
-  color: var.$grey-mid;
-
-  &:hover {
-    color: var.$grey-7;
-  }
-}

src/styles/util.scss

@@ -57,6 +57,11 @@
   @include utils.icon--large;
 }
 
+.u-icon--xlarge {
+  width: 30px;
+  height: 30px;
+}
+
 // Misc
 
 // Make element content invisible except to assistive technology