From 67d3368e1ef2e05b6cae4c31d419168b2a38ee52 Mon Sep 17 00:00:00 2001
From: Matthew Hodgson <matthew@matrix.org>
Date: Tue, 21 Jul 2015 17:02:06 -0700
Subject: [PATCH] fix up some of the modals

---
 skins/base/css/common.css                    |  6 +++--
 skins/base/views/molecules/ChangeAvatar.js   |  8 +++++--
 skins/base/views/molecules/ChangePassword.js | 24 +++++++++++++-------
 skins/base/views/organisms/LogoutPrompt.js   | 12 ++++++----
 skins/base/views/organisms/RoomView.js       |  1 -
 5 files changed, 34 insertions(+), 17 deletions(-)

diff --git a/skins/base/css/common.css b/skins/base/css/common.css
index b4941e38..55b9a6db 100644
--- a/skins/base/css/common.css
+++ b/skins/base/css/common.css
@@ -86,14 +86,16 @@ html {
 
 .mx_Dialog button {
     border: 0px;
-    width: 80px;
     height: 36px;
-    line-height: 36px;
     border-radius: 36px;
     font-weight: 400;
     font-size: 16px;
     color: #fff;
     background-color: #80cef4;
+    margin-left: 8px;
+    margin-right: 8px;
+    padding-left: 1em;
+    padding-right: 1em;
 }
 
 .mx_ErrorDialogTitle {
diff --git a/skins/base/views/molecules/ChangeAvatar.js b/skins/base/views/molecules/ChangeAvatar.js
index a374f0ff..e70da3a7 100644
--- a/skins/base/views/molecules/ChangeAvatar.js
+++ b/skins/base/views/molecules/ChangeAvatar.js
@@ -43,11 +43,15 @@ module.exports = React.createClass({
             case this.Phases.Error:
                 return (
                     <div>
-                        <img src={this.state.avatarUrl} />
-                        <div>
+                        <div className="mx_Dialog_content">
+                            <img src={this.state.avatarUrl}/>
+                        </div>
+                        <div className="mx_Dialog_content">
                             Upload new:
                             <input type="file" onChange={this.onFileSelected}/>
                             {this.state.errorText}
+                        </div>    
+                        <div className="mx_Dialog_buttons">
                             <button onClick={this.props.onFinished}>Cancel</button>
                         </div>
                     </div>
diff --git a/skins/base/views/molecules/ChangePassword.js b/skins/base/views/molecules/ChangePassword.js
index 969a43d8..2f92f9ab 100644
--- a/skins/base/views/molecules/ChangePassword.js
+++ b/skins/base/views/molecules/ChangePassword.js
@@ -51,11 +51,13 @@ module.exports = React.createClass({
             case this.Phases.Error:
                 return (
                     <div>
-                        <div>{this.state.errorString}</div>
-                        <label>Old password <input type="password" ref="old_input"/></label>
-                        <label>New password <input type="password" ref="new_input"/></label>
-                        <label>Confirm password <input type="password" ref="confirm_input"/></label>
-                        <div>
+                        <div className="mx_Dialog_content">
+                            <div>{this.state.errorString}</div>
+                            <div><label>Old password <input type="password" ref="old_input"/></label></div>
+                            <div><label>New password <input type="password" ref="new_input"/></label></div>
+                            <div><label>Confirm password <input type="password" ref="confirm_input"/></label></div>
+                        </div>
+                        <div className="mx_Dialog_buttons">
                             <button onClick={this.onClickChange}>Change Password</button>
                             <button onClick={this.props.onFinished}>Cancel</button>
                         </div>
@@ -63,13 +65,19 @@ module.exports = React.createClass({
                 );
             case this.Phases.Uploading:
                 return (
-                    <Loader />
+                    <div className="mx_Dialog_content">
+                        <Loader />
+                    </div>
                 );
             case this.Phases.Success:
                 return (
                     <div>
-                        Success!
-                        <button onClick={this.props.onFinished}>Ok</button>
+                        <div className="mx_Dialog_content">
+                            Success!
+                        </div>
+                        <div className="mx_Dialog_buttons">
+                            <button onClick={this.props.onFinished}>Ok</button>
+                        </div>
                     </div>
                 )
         }
diff --git a/skins/base/views/organisms/LogoutPrompt.js b/skins/base/views/organisms/LogoutPrompt.js
index dc76032a..10ed07ed 100644
--- a/skins/base/views/organisms/LogoutPrompt.js
+++ b/skins/base/views/organisms/LogoutPrompt.js
@@ -26,10 +26,14 @@ module.exports = React.createClass({
 
     render: function() {
         return (
-            <div className="mx_LogoutPrompt">
-                Sign out?<br />
-                <button onClick={this.logOut}>Sign Out</button>
-                <button onClick={this.cancelPrompt}>Cancel</button>
+            <div>
+                <div className="mx_Dialog_content">
+                    Sign out?
+                </div>
+                <div className="mx_Dialog_buttons">
+                    <button onClick={this.logOut}>Sign Out</button>
+                    <button onClick={this.cancelPrompt}>Cancel</button>
+                </div>
             </div>
         );
     },
diff --git a/skins/base/views/organisms/RoomView.js b/skins/base/views/organisms/RoomView.js
index 1a4c1ecb..25841b91 100644
--- a/skins/base/views/organisms/RoomView.js
+++ b/skins/base/views/organisms/RoomView.js
@@ -21,7 +21,6 @@ var React = require('react');
 var MatrixClientPeg = require("../../../../src/MatrixClientPeg");
 
 var ComponentBroker = require('../../../../src/ComponentBroker');
-var Modal = require("../../../../src/Modal");
 var classNames = require("classnames");
 var filesize = require('filesize');
 var q = require('q');