summaryrefslogtreecommitdiffstats
diff options
context:
space:
mode:
-rw-r--r--web/react/components/invite_member_modal.jsx22
-rw-r--r--web/react/components/mention_list.jsx2
-rw-r--r--web/sass-files/sass/partials/_base.scss7
-rw-r--r--web/sass-files/sass/partials/_mentions.scss43
-rw-r--r--web/sass-files/sass/partials/_modal.scss20
-rwxr-xr-xweb/sass-files/sass/partials/_perfect-scrollbar.scss4
-rw-r--r--web/sass-files/sass/partials/_responsive.scss5
7 files changed, 66 insertions, 37 deletions
diff --git a/web/react/components/invite_member_modal.jsx b/web/react/components/invite_member_modal.jsx
index 9ff67ae1b..94be2acd6 100644
--- a/web/react/components/invite_member_modal.jsx
+++ b/web/react/components/invite_member_modal.jsx
@@ -162,25 +162,31 @@ module.exports = React.createClass({
invite_sections[index] = (
<div key={"key" + index}>
<div>
- <button type="button" className="btn remove__member" onClick={this.removeInviteFields.bind(this, index)}>×</button>
+ <button type="button" className="btn btn-link remove__member" onClick={this.removeInviteFields.bind(this, index)}><span className="fa fa-trash"></span></button>
</div>
<div className={ email_error ? "form-group invite has-error" : "form-group invite" }>
<input onKeyUp={this.displayNameKeyUp} type="text" ref={"email"+index} className="form-control" placeholder="email@domain.com" maxLength="64" />
{ email_error }
</div>
+ <div className="row--invite">
{ config.AllowInviteNames ?
- <div className={ first_name_error ? "form-group invite has-error" : "form-group invite" }>
- <input type="text" className="form-control" ref={"first_name"+index} placeholder="First name" maxLength="64" />
- { first_name_error }
+ <div className="col-sm-6">
+ <div className={ first_name_error ? "form-group has-error" : "form-group" }>
+ <input type="text" className="form-control" ref={"first_name"+index} placeholder="First name" maxLength="64" />
+ { first_name_error }
+ </div>
</div>
: "" }
{ config.AllowInviteNames ?
- <div className={ last_name_error ? "form-group invite has-error" : "form-group invite" }>
- <input type="text" className="form-control" ref={"last_name"+index} placeholder="Last name" maxLength="64" />
- { last_name_error }
+ <div className="col-sm-6">
+ <div className={ last_name_error ? "form-group has-error" : "form-group" }>
+ <input type="text" className="form-control" ref={"last_name"+index} placeholder="Last name" maxLength="64" />
+ { last_name_error }
+ </div>
</div>
: "" }
</div>
+ </div>
);
}
@@ -203,7 +209,7 @@ module.exports = React.createClass({
<button type="button" className="btn btn-default" onClick={this.addInviteFields}>Add another</button>
<br/>
<br/>
- <label className='control-label'>People invited automatically join Town Square channel.</label>
+ <span>People invited automatically join Town Square channel.</span>
</div>
<div className="modal-footer">
<button type="button" className="btn btn-default" data-dismiss="modal">Close</button>
diff --git a/web/react/components/mention_list.jsx b/web/react/components/mention_list.jsx
index 3fac41073..25834b9e5 100644
--- a/web/react/components/mention_list.jsx
+++ b/web/react/components/mention_list.jsx
@@ -129,7 +129,7 @@ module.exports = React.createClass({
if (numMentions < 1) return (<div/>);
- var height = (numMentions*37) + 2;
+ var height = (numMentions*36) + 4;
var width = $('#'+this.props.id).parent().width();
var bottom = $(window).height() - $('#'+this.props.id).offset().top;
var left = $('#'+this.props.id).offset().left;
diff --git a/web/sass-files/sass/partials/_base.scss b/web/sass-files/sass/partials/_base.scss
index cf28e44e8..fd6225bdd 100644
--- a/web/sass-files/sass/partials/_base.scss
+++ b/web/sass-files/sass/partials/_base.scss
@@ -154,9 +154,4 @@ div.theme {
text-decoration: none;
padding: 0 10px;
}
-}
-
-.invite {
- width: 90%;
-}
-
+} \ No newline at end of file
diff --git a/web/sass-files/sass/partials/_mentions.scss b/web/sass-files/sass/partials/_mentions.scss
index d6e2ab368..da46866c8 100644
--- a/web/sass-files/sass/partials/_mentions.scss
+++ b/web/sass-files/sass/partials/_mentions.scss
@@ -11,12 +11,13 @@
position: absolute;
z-index: 1060;
.mentions-box {
+ max-height: 303px;
position:absolute;
background-color:#fff;
border: $border-gray;
- overflow-x: hidden;
- overflow-y: scroll;
- bottom:0;
+ overflow-x: hidden;
+ overflow-y: scroll;
+ bottom:0;
}
}
@@ -24,13 +25,15 @@
position:relative;
width:100%;
background-color:#fff;
- height:37px;
+ height:36px;
padding:2px;
z-index:101;
- cursor: pointer;
- &:hover {
- background-color:#e8eaed;
- }
+ line-height: 36px;
+ font-size: 13px;
+ cursor: pointer;
+ &:hover {
+ background-color: #E6F2FA;
+ }
}
.mentions-text {
@@ -38,15 +41,20 @@
}
.mention-img {
- margin-right:10px;
- height:32px;
- width:32px;
- border-radius: 10%;
+ margin-right: 6px;
+ height: 32px;
+ width: 32px;
+ line-height: 36px;
+ display: block;
+ font-size: 20px;
+ text-align: center;
+ color: #555;
+ @include border-radius(3px);
}
.mention-fullname {
- color: grey;
- padding-left: 10px;
+ color: grey;
+ padding-left: 10px;
}
.mention-highlight {
@@ -55,9 +63,4 @@
.mention-link {
color:$primary-color;
-}
-
-.mention-align {
- position:relative;
- top:5px;
-}
+} \ No newline at end of file
diff --git a/web/sass-files/sass/partials/_modal.scss b/web/sass-files/sass/partials/_modal.scss
index 637f908ca..707e71cf0 100644
--- a/web/sass-files/sass/partials/_modal.scss
+++ b/web/sass-files/sass/partials/_modal.scss
@@ -15,6 +15,10 @@
}
.remove__member {
float: right;
+ color: #E56565;
+ font-size: 20px;
+ line-height: 0;
+ padding: 6px;
}
.modal-dialog {
max-width: 95%;
@@ -268,3 +272,19 @@
}
}
}
+
+// Invite New Member
+.invite {
+ margin-right: 40px;
+}
+
+.row--invite {
+ margin-right: 40px;
+ @include clearfix;
+ .col-sm-6 {
+ padding: 0 0 0 15px;
+ &:first-child {
+ padding-left: 0;
+ }
+ }
+} \ No newline at end of file
diff --git a/web/sass-files/sass/partials/_perfect-scrollbar.scss b/web/sass-files/sass/partials/_perfect-scrollbar.scss
index f253d0792..f38c6062f 100755
--- a/web/sass-files/sass/partials/_perfect-scrollbar.scss
+++ b/web/sass-files/sass/partials/_perfect-scrollbar.scss
@@ -3,7 +3,7 @@
.ps-container.ps-active-x > .ps-scrollbar-x-rail, .ps-container.ps-active-y > .ps-scrollbar-y-rail {
display: block; }
.ps-container.ps-in-scrolling {
- pointer-events: none; }
+ }
.ps-container.ps-in-scrolling.ps-x > .ps-scrollbar-x-rail {
background-color: #eee;
opacity: 0.9;
@@ -85,7 +85,7 @@
/* there must be 'right' for ps-scrollbar-y */
width: 8px; }
.ps-container:hover.ps-in-scrolling {
- pointer-events: none; }
+ }
.ps-container:hover.ps-in-scrolling.ps-x > .ps-scrollbar-x-rail {
background-color: #eee;
opacity: 0.9;
diff --git a/web/sass-files/sass/partials/_responsive.scss b/web/sass-files/sass/partials/_responsive.scss
index 0eeaa3615..9c0c09ee3 100644
--- a/web/sass-files/sass/partials/_responsive.scss
+++ b/web/sass-files/sass/partials/_responsive.scss
@@ -276,6 +276,11 @@
}
}
}
+ .row--invite {
+ .col-sm-6 {
+ padding: 0;
+ }
+ }
.settings-modal {
&.display--content {
.modal-header {