Feature/add icon to external links in footer (#2083)

* Add icon for external links

* Update changelog

CHANGELOG.md

@@ -7,6 +7,10 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0
 
 ## Unreleased
 
+### Added
+
+- Added an icon to the external links in the footer navigation
+
 ### Changed
 
 - Improved the language localization for German (`de`)

apps/client/src/app/app.component.html

@@ -101,9 +101,13 @@
             >
           </li>
           <li *ngIf="hasPermissionForSubscription">
-            <a href="https://status.ghostfol.io" title="Ghostfolio Status"
-              >Status</a
-            >
+            <a
+              class="align-items-baseline d-flex"
+              href="https://status.ghostfol.io"
+              target="_blank"
+              title="Ghostfolio Status"
+              >Status<ion-icon class="ml-1" name="open-outline"></ion-icon
+            ></a>
           </li>
         </ul>
       </div>
@@ -112,24 +116,30 @@
         <ul class="list-unstyled">
           <li>
             <a
+              class="align-items-baseline d-flex"
               href="https://github.com/ghostfolio/ghostfolio"
+              target="_blank"
               title="Find Ghostfolio on GitHub"
-              >GitHub</a
-            >
+              >GitHub<ion-icon class="ml-1" name="open-outline"></ion-icon
+            ></a>
           </li>
           <li>
             <a
+              class="align-items-baseline d-flex"
               href="https://join.slack.com/t/ghostfolio/shared_invite/zt-vsaan64h-F_I0fEo5M0P88lP9ibCxFg"
+              target="_blank"
               title="Join the Ghostfolio Slack community"
-              >Slack</a
-            >
+              >Slack<ion-icon class="ml-1" name="open-outline"></ion-icon
+            ></a>
           </li>
           <li>
             <a
+              class="align-items-baseline d-flex"
               href="https://twitter.com/ghostfolio_"
+              target="_blank"
               title="Follow Ghostfolio on Twitter"
-              >Twitter</a
-            >
+              >Twitter<ion-icon class="ml-1" name="open-outline"></ion-icon
+            ></a>
           </li>
           <li>&nbsp;</li>
           <li>