Merge pull request #328 from asaadmahmoodspin/mm-1874

mm-1874 - Improving team url screen and fixing file attachments in IE 10

3 files changed, 31 insertions, 4 deletions

diff --git a/web/react/components/signup_team_complete.jsx b/web/react/components/signup_team_complete.jsx
index 447a405bd..3f35a5912 100644
--- a/web/react/components/signup_team_complete.jsx
+++ b/web/react/components/signup_team_complete.jsx
@@ -248,6 +248,8 @@ TeamURLPage = React.createClass({
     },
     render: function() {
 
+        $('body').tooltip( {selector: '[data-toggle=tooltip]', trigger: 'hover click'} );
+
         client.track('signup', 'signup_team_03_url');
 
         var name_error = this.state.name_error ? <label className="control-label">{ this.state.name_error }</label> : null;
@@ -260,8 +262,8 @@ TeamURLPage = React.createClass({
                 <div className={ name_error ? "form-group has-error" : "form-group" }>
                <div className="row">
                     <div className="col-sm-11">
-                        <div className="input-group">
-                            <span className="input-group-addon">{ utils.getWindowLocationOrigin() + "/" }</span>
+                        <div className="input-group input-group--limit">
+                            <span data-toggle="tooltip" title={ utils.getWindowLocationOrigin() + "/" } className="input-group-addon">{ utils.getWindowLocationOrigin() + "/" }</span>
                             <input type="text" ref="name" className="form-control" placeholder="" maxLength="128" defaultValue={this.props.state.team.name} autoFocus={true} onFocus={this.handleFocus}/>
                         </div>
                     </div>
diff --git a/web/sass-files/sass/partials/_files.scss b/web/sass-files/sass/partials/_files.scss
index ddc5e98bb..22e2f44c5 100644
--- a/web/sass-files/sass/partials/_files.scss
+++ b/web/sass-files/sass/partials/_files.scss
@@ -114,8 +114,7 @@
   height: 100px;
   float: left;
   margin: 5px 10px 5px 0;
-  @include display-flex;
-  display: -ms-flexbox;
+  display: table;
   border: 1px solid lightgrey;
   .post__load {
     height: 100%;
@@ -137,10 +136,14 @@
     }
   }
   .post-image__thumbnail {
+    display: table-cell;
+    vertical-align: top;
     width: 50%;
     height: 100%;
   }
   .post-image__details {
+    display: table-cell;
+    vertical-align: top;
     width: 50%;
     height: 100%;
     background: white;
diff --git a/web/sass-files/sass/partials/_signup.scss b/web/sass-files/sass/partials/_signup.scss
index 4b6ee79a1..3a6f73316 100644
--- a/web/sass-files/sass/partials/_signup.scss
+++ b/web/sass-files/sass/partials/_signup.scss
@@ -54,6 +54,28 @@
         margin-bottom: 1em;
     }
 
+    .input-group {
+        &.input-group--limit {
+            table-layout: fixed;
+            width: 100%;
+            .tooltip-inner {
+                word-wrap: break-word;
+            }
+            .form-control {
+                text-align: left;
+                display: table-cell;
+                width: 100%;
+            }
+            .input-group-addon {
+                text-align: left;
+                width: 50%;
+                display: table-cell;
+                overflow: hidden;
+                text-overflow: ellipsis;
+            }
+        }
+    }
+
     .inner__content {
         padding: 0 15px;
         margin: 30px 0 20px;