feat: renaming class names to BEM

src/renderer/src/components/achievements/notification/achievement-notification.scss

@@ -454,16 +454,8 @@ $margin-bottom: 28px;
   }
 
   &--rare &__chip {
-    &__icon {
-      path {
-        fill: #fff;
-      }
-    }
-    &__label {
-      color: #fff;
-    }
     background: linear-gradient(
-      118deg,
+      160deg,
       #e8ad15 18.96%,
       #d5900f 26.41%,
       #e8ad15 29.99%,
@@ -479,9 +471,6 @@ $margin-bottom: 28px;
       #503808 83.6%,
       #3e2d08 85.77%
     );
-  }
-
-  &--platinum &__chip {
     &__icon {
       path {
         fill: #fff;
@@ -490,6 +479,9 @@ $margin-bottom: 28px;
     &__label {
       color: #fff;
     }
+  }
+
+  &--platinum &__chip {
     background: linear-gradient(
       118deg,
       #15e8d6 18.96%,
@@ -507,6 +499,14 @@ $margin-bottom: 28px;
       #085042 83.6%,
       #083e31 85.77%
     );
+    &__icon {
+      path {
+        fill: #fff;
+      }
+    }
+    &__label {
+      color: #fff;
+    }
   }
 
   &--closing * {

src/renderer/src/pages/settings/settings-general.scss

@@ -13,4 +13,8 @@
   &__common-redist-button {
     align-self: flex-start;
   }
+
+  &__test-achievement-notification-button {
+    align-self: flex-start;
+  }
 }

src/renderer/src/pages/settings/settings-general.tsx

@@ -277,12 +277,24 @@ export function SettingsGeneral() {
 
       {form.achievementNotificationsEnabled &&
         form.achievementCustomNotificationsEnabled && (
-          <SelectField
-            label={t("achievement_custom_notification_position")}
-            value={form.achievementCustomNotificationPosition}
-            onChange={handleChangeAchievementCustomNotificationPosition}
-            options={achievementCustomNotificationPositionOptions}
-          />
+          <>
+            <SelectField
+              className="settings-general__achievement-custom-notification-position__select-variation"
+              label={t("achievement_custom_notification_position")}
+              value={form.achievementCustomNotificationPosition}
+              onChange={handleChangeAchievementCustomNotificationPosition}
+              options={achievementCustomNotificationPositionOptions}
+            />
+
+            <Button
+              className="settings-general__test-achievement-notification-button"
+              onClick={() =>
+                window.electron.updateAchievementCustomNotificationWindow()
+              }
+            >
+              Test Notification
+            </Button>
+          </>
         )}
 
       <h2 className="settings-general__section-title">{t("common_redist")}</h2>

src/renderer/src/pages/theme-editor/theme-editor.scss

@@ -44,8 +44,11 @@
   }
 
   &__footer {
+    display: flex;
+    flex-direction: column;
     background-color: globals.$dark-background-color;
     padding: globals.$spacing-unit globals.$spacing-unit * 2;
+    gap: 24px;
 
     &-actions {
       display: flex;
@@ -82,6 +85,7 @@
   }
 
   &__notification-preview {
+    padding-top: 12px;
     display: flex;
     flex-direction: row;
     align-items: center;

src/renderer/src/pages/theme-editor/theme-editor.tsx

@@ -156,13 +156,13 @@ export default function ThemeEditor() {
           <div className="theme-editor__notification-preview">
             <SelectField
               className="theme-editor__notification-preview__select-variation"
-              label="Variation"
+              label={t("variation")}
               options={Object.values(notificationVariations).map(
                 (variation) => {
                   return {
                     key: variation,
                     value: variation,
-                    label: variation,
+                    label: t(variation),
                   };
                 }
               )}
@@ -174,7 +174,7 @@ export default function ThemeEditor() {
             />
 
             <SelectField
-              label={"alignment"}
+              label={t("alignment")}
               value={notificationAlignment}
               onChange={(e) =>
                 setNotificationAlignment(