Change texts on hover in the subscribe buttons

src/components/Topic/Card.module.scss

@@ -127,10 +127,24 @@
   background: #000;
   color: #fff;
   transition: background-color 0.3s, color 0.3s;
+  white-space: nowrap;
+  width: 9em;
 
   &:hover {
     background: #fff;
     color: #000;
+
+    .buttonUnfollowLabel {
+      display: block;
+    }
+
+    .buttonSubscribedLabel {
+      display: none;
+    }
+  }
+
+  .buttonUnfollowLabel {
+    display: none;
   }
 }
 

src/components/Topic/Card.tsx

@@ -115,7 +115,8 @@ export const TopicCard = (props: TopicProps) => {
                 </Show>
                 <Show when={!props.iconButton}>
                   <Show when={subscribed()} fallback={t('Follow')}>
-                    {t('Unfollow')}
+                    <span class={styles.buttonUnfollowLabel}>{t('Unfollow')}</span>
+                    <span class={styles.buttonSubscribedLabel}>{t('You are subscribed')}</span>
                   </Show>
                 </Show>
               </button>