IntenseWebs/mattermost
3
0
Fork 0
mirror of https://github.com/mattermost/mattermost.git synced 2025-02-25 18:55:24 -06:00
Code Issues Packages Projects Releases Wiki Activity

Merge pull request #156 from asaadmahmoodspin/master

Browse Source 
Improving mentions list and other UI improvements
This commit is contained in:
Joram Wilander
2015-07-10 12:12:03 -04:00
parent ff128d7c16 7d7a50d6b1
commit f433da2e5f
9 changed files with 72 additions and 41 deletions
Download Patch File Download Diff File Expand all files Collapse all files

22
web/react/components/invite_member_modal.jsx
View File

@@ -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>

2
web/react/components/mention_list.jsx
View File

@@ -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;

2
web/react/components/signup_user_complete.jsx
View File

@@ -130,7 +130,7 @@ module.exports = React.createClass({
</div>
{ email }
<label className="control-label">Password</label>
<div className={ name_error ? "form-group has-error" : "form-group" }>
<div className={ password_error ? "form-group has-error" : "form-group" }>
<input type="password" ref="password" className="form-control" placeholder="" maxLength="128" />
{ password_error }
</div>

7
web/sass-files/sass/partials/_base.scss
View File

@@ -154,9 +154,4 @@ div.theme {
text-decoration: none;
padding: 0 10px;
}
}
.invite {
width: 90%;
}
}

43
web/sass-files/sass/partials/_mentions.scss
View File

@@ -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;
}
}

20
web/sass-files/sass/partials/_modal.scss
View File

@@ -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;
}
}
}

4
web/sass-files/sass/partials/_perfect-scrollbar.scss
View File

@@ -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;

5
web/sass-files/sass/partials/_responsive.scss
View File

@@ -276,6 +276,11 @@
}
}
}
.row--invite {
.col-sm-6 {
padding: 0;
}
}
.settings-modal {
&.display--content {
.modal-header {

8
web/sass-files/sass/partials/_signup.scss
View File

@@ -20,7 +20,7 @@
font-size: em(28px);
}
h3 {
font-weight: 600;
font-weight: 600;
margin: 0 0 1.3em 0;
font-size: 1.4em;
}
@@ -91,6 +91,8 @@
.has-error {
.control-label {
margin-top: 5px;
font-size: 14px;
font-weight: 600;
}
}
.reset-form {
@@ -114,6 +116,6 @@
}
.signup-team-login {
padding-bottom: 10px;
font-weight: 700;
padding-bottom: 10px;
font-weight: 700;
}