Apply .update-available badge to settings/updates tabs

2 files changed, 13 insertions, 1 deletions

diff --git a/src/styles/layout.scss b/src/styles/layout.scss
index abd38b506..8454814b0 100644
--- a/src/styles/layout.scss
+++ b/src/styles/layout.scss
@@ -58,7 +58,7 @@ html {
   }
 }
 
-.app .sidebar .sidebar__button .update-available {
+.update-available {
   align-items: center;
   background: $theme-brand-danger;
   border-radius: 20px;
@@ -79,6 +79,16 @@ html {
   animation-iteration-count: 6;
 }
 
+.badge .update-available {
+  right: -10px;
+}
+
+.settings-navigation__link .update-available {
+  position: relative;
+  bottom: 0;
+  right: 0;
+}
+
 body.win32:not(.isFullScreen) .app .app__content {
   height: calc(100% - 28px);
 }
diff --git a/src/styles/settings.scss b/src/styles/settings.scss
index 8f59fc57a..00744df88 100644
--- a/src/styles/settings.scss
+++ b/src/styles/settings.scss
@@ -218,6 +218,7 @@
 
     .badge {
       margin-right: 10px;
+      position: relative;
     }
 
     &::-webkit-scrollbar {
@@ -519,6 +520,7 @@
   overflow: hidden;
 
   .settings-navigation__link {
+    position: relative;
     align-items: center;
     justify-content: space-between;
     color: $theme-text-color;