chore: css fixes / rename subscription to pro

packages/app/src/Pages/Layout.tsx

@@ -169,10 +169,10 @@ function LogoHeader() {
         {CONFIG.appName}
       </h1>
       {currentSubscription && (
-        <small className="flex items-center g4">
-          <Icon name="diamond" size={10} />
+        <div className="flex items-center g4 text-sm font-semibold tracking-wider">
+          <Icon name="diamond" size={16} className="text-pro" />
           {mapPlanName(currentSubscription.type)}
-        </small>
+        </div>
       )}
     </Link>
   );

packages/app/src/Pages/subscribe/index.tsx

@@ -11,13 +11,14 @@ import AsyncButton from "Element/AsyncButton";
 import useEventPublisher from "Hooks/useEventPublisher";
 import SnortApi, { SubscriptionError, SubscriptionErrorCode } from "SnortApi";
 import SendSats from "Element/SendSats";
+import classNames from "classnames";
 
 export function mapPlanName(id: number) {
   switch (id) {
     case SubscriptionType.Supporter:
       return <FormattedMessage defaultMessage="Supporter" />;
     case SubscriptionType.Premium:
-      return <FormattedMessage defaultMessage="Premium" />;
+      return <FormattedMessage defaultMessage="PRO" />;
   }
 }
 
@@ -81,7 +82,7 @@ export function SubscribePage() {
         {Plans.map(a => {
           const lower = Plans.filter(b => b.id < a.id);
           return (
-            <div className={`p flex flex-col${a.disabled ? " disabled" : ""}`}>
+            <div className={classNames("p flex flex-col g8", { disabled: a.disabled })}>
               <div className="grow">
                 <h2>{mapPlanName(a.id)}</h2>
                 <p>
@@ -111,7 +112,7 @@ export function SubscribePage() {
                   ))}
                 </ul>
               </div>
-              <div className="flex items-center w-max mb10">
+              <div className="flex justify-center">
                 <AsyncButton className="button" disabled={a.disabled} onClick={() => subscribe(a.id)}>
                   {a.disabled ? (
                     <FormattedMessage defaultMessage="Coming soon" />

packages/app/src/index.css

@@ -47,12 +47,12 @@
     rgba(255, 107, 175, 0.6) 108.33%
   );
   --expired-invoice-gradient: linear-gradient(45deg, var(--gray-superdark) 50%, var(--gray), var(--gray-superdark));
-  --strike-army-gradient: linear-gradient(to bottom right, #ccff00, #a1c900);
   --sub-bg: #111;
   --header-padding-tb: 10px;
   --btn-color: #fff;
   --primary-gradient: linear-gradient(90deg, rgba(239, 150, 68, 1) 0%, rgba(123, 65, 246, 1) 100%);
   --cashu-gradient: linear-gradient(90deg, #40b039, #adff2a);
+  --pro: #ffdd65;
 }
 
 ::-webkit-scrollbar {
@@ -166,6 +166,14 @@ a.ext {
   background: var(--primary-gradient);
 }
 
+.primary {
+  color: var(--primary-gradient);
+}
+
+.text-pro {
+  color: var(--pro);
+}
+
 .br {
   border-radius: 16px;
 }

packages/app/src/lang.json

@@ -344,9 +344,6 @@
   "C1LjMx": {
     "defaultMessage": "Lightning Donation"
   },
-  "C5xzTC": {
-    "defaultMessage": "Premium"
-  },
   "C7642/": {
     "defaultMessage": "Quote Repost"
   },
@@ -1112,6 +1109,9 @@
   "hMzcSq": {
     "defaultMessage": "Messages"
   },
+  "hRTfTR": {
+    "defaultMessage": "PRO"
+  },
   "hY4lzx": {
     "defaultMessage": "Supports"
   },

packages/app/src/translations/en.json

@@ -112,7 +112,6 @@
   "BcGMo+": "Notes hold text content, the most popular usage of these notes is to store \"tweet like\" messages.",
   "BjNwZW": "Nostr address (nip05)",
   "C1LjMx": "Lightning Donation",
-  "C5xzTC": "Premium",
   "C7642/": "Quote Repost",
   "C81/uG": "Logout",
   "C8HhVE": "Suggested Follows",
@@ -364,6 +363,7 @@
   "h8XMJL": "Badges",
   "hK5ZDk": "the world",
   "hMzcSq": "Messages",
+  "hRTfTR": "PRO",
   "hY4lzx": "Supports",
   "hicxcO": "Show replies",
   "hmZ3Bz": "Media",