Merge remote-tracking branch 'upstream/dev' into dev

src/core/commands/debug.ts

@@ -19,6 +19,10 @@ export default () =>
     ],
     execute([ephemeral], ctx) {
         const info = getDebugInfo();
+
+        if(info.device.codename === undefined) { info.device.codename = ""}
+        else{ info.device.codename = "(" + info.device.codename + ")" }
+
         const content = [
             "**ShiggyCord Debug Info**",
             `> ShiggyCord: ${info.bunny.version} (${info.bunny.loader.name} ${info.bunny.loader.version})`,
@@ -26,7 +30,7 @@ export default () =>
             `> React: ${info.react.version} (RN ${info.react.nativeVersion})`,
             `> Hermes: ${info.hermes.version} (bcv${info.hermes.bytecodeVersion})`,
             `> System: ${info.os.name} ${info.os.version} ${info.os.sdk ? `(SDK ${info.os.sdk})` : ""}`.trimEnd(),
-        `> Device: ${info.device.model}`,
+            `> Device: ${info.device.model} ${info.device.codename}`,
         ].join("\n");
 
         if (ephemeral?.value) {

src/core/ui/components/AddonCard.tsx

@@ -26,49 +26,51 @@ const useStyles = createStyles({
     card: {
         backgroundColor: semanticColors?.CARD_SECONDARY_BG,
         borderRadius: 12,
-    overflow: "hidden",
+        overflow: "hidden"
     },
     header: {
         padding: 0,
     },
     headerLeading: {
+        flex: 1,
         flexDirection: "column",
         justifyContent: "center",
-    flexShrink: 1,
-    scale: 1.2,
+        scale: 1.2
     },
     headerTrailing: {
         display: "flex",
         flexDirection: "row",
         gap: 15,
-    alignItems: "center",
+        alignItems: "center"
     },
     headerLabel: {
-    ...TextStyleSheet["heading-md/semibold"],
-    color: semanticColors.MOBILE_TEXT_HEADING_PRIMARY,
+        ...TextStyleSheet["heading-lg/semibold"],
+    },
+    headerLabelCompact: {
+        ...TextStyleSheet["text-md/semibold"],
     },
     headerSubtitle: {
-    ...TextStyleSheet["text-md/semibold"],
+        ...TextStyleSheet["text-sm/semibold"],
         color: semanticColors.TEXT_MUTED,
     },
     descriptionLabel: {
         ...TextStyleSheet["text-md/semibold"],
-    color: semanticColors.TEXT_NORMAL,
+        color: "text-strong",
     },
     actions: {
         flexDirection: "row-reverse",
         alignItems: "center",
-    gap: 5,
+        gap: 5
     },
     iconStyle: {
-    tintColor: semanticColors.INTERACTIVE_ICON_DEFAULT,
+        tintColor: semanticColors.LOGO_PRIMARY,
         opacity: 0.2,
         height: 64,
         width: 64,
         left: void 0,
         right: "30%",
-    top: "-10%",
-  },
+        top: "-10%"
+    }
 });
 
 interface Action {