From 43c76b6a4b42af5c4aff4b001d79bf89ddd109b3 Mon Sep 17 00:00:00 2001
From: "Timothy Z." <timothy@stremio.com>
Date: Thu, 10 Apr 2025 22:48:56 +0300
Subject: [PATCH] refactor(Intro): adjust styles

---
 src/routes/Intro/Intro.js    |  2 +-
 src/routes/Intro/styles.less | 12 ++++++++++++
 2 files changed, 13 insertions(+), 1 deletion(-)

diff --git a/src/routes/Intro/Intro.js b/src/routes/Intro/Intro.js
index 136d4ccea..01ca5eab7 100644
--- a/src/routes/Intro/Intro.js
+++ b/src/routes/Intro/Intro.js
@@ -381,7 +381,7 @@ const Intro = ({ queryParams }) => {
                         <div className={styles['label']}>Continue with Facebook</div>
                     </Button>
                     <Button className={classnames(styles['form-button'], styles['apple-button'])} onClick={loginWithApple}>
-                        <Icon className={styles['icon']} name={'apple'} />
+                        <Icon className={styles['icon']} name={'macos'} />
                         <div className={styles['label']}>Continue with Apple</div>
                     </Button>
                     {
diff --git a/src/routes/Intro/styles.less b/src/routes/Intro/styles.less
index 935b0fad1..335ab9a5c 100644
--- a/src/routes/Intro/styles.less
+++ b/src/routes/Intro/styles.less
@@ -175,15 +175,27 @@
             position: relative;
             width: 22rem;
             margin-left: 2rem;
+            display: flex;
+            flex-direction: column;
 
             .facebook-button {
                 background: var(--color-facebook);
+                margin-bottom: 1rem;
                 
                 &:hover, &:focus {
                     outline: var(--focus-outline-size) solid var(--color-facebook);
                     background-color: transparent;
                 }
             }
+
+            .apple-button {
+                background: var(--color-x);
+                
+                &:hover, &:focus {
+                    outline: var(--focus-outline-size) solid var(--color-x);
+                    background-color: transparent;
+                }
+            }
         }
     }
 }