From 92eaed85d13b2e9903e7b9b31373a072511b5701 Mon Sep 17 00:00:00 2001
From: vsandvold <vsandvold@gmail.com>
Date: Thu, 2 Feb 2017 16:31:22 +0100
Subject: [PATCH] makes the toggle switch not span the entire width of the page

---
 frontend/src/component/common/common.scss         |  2 ++
 frontend/src/component/feature/view-component.jsx | 10 ++++++----
 2 files changed, 8 insertions(+), 4 deletions(-)

diff --git a/frontend/src/component/common/common.scss b/frontend/src/component/common/common.scss
index 497ff9ae73..862b5355a0 100644
--- a/frontend/src/component/common/common.scss
+++ b/frontend/src/component/common/common.scss
@@ -56,6 +56,8 @@
 }
 
 .switchWithLabel {
+    display: flex;
+    
     .label {
         padding-right: 16px;
         line-height: 24px;
diff --git a/frontend/src/component/feature/view-component.jsx b/frontend/src/component/feature/view-component.jsx
index 9a9504bace..054f25ccc1 100644
--- a/frontend/src/component/feature/view-component.jsx
+++ b/frontend/src/component/feature/view-component.jsx
@@ -92,10 +92,12 @@ export default class ViewFeatureToggleComponent extends React.Component {
             <Card shadow={0} className={commonStyles.fullwidth} style={{ overflow: 'visible' }}>
                 <CardTitle style={{ paddingTop: '24px', wordBreak: 'break-all' }}>{featureToggle.name}</CardTitle>
                 <CardText>{featureToggle.description}</CardText>
-                <CardActions border style={{ display: 'flex', alignItems: 'center' }}>
-                    <Switch ripple checked={featureToggle.enabled} onChange={() => toggleFeature(featureToggle.name)}>
-                        {featureToggle.enabled ? 'Enabled' : 'Disabled'}
-                    </Switch>
+                <CardActions border style={{ display: 'flex', alignItems: 'center', justifyContent: 'space-between' }}>
+                    <span style={{ paddingRight: '24px' }}>
+                        <Switch ripple checked={featureToggle.enabled} onChange={() => toggleFeature(featureToggle.name)}>
+                            {featureToggle.enabled ? 'Enabled' : 'Disabled'}
+                        </Switch>
+                    </span>
                     <Button onClick={removeToggle} style={{ flexShrink: 0 }}>Archive</Button>
                 </CardActions>
                 <hr className={commonStyles.divider}/>