From ede83bf424100856774034e3b2d24f5346c77a60 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Patryk=20J=C3=B3=C5=BAwiak?= <patryk.jozwiak@outlook.com>
Date: Wed, 4 Oct 2017 23:47:30 +0200
Subject: [PATCH] Add width adjustment. (#91)

---
 components/Carbon.js   | 7 ++++++-
 components/Settings.js | 5 +++++
 pages/editor.js        | 1 +
 3 files changed, 12 insertions(+), 1 deletion(-)

diff --git a/components/Carbon.js b/components/Carbon.js
index ed867ab..8c9c58c 100644
--- a/components/Carbon.js
+++ b/components/Carbon.js
@@ -83,6 +83,7 @@ class Carbon extends React.Component {
     // create styles
     const containerStyle = {
       background: config.background,
+      minWidth: config.widthAdjustment ? '90px' : '680px',
       padding: `${config.paddingVertical} ${config.paddingHorizontal}`
     }
 
@@ -123,6 +124,10 @@ class Carbon extends React.Component {
               box-shadow: none;
             }
 
+            #container :global(.CodeMirror__container) {
+              min-width: inherit;
+            }
+
             #container :global(.CodeMirror__container.dropshadow) {
               box-shadow: 0 20px 68px rgba(0, 0, 0, 0.55);
               border-radius: 5px;
@@ -130,7 +135,7 @@ class Carbon extends React.Component {
 
             #container :global(.CodeMirror__container .CodeMirror) {
               height: auto;
-              min-width: 680px;
+              min-width: inherit;
               padding: 18px 18px;
               border-radius: 5px;
               font-family: Hack, monospace !important;
diff --git a/components/Settings.js b/components/Settings.js
index 5bbefe4..76396c8 100644
--- a/components/Settings.js
+++ b/components/Settings.js
@@ -46,6 +46,11 @@ class Settings extends React.Component {
             enabled={this.props.enabled.windowControls}
             onChange={this.props.onChange.bind(null, 'windowControls')}
           />
+          <Toggle
+            label="Width adjustment"
+            enabled={this.props.enabled.widthAdjustment}
+            onChange={this.props.onChange.bind(null, 'widthAdjustment')}
+          />
           <Slider
             label="Padding (vertical)"
             initialValue={16}
diff --git a/pages/editor.js b/pages/editor.js
index a1f13cd..fe452b9 100644
--- a/pages/editor.js
+++ b/pages/editor.js
@@ -48,6 +48,7 @@ class Editor extends React.Component {
       language: DEFAULT_LANGUAGE,
       dropShadow: true,
       windowControls: true,
+      widthAdjustment: true,
       paddingVertical: '48px',
       paddingHorizontal: '32px',
       uploading: false,