Fixup always on top window setting

- Style
- Layout
- Add spotlight

3 files changed, 18 insertions, 20 deletions

diff --git a/app/features/settings/components/AlwaysOnTopWindowToggle.js b/app/features/settings/components/AlwaysOnTopWindowToggle.js
index 017f263..dd77e60 100644
--- a/app/features/settings/components/AlwaysOnTopWindowToggle.js
+++ b/app/features/settings/components/AlwaysOnTopWindowToggle.js
@@ -4,7 +4,6 @@ import React, { Component } from 'react';
 import { connect } from 'react-redux';
 import type { Dispatch } from 'redux';
 
-import { TogglesContainer } from '../styled';
 import { setWindowAlwaysOnTop } from '../actions';
 
 import ToggleWithLabel from './ToggleWithLabel';
@@ -45,13 +44,11 @@ class AlwaysOnTopWindowToggle extends Component<Props> {
      */
     render() {
         return (
-            <TogglesContainer>
-                <ToggleWithLabel
-                    isDefaultChecked = { this.props._alwaysOnTopWindowEnabled }
-                    label = 'Always on Top Window'
-                    onChange = { this._onAlwaysOnTopWindowToggleChange }
-                    value = { this.props._alwaysOnTopWindowEnabled } />
-            </TogglesContainer>
+            <ToggleWithLabel
+                isDefaultChecked = { this.props._alwaysOnTopWindowEnabled }
+                label = 'Always on Top Window'
+                onChange = { this._onAlwaysOnTopWindowToggleChange }
+                value = { this.props._alwaysOnTopWindowEnabled } />
         );
     }
 
diff --git a/app/features/settings/components/SettingsDrawer.js b/app/features/settings/components/SettingsDrawer.js
index 3240850..3d800e4 100644
--- a/app/features/settings/components/SettingsDrawer.js
+++ b/app/features/settings/components/SettingsDrawer.js
@@ -12,7 +12,7 @@ import type { Dispatch } from 'redux';
 
 import { closeDrawer, DrawerContainer, Logo } from '../../navbar';
 import { Onboarding, startOnboarding } from '../../onboarding';
-import { AvatarContainer, SettingsContainer } from '../styled';
+import { AvatarContainer, SettingsContainer, TogglesContainer } from '../styled';
 import { setEmail, setName } from '../actions';
 
 import AlwaysOnTopWindowToggle from './AlwaysOnTopWindowToggle';
@@ -130,14 +130,16 @@ class SettingsDrawer extends Component<Props, *> {
                             name = 'server-setting'>
                             <ServerURLField />
                         </SpotlightTarget>
-                        <SpotlightTarget
-                            name = 'start-muted-toggles'>
-                            <StartMutedToggles />
-                        </SpotlightTarget>
-                        <SpotlightTarget
-                            name = 'window-always-on-top'>
-                            <AlwaysOnTopWindowToggle />
-                        </SpotlightTarget>
+                        <TogglesContainer>
+                            <SpotlightTarget
+                                name = 'start-muted-toggles'>
+                                <StartMutedToggles />
+                            </SpotlightTarget>
+                            <SpotlightTarget
+                                name = 'always-on-top-window'>
+                                <AlwaysOnTopWindowToggle />
+                            </SpotlightTarget>
+                        </TogglesContainer>
                         <Onboarding section = 'settings-drawer' />
                     </SettingsContainer>
                 </DrawerContainer>
diff --git a/app/features/settings/components/StartMutedToggles.js b/app/features/settings/components/StartMutedToggles.js
index 3c3ebd6..3cee823 100644
--- a/app/features/settings/components/StartMutedToggles.js
+++ b/app/features/settings/components/StartMutedToggles.js
@@ -4,7 +4,6 @@ import React, { Component } from 'react';
 import { connect } from 'react-redux';
 import type { Dispatch } from 'redux';
 
-import { TogglesContainer } from '../styled';
 import {
     setStartWithAudioMuted,
     setStartWithVideoMuted
@@ -85,7 +84,7 @@ class StartMutedToggles extends Component<Props, State> {
      */
     render() {
         return (
-            <TogglesContainer>
+            <>
                 <ToggleWithLabel
                     isDefaultChecked = { this.props._startWithAudioMuted }
                     label = 'Start with Audio muted'
@@ -96,7 +95,7 @@ class StartMutedToggles extends Component<Props, State> {
                     label = 'Start with Video muted'
                     onChange = { this._onVideoToggleChange }
                     value = { this.state.startWithVideoMuted } />
-            </TogglesContainer>
+            </>
         );
     }