From 22cf9bcff6c38b19fdf418155bfae2e837d3f09e Mon Sep 17 00:00:00 2001
From: Surinna Curtis <ekiru.0@gmail.com>
Date: Mon, 25 Sep 2017 23:58:48 -0500
Subject: [PATCH] Make the Toggle in the mute modal look better

---
 .../mastodon/features/ui/components/mute_modal.js         | 7 ++++---
 app/javascript/styles/mastodon/components.scss            | 8 ++++++++
 2 files changed, 12 insertions(+), 3 deletions(-)

diff --git a/app/javascript/mastodon/features/ui/components/mute_modal.js b/app/javascript/mastodon/features/ui/components/mute_modal.js
index 875a7facac..73e48cf09b 100644
--- a/app/javascript/mastodon/features/ui/components/mute_modal.js
+++ b/app/javascript/mastodon/features/ui/components/mute_modal.js
@@ -81,12 +81,13 @@ export default class MuteModal extends React.PureComponent {
               values={{ name: <strong>@{account.get('acct')}</strong> }}
             />
           </p>
-          <p>
-            <label htmlFor='mute-modal__hide-notifications-heckbox'>
+          <div>
+            <label htmlFor='mute-modal__hide-notifications-checkbox'>
               <FormattedMessage id='mute_modal.hide_notifications' defaultMessage='Hide notifications from this user?' />
+              {' '}
               <Toggle id='mute-modal__hide-notifications-checkbox' checked={notifications} onChange={this.toggleNotifications} />
             </label>
-          </p>
+          </div>
         </div>
 
         <div className='mute-modal__action-bar'>
diff --git a/app/javascript/styles/mastodon/components.scss b/app/javascript/styles/mastodon/components.scss
index c619292fee..8d2bae4f43 100644
--- a/app/javascript/styles/mastodon/components.scss
+++ b/app/javascript/styles/mastodon/components.scss
@@ -3580,6 +3580,14 @@ button.icon-button.active i.fa-retweet {
   }
 }
 
+.mute-modal {
+  line-height: 24px;
+}
+
+.mute-modal .react-toggle {
+  vertical-align: middle;
+}
+
 .report-modal__statuses,
 .report-modal__comment {
   padding: 10px;