diff --git a/public/locales/en/translation.json b/public/locales/en/translation.json
index 6808b96c..1b765ad0 100644
--- a/public/locales/en/translation.json
+++ b/public/locales/en/translation.json
@@ -1,5 +1,5 @@
 {
-  "...subscribing": "...subscribing",
+  "subscribing...": "subscribing...",
   "About": "About",
   "About the project": "About the project",
   "Add a few topics so that the reader knows what your content is about and can find it on pages of topics that interest them. Topics can be swapped, the first topic becomes the title": "Add a few topics so that the reader knows what your content is about and can find it on pages of topics that interest them. Topics can be swapped, the first topic becomes the title",
diff --git a/public/locales/ru/translation.json b/public/locales/ru/translation.json
index 9f7333f8..1ed9ca94 100644
--- a/public/locales/ru/translation.json
+++ b/public/locales/ru/translation.json
@@ -1,5 +1,5 @@
 {
-  "...subscribing": "...подписываем",
+  "subscribing...": "Подписка...",
   "A short introduction to keep the reader interested": "Добавьте вступление, чтобы заинтересовать читателя",
   "About": "О себе",
   "About the project": "О проекте",
diff --git a/src/components/Author/AuthorBadge/AuthorBadge.module.scss b/src/components/Author/AuthorBadge/AuthorBadge.module.scss
index dc79e763..a1c6032a 100644
--- a/src/components/Author/AuthorBadge/AuthorBadge.module.scss
+++ b/src/components/Author/AuthorBadge/AuthorBadge.module.scss
@@ -81,9 +81,24 @@
       padding: 6px !important;
       min-width: 32px;
       width: unset;
+
       &:hover img {
         filter: invert(1);
       }
     }
+
+    &:hover {
+      .actionButtonLabel {
+        display: none;
+      }
+
+      .actionButtonLabelHovered {
+        display: block;
+      }
+    }
+  }
+
+  .actionButtonLabelHovered {
+    display: none;
   }
 }
diff --git a/src/components/Author/AuthorBadge/AuthorBadge.tsx b/src/components/Author/AuthorBadge/AuthorBadge.tsx
index 851bacf9..89194295 100644
--- a/src/components/Author/AuthorBadge/AuthorBadge.tsx
+++ b/src/components/Author/AuthorBadge/AuthorBadge.tsx
@@ -60,9 +60,22 @@ export const AuthorBadge = (props: Props) => {
     if (props.iconButtons) {
       return <Icon name="author-subscribe" />
     }
-    return isSubscribing() ? t('...subscribing') : t('Subscribe')
+    return isSubscribing() ? t('subscribing...') : t('Subscribe')
   })
 
+  const unsubscribeValue = () => {
+    if (props.iconButtons) {
+      return <Icon name="author-unsubscribe" />
+    }
+
+    return (
+      <>
+        <span class={styles.actionButtonLabel}>{t('Following')}</span>
+        <span class={styles.actionButtonLabelHovered}>{t('Unfollow')}</span>
+      </>
+    )
+  }
+
   return (
     <div class={clsx(styles.AuthorBadge, { [styles.nameOnly]: props.nameOnly })}>
       <Userpic
@@ -112,7 +125,7 @@ export const AuthorBadge = (props: Props) => {
               fallback={
                 <Button
                   variant={props.iconButtons ? 'secondary' : 'bordered'}
-                  size="S"
+                  size="M"
                   value={subscribeValue()}
                   onClick={() => handleSubscribe(true)}
                   class={clsx(styles.actionButton, { [styles.iconed]: props.iconButtons })}
@@ -121,8 +134,8 @@ export const AuthorBadge = (props: Props) => {
             >
               <Button
                 variant={props.iconButtons ? 'secondary' : 'bordered'}
-                size="S"
-                value={props.iconButtons ? <Icon name="author-unsubscribe" /> : t('Following')}
+                size="M"
+                value={() => unsubscribeValue()}
                 onClick={() => handleSubscribe(false)}
                 class={clsx(styles.actionButton, { [styles.iconed]: props.iconButtons })}
               />
@@ -131,7 +144,7 @@ export const AuthorBadge = (props: Props) => {
           <Show when={props.showMessageButton}>
             <Button
               variant={props.iconButtons ? 'secondary' : 'bordered'}
-              size="S"
+              size="M"
               value={props.iconButtons ? <Icon name="inbox-white" /> : t('Message')}
               onClick={initChat}
               class={clsx(styles.actionButton, { [styles.iconed]: props.iconButtons })}
diff --git a/src/components/Author/AuthorCard/AuthorCard.module.scss b/src/components/Author/AuthorCard/AuthorCard.module.scss
index f04d86ff..eafc1e4a 100644
--- a/src/components/Author/AuthorCard/AuthorCard.module.scss
+++ b/src/components/Author/AuthorCard/AuthorCard.module.scss
@@ -109,6 +109,12 @@
       vertical-align: text-top;
     }
   }
+
+  .buttonWriteMessage {
+    border-radius: 0.8rem;
+    padding-bottom: 0.6rem;
+    padding-top: 0.6rem;
+  }
 }
 
 .authorDetails {
diff --git a/src/components/Author/AuthorCard/AuthorCard.tsx b/src/components/Author/AuthorCard/AuthorCard.tsx
index a40425ab..e051e9e8 100644
--- a/src/components/Author/AuthorCard/AuthorCard.tsx
+++ b/src/components/Author/AuthorCard/AuthorCard.tsx
@@ -98,7 +98,7 @@ export const AuthorCard = (props: Props) => {
 
   const followButtonText = () => {
     if (isSubscribing()) {
-      return t('...subscribing')
+      return t('subscribing...')
     }
     return t(subscribed() ? 'Unfollow' : 'Follow')
   }
@@ -211,7 +211,7 @@ export const AuthorCard = (props: Props) => {
                     variant={'secondary'}
                     value={t('Message')}
                     onClick={initChat}
-                    class={styles.buttonSubscribe}
+                    class={styles.buttonWriteMessage}
                   />
                 </div>
               }
diff --git a/src/components/Topic/Card.module.scss b/src/components/Topic/Card.module.scss
index c5b56fbb..164bf43b 100644
--- a/src/components/Topic/Card.module.scss
+++ b/src/components/Topic/Card.module.scss
@@ -115,6 +115,12 @@
   }
 }
 
+.actionButton {
+  border-radius: 0.8rem !important;
+  margin-right: 0 !important;
+  width: 9em;
+}
+
 .isSubscribing {
   opacity: 0.5;
 }
diff --git a/src/components/Topic/Card.tsx b/src/components/Topic/Card.tsx
index 4a073238..84b0562e 100644
--- a/src/components/Topic/Card.tsx
+++ b/src/components/Topic/Card.tsx
@@ -13,6 +13,7 @@ import { CheckButton } from '../_shared/CheckButton'
 import { capitalize } from '../../utils/capitalize'
 
 import styles from './Card.module.scss'
+import { Button } from '../_shared/Button'
 
 interface TopicProps {
   topic: Topic
@@ -62,6 +63,24 @@ export const TopicCard = (props: TopicProps) => {
     }, 'subscribe')
   }
 
+  const subscribeValue = () => {
+    return (
+      <>
+        <Show when={props.iconButton}>
+          <Show when={subscribed()} fallback="+">
+            <Icon name="check-subscribed" />
+          </Show>
+        </Show>
+        <Show when={!props.iconButton}>
+          <Show when={subscribed()} fallback={t('Follow')}>
+            <span class={styles.buttonUnfollowLabel}>{t('Unfollow')}</span>
+            <span class={styles.buttonSubscribedLabel}>{t('Following')}</span>
+          </Show>
+        </Show>
+      </>
+    )
+  }
+
   return (
     <div class={styles.topicContainer}>
       <div
@@ -123,27 +142,17 @@ export const TopicCard = (props: TopicProps) => {
                   <CheckButton text={t('Follow')} checked={subscribed()} onClick={handleSubscribe} />
                 }
               >
-                <button
+                <Button
+                  variant="bordered"
+                  size="M"
+                  value={subscribeValue()}
                   onClick={handleSubscribe}
-                  class="button--light button--subscribe-topic"
-                  classList={{
+                  class={clsx(styles.actionButton, {
                     [styles.isSubscribing]: isSubscribing(),
                     [styles.isSubscribed]: subscribed()
-                  }}
+                  })}
                   disabled={isSubscribing()}
-                >
-                  <Show when={props.iconButton}>
-                    <Show when={subscribed()} fallback="+">
-                      <Icon name="check-subscribed" />
-                    </Show>
-                  </Show>
-                  <Show when={!props.iconButton}>
-                    <Show when={subscribed()} fallback={t('Follow')}>
-                      <span class={styles.buttonUnfollowLabel}>{t('Unfollow')}</span>
-                      <span class={styles.buttonSubscribedLabel}>{t('Following')}</span>
-                    </Show>
-                  </Show>
-                </button>
+                />
               </Show>
             </Show>
           </ShowOnlyOnClient>
diff --git a/src/components/Topic/TopicBadge/TopicBadge.tsx b/src/components/Topic/TopicBadge/TopicBadge.tsx
index c76f60b3..3387a2e8 100644
--- a/src/components/Topic/TopicBadge/TopicBadge.tsx
+++ b/src/components/Topic/TopicBadge/TopicBadge.tsx
@@ -80,7 +80,7 @@ export const TopicBadge = (props: Props) => {
                 <Button
                   variant="primary"
                   size="S"
-                  value={isSubscribing() ? t('...subscribing') : t('Subscribe')}
+                  value={isSubscribing() ? t('subscribing...') : t('Subscribe')}
                   onClick={() => subscribe(true)}
                   class={styles.subscribeButton}
                 />
diff --git a/src/components/_shared/Subscribe/Subscribe.tsx b/src/components/_shared/Subscribe/Subscribe.tsx
index 68d45d75..aaaf055a 100644
--- a/src/components/_shared/Subscribe/Subscribe.tsx
+++ b/src/components/_shared/Subscribe/Subscribe.tsx
@@ -44,7 +44,7 @@ export const Subscribe = (props: Props) => {
 
     if (!validate()) return
 
-    setTitle(t('...subscribing'))
+    setTitle(t('subscribing...'))
 
     const requestOptions = {
       method: 'POST',
@@ -106,7 +106,7 @@ export const Subscribe = (props: Props) => {
               <Icon name="arrow-right" />
             </button>
           </div>
-          <div class="description">Подпишитесь на рассылку лучших публикаций</div>
+          <div class="description">Подпишитесь на&nbsp;рассылку лучших публикаций</div>
         </Show>
         <Show when={emailError()}>
           <div class={styles.error}>{emailError()}</div>
diff --git a/src/styles/app.scss b/src/styles/app.scss
index 44b7e5a0..57321255 100644
--- a/src/styles/app.scss
+++ b/src/styles/app.scss
@@ -1036,3 +1036,7 @@ iframe {
 .cursorPointer {
   cursor: pointer;
 }
+
+.img-align-column {
+  clear: both;
+}