summaryrefslogtreecommitdiffstats
path: root/web
diff options
context:
space:
mode:
Diffstat (limited to 'web')
-rw-r--r--web/react/components/admin_console/admin_sidebar.jsx9
-rw-r--r--web/react/components/admin_console/ldap_settings.jsx26
-rw-r--r--web/react/components/rhs_root_post.jsx1
-rw-r--r--web/react/components/settings_sidebar.jsx7
-rw-r--r--web/react/components/suggestion/search_channel_provider.jsx2
-rw-r--r--web/react/components/suggestion/search_user_provider.jsx2
-rw-r--r--web/react/components/user_settings/custom_theme_chooser.jsx2
-rw-r--r--web/react/utils/utils.jsx5
-rw-r--r--web/sass-files/sass/partials/_base.scss4
-rw-r--r--web/sass-files/sass/partials/_popover.scss5
-rw-r--r--web/sass-files/sass/partials/_post_right.scss4
-rw-r--r--web/sass-files/sass/partials/_responsive.scss5
-rw-r--r--web/sass-files/sass/partials/_search.scss2
-rw-r--r--web/sass-files/sass/partials/_settings.scss244
14 files changed, 175 insertions, 143 deletions
diff --git a/web/react/components/admin_console/admin_sidebar.jsx b/web/react/components/admin_console/admin_sidebar.jsx
index 587fb35ed..1279f4d22 100644
--- a/web/react/components/admin_console/admin_sidebar.jsx
+++ b/web/react/components/admin_console/admin_sidebar.jsx
@@ -255,15 +255,6 @@ export default class AdminSidebar extends React.Component {
<li>
<a
href='#'
- className={this.isSelected('ldap_settings')}
- onClick={this.handleClick.bind(this, 'ldap_settings', null)}
- >
- {'LDAP Settings'}
- </a>
- </li>
- <li>
- <a
- href='#'
className={this.isSelected('legal_and_support_settings')}
onClick={this.handleClick.bind(this, 'legal_and_support_settings', null)}
>
diff --git a/web/react/components/admin_console/ldap_settings.jsx b/web/react/components/admin_console/ldap_settings.jsx
index f8ea62192..6e3da2f72 100644
--- a/web/react/components/admin_console/ldap_settings.jsx
+++ b/web/react/components/admin_console/ldap_settings.jsx
@@ -92,6 +92,12 @@ export default class LdapSettings extends React.Component {
return (
<div className='wrapper--fixed'>
+ <div className='banner'>
+ <div className='banner__content'>
+ <h4 className='banner__heading'>{'Note:'}</h4>
+ <p>{'If a user attribute changes on the LDAP server it will be updated the next time the user enters their credentials to log in to Mattermost. This includes if a user is made inactive or removed from an LDAP server. Synchronization with LDAP servers is planned in a future release.'}</p>
+ </div>
+ </div>
<h3>{'LDAP Settings'}</h3>
<form
className='form-horizontal'
@@ -147,7 +153,7 @@ export default class LdapSettings extends React.Component {
onChange={this.handleChange}
disabled={!this.state.enable}
/>
- <p className='help-text'>{'The domain or ip address of LDAP server.'}</p>
+ <p className='help-text'>{'The domain or IP address of LDAP server.'}</p>
</div>
</div>
<div className='form-group'>
@@ -168,7 +174,7 @@ export default class LdapSettings extends React.Component {
onChange={this.handleChange}
disabled={!this.state.enable}
/>
- <p className='help-text'>{'The port to connect to the LDAP server on. Default is 389.'}</p>
+ <p className='help-text'>{'The port Mattermost will use to connect to the LDAP server. Default is 389.'}</p>
</div>
</div>
<div className='form-group'>
@@ -189,7 +195,7 @@ export default class LdapSettings extends React.Component {
onChange={this.handleChange}
disabled={!this.state.enable}
/>
- <p className='help-text'>{'The base dn where mattermost should search for users.'}</p>
+ <p className='help-text'>{'The Base DN is the Distinguished Name of the location where Mattermost should start its search for users in the LDAP tree.'}</p>
</div>
</div>
<div className='form-group'>
@@ -210,7 +216,7 @@ export default class LdapSettings extends React.Component {
onChange={this.handleChange}
disabled={!this.state.enable}
/>
- <p className='help-text'>{'Username of a user with read access to the LDAP server specified.'}</p>
+ <p className='help-text'>{'The username used to perform the LDAP search. This should typically be an account created specifically for use with Mattermost. It should have access limited to read the portion of the LDAP tree specified in the BaseDN field.'}</p>
</div>
</div>
<div className='form-group'>
@@ -231,7 +237,7 @@ export default class LdapSettings extends React.Component {
onChange={this.handleChange}
disabled={!this.state.enable}
/>
- <p className='help-text'>{'Password of the user given above.'}</p>
+ <p className='help-text'>{'Password of the user given in "Bind Username".'}</p>
</div>
</div>
<div className='form-group'>
@@ -252,7 +258,7 @@ export default class LdapSettings extends React.Component {
onChange={this.handleChange}
disabled={!this.state.enable}
/>
- <p className='help-text'>{'The first name attribute of entires in the LDAP server.'}</p>
+ <p className='help-text'>{'The attribute in the LDAP server that will be used to populate the first name of users in Mattermost.'}</p>
</div>
</div>
<div className='form-group'>
@@ -273,7 +279,7 @@ export default class LdapSettings extends React.Component {
onChange={this.handleChange}
disabled={!this.state.enable}
/>
- <p className='help-text'>{'The last name attribute of entries in the LDAP server.'}</p>
+ <p className='help-text'>{'The attribute in the LDAP server that will be used to populate the last name of users in Mattermost.'}</p>
</div>
</div>
<div className='form-group'>
@@ -294,7 +300,7 @@ export default class LdapSettings extends React.Component {
onChange={this.handleChange}
disabled={!this.state.enable}
/>
- <p className='help-text'>{'The email attribute of entries in the LDAP server.'}</p>
+ <p className='help-text'>{'The attribute in the LDAP server that will be used to populate the email addresses of users in Mattermost.'}</p>
</div>
</div>
<div className='form-group'>
@@ -315,7 +321,7 @@ export default class LdapSettings extends React.Component {
onChange={this.handleChange}
disabled={!this.state.enable}
/>
- <p className='help-text'>{'The attribute of entries in the LDAP server to use for username in Mattermost. May be the same as the ID Attribute.'}</p>
+ <p className='help-text'>{'The attribute in the LDAP server that will be used to populate the username field in Mattermost. This may be the same as the ID Attribute.'}</p>
</div>
</div>
<div className='form-group'>
@@ -336,7 +342,7 @@ export default class LdapSettings extends React.Component {
onChange={this.handleChange}
disabled={!this.state.enable}
/>
- <p className='help-text'>{'The attribute of entries in the LDAP server to use as a unique identifier. Users will use this to login. Ideally this would be the username they are used to loging in with. May be the same as the username attribute above.'}</p>
+ <p className='help-text'>{'The attribute in the LDAP server that will be used as a unique identifier in Mattermost. It should be an LDAP attribute with a value that does not change, such as username or uid. If a user’s Id Attribute changes, it will create a new Mattermost account unassociated with their old one. This is the value used to log in to Mattermost in the "LDAP Username" field on the sign in page. Normally this attribute is the same as the “Username Attribute” field above. If your team typically uses domain\\username to sign in to other services with LDAP, you may choose to put domain\\username in this field to maintain consistency between sites.'}</p>
</div>
</div>
<div className='form-group'>
diff --git a/web/react/components/rhs_root_post.jsx b/web/react/components/rhs_root_post.jsx
index dd9a793be..cd7f6766c 100644
--- a/web/react/components/rhs_root_post.jsx
+++ b/web/react/components/rhs_root_post.jsx
@@ -227,7 +227,6 @@ export default class RhsRootPost extends React.Component {
</div>
</div>
</div>
- <hr />
</div>
);
}
diff --git a/web/react/components/settings_sidebar.jsx b/web/react/components/settings_sidebar.jsx
index 4af46c35a..271ea9a41 100644
--- a/web/react/components/settings_sidebar.jsx
+++ b/web/react/components/settings_sidebar.jsx
@@ -1,6 +1,8 @@
// Copyright (c) 2015 Mattermost, Inc. All Rights Reserved.
// See License.txt for license information.
+import * as Utils from '../utils/utils.jsx';
+
export default class SettingsSidebar extends React.Component {
componentDidUpdate() {
$('.settings-modal').find('.modal-body').scrollTop(0);
@@ -16,6 +18,11 @@ export default class SettingsSidebar extends React.Component {
this.props.updateTab(tab.name);
$(e.target).closest('.settings-modal').addClass('display--content');
}
+ componentDidMount() {
+ if (Utils.isBrowserFirefox()) {
+ $('.settings-modal .settings-table .nav').addClass('position--top');
+ }
+ }
render() {
let tabList = this.props.tabs.map(function makeTab(tab) {
let key = `${tab.name}_li`;
diff --git a/web/react/components/suggestion/search_channel_provider.jsx b/web/react/components/suggestion/search_channel_provider.jsx
index 7547a9341..66a534907 100644
--- a/web/react/components/suggestion/search_channel_provider.jsx
+++ b/web/react/components/suggestion/search_channel_provider.jsx
@@ -19,7 +19,7 @@ class SearchChannelSuggestion extends React.Component {
onClick={onClick}
className={className}
>
- {item.name}
+ <i className='fa fa fa-plus-square'></i>{item.name}
</div>
);
}
diff --git a/web/react/components/suggestion/search_user_provider.jsx b/web/react/components/suggestion/search_user_provider.jsx
index cf2953937..0d553bfc4 100644
--- a/web/react/components/suggestion/search_user_provider.jsx
+++ b/web/react/components/suggestion/search_user_provider.jsx
@@ -22,7 +22,7 @@ class SearchUserSuggestion extends React.Component {
className='profile-img rounded'
src={'/api/v1/users/' + item.id + '/image?time=' + item.update_at}
/>
- {item.username}
+ <i className='fa fa fa-plus-square'></i>{item.username}
</div>
);
}
diff --git a/web/react/components/user_settings/custom_theme_chooser.jsx b/web/react/components/user_settings/custom_theme_chooser.jsx
index b7d90922a..8ec3863f3 100644
--- a/web/react/components/user_settings/custom_theme_chooser.jsx
+++ b/web/react/components/user_settings/custom_theme_chooser.jsx
@@ -104,7 +104,7 @@ export default class CustomThemeChooser extends React.Component {
>
<label className='custom-label'>{element.uiName}</label>
<div
- className='input-group theme-group dropdown'
+ className='input-group theme-group group--code dropdown'
id={element.id}
>
<select
diff --git a/web/react/utils/utils.jsx b/web/react/utils/utils.jsx
index 2ade00d29..c2b2ce15a 100644
--- a/web/react/utils/utils.jsx
+++ b/web/react/utils/utils.jsx
@@ -647,10 +647,11 @@ export function applyTheme(theme) {
changeCss('.attachment .attachment__content', 'border-color:' + changeOpacity(theme.centerChannelColor, 0.3), 1);
changeCss('.channel-intro .channel-intro__content, .webhooks__container', 'background:' + changeOpacity(theme.centerChannelColor, 0.05), 1);
changeCss('.date-separator .separator__text', 'color:' + theme.centerChannelColor, 2);
- changeCss('.date-separator .separator__hr, .modal-footer, .modal .custom-textarea, .post-right__container .post.post--root hr, .search-item-container', 'border-color:' + changeOpacity(theme.centerChannelColor, 0.2), 1);
+ changeCss('.date-separator .separator__hr, .modal-footer, .modal .custom-textarea', 'border-color:' + changeOpacity(theme.centerChannelColor, 0.2), 1);
+ changeCss('.search-item-container, .post-right__container .post.post--root', 'border-color:' + changeOpacity(theme.centerChannelColor, 0.1), 1);
changeCss('.modal .custom-textarea:focus', 'border-color:' + changeOpacity(theme.centerChannelColor, 0.3), 1);
changeCss('.channel-intro, .settings-modal .settings-table .settings-content .divider-dark, hr, .settings-modal .settings-table .settings-links', 'border-color:' + changeOpacity(theme.centerChannelColor, 0.2), 1);
- changeCss('.post.current--user .post__body, .post.post--comment.other--root.current--user .post-comment, pre', 'background:' + changeOpacity(theme.centerChannelColor, 0.07), 1);
+ changeCss('.post.current--user .post__body, .post.post--comment.other--root.current--user .post-comment, pre, .post-right__container .post.post--root', 'background:' + changeOpacity(theme.centerChannelColor, 0.07), 1);
changeCss('.post.current--user .post__body, .post.post--comment.other--root.current--user .post-comment, .post.same--root.post--comment .post__body, .modal .more-table tbody>tr td, .member-div:first-child, .member-div, .access-history__table .access__report, .activity-log__table', 'border-color:' + changeOpacity(theme.centerChannelColor, 0.1), 2);
changeCss('@media(max-width: 1800px){.inner__wrap.move--left .post.post--comment.same--root', 'border-color:' + changeOpacity(theme.centerChannelColor, 0.07), 2);
changeCss('.post:hover, .modal .more-table tbody>tr:hover td, .settings-modal .settings-table .settings-content .section-min:hover', 'background:' + changeOpacity(theme.centerChannelColor, 0.07), 1);
diff --git a/web/sass-files/sass/partials/_base.scss b/web/sass-files/sass/partials/_base.scss
index 4f9e1d5c7..04ba9c51e 100644
--- a/web/sass-files/sass/partials/_base.scss
+++ b/web/sass-files/sass/partials/_base.scss
@@ -125,10 +125,6 @@ a:focus, a:hover {
}
}
-select {
- -moz-appearance:none;
-}
-
.form-control {
@include border-radius(2px);
&:focus {
diff --git a/web/sass-files/sass/partials/_popover.scss b/web/sass-files/sass/partials/_popover.scss
index 1ae07fe5b..8a61758f1 100644
--- a/web/sass-files/sass/partials/_popover.scss
+++ b/web/sass-files/sass/partials/_popover.scss
@@ -85,6 +85,11 @@
background: rgba(black, 0.2);
}
+ .fa {
+ margin-right: 5px;
+ @include opacity(0.5);
+ }
+
.profile-img {
margin-top: -1px;
height: 16px;
diff --git a/web/sass-files/sass/partials/_post_right.scss b/web/sass-files/sass/partials/_post_right.scss
index fa52e2972..d820447f5 100644
--- a/web/sass-files/sass/partials/_post_right.scss
+++ b/web/sass-files/sass/partials/_post_right.scss
@@ -17,7 +17,8 @@
.post {
&.post--root {
- padding-bottom: 0;
+ padding-bottom: 1.2em;
+ border-bottom: 1px solid #ddd;
}
.post__header {
@@ -36,6 +37,7 @@
hr {
margin-bottom: 0;
+ border: none;
}
.post-create__container {
diff --git a/web/sass-files/sass/partials/_responsive.scss b/web/sass-files/sass/partials/_responsive.scss
index 2aa130fa9..694a3e741 100644
--- a/web/sass-files/sass/partials/_responsive.scss
+++ b/web/sass-files/sass/partials/_responsive.scss
@@ -336,7 +336,10 @@
}
}
.settings-table {
- .nav, .nav.absolute {
+ .nav {
+ &.position--top {
+ top: auto;
+ }
position: relative;
top: auto;
width: 100%;
diff --git a/web/sass-files/sass/partials/_search.scss b/web/sass-files/sass/partials/_search.scss
index 0d9d7b50d..9ef4784d8 100644
--- a/web/sass-files/sass/partials/_search.scss
+++ b/web/sass-files/sass/partials/_search.scss
@@ -134,7 +134,7 @@
}
.search-item-time {
- color: #a8adb7;
+ @include opacity(0.7);
}
.search-results-none {
diff --git a/web/sass-files/sass/partials/_settings.scss b/web/sass-files/sass/partials/_settings.scss
index 473ffb28d..bd47ca960 100644
--- a/web/sass-files/sass/partials/_settings.scss
+++ b/web/sass-files/sass/partials/_settings.scss
@@ -82,9 +82,8 @@
.nav {
position: fixed;
width: 179px;
- &.absolute {
- position: absolute;
- top: 0;
+ &.position--top {
+ top: 57px;
}
}
.security-links {
@@ -141,144 +140,167 @@
width: 29px;
}
}
- .premade-themes {
- margin-bottom: 10px;
- .theme-label {
- font-weight: 400;
- margin-top: 5px;
- }
- img {
- border: 3px solid transparent;
+ .group--code {
+ select {
+ padding-right: 25px;
}
- .active {
- img {
- border-color: $primary-color;
- }
+ &:before {
+ position: absolute;
+ top: 11px;
+ right: 50px;
+ z-index: 5;
+ content: "\f0d7";
+ display: inline-block;
+ font: normal normal normal 14px/1 FontAwesome;
+ font-size: inherit;
+ text-rendering: auto;
+ -webkit-font-smoothing: antialiased;
+ -moz-osx-font-smoothing: grayscale;
}
+ select {
+ -moz-appearance:none;
+ -webkit-appearance:none;
+ appearance:none;
+ }
+ }
+ .premade-themes {
+ margin-bottom: 10px;
+ .theme-label {
+ font-weight: 400;
+ margin-top: 5px;
}
- .custom-label {
- font-weight: normal;
- font-size: 13px;
- width: 100%;
- overflow: hidden;
- text-overflow: ellipsis;
- margin-bottom: 0;
- }
- .input-group-addon {
- background: transparent;
+ img {
+ border: 3px solid transparent;
}
- .radio {
- label {
- font-weight: 600;
+ .active {
+ img {
+ border-color: $primary-color;
}
}
}
-
- .section-title {
- margin-bottom: 5px;
- font-weight: 600;
+ .custom-label {
+ font-weight: normal;
+ font-size: 13px;
+ width: 100%;
+ overflow: hidden;
+ text-overflow: ellipsis;
+ margin-bottom: 0;
}
-
- .section-edit {
- text-align: right;
- margin-bottom: 5px;
- .fa {
- margin-right: 5px;
- font-size: 12px;
- @include opacity(0.5);
- display: none;
+ .input-group-addon {
+ background: transparent;
+ }
+ .radio {
+ label {
+ font-weight: 600;
}
}
+ }
- .section-describe {
- @include opacity(0.7);
- white-space:pre;
- }
+ .section-title {
+ margin-bottom: 5px;
+ font-weight: 600;
+ }
- .divider-dark {
- border-bottom:1px solid #aaaaaa;
+ .section-edit {
+ text-align: right;
+ margin-bottom: 5px;
+ .fa {
+ margin-right: 5px;
+ font-size: 12px;
+ @include opacity(0.5);
+ display: none;
}
+ }
- .divider-light {
- border-bottom:1px solid lightgrey;
- }
+ .section-describe {
+ @include opacity(0.7);
+ white-space:pre;
+ }
- .setting-list {
- padding: 0;
- list-style-type:none;
- }
+ .divider-dark {
+ border-bottom:1px solid #aaaaaa;
+ }
- .setting-list__hint {
- margin-top: 20px;
- }
+ .divider-light {
+ border-bottom:1px solid lightgrey;
+ }
- .mentions-input {
- margin-top: 10px;
- }
+ .setting-list {
+ padding: 0;
+ list-style-type:none;
+ }
- .setting-list-item {
- margin-top:7px;
- }
- .has-error {
- color: #a94442;
- }
+ .setting-list__hint {
+ margin-top: 20px;
+ }
- .file-status {
- font-size: 13px;
- margin-top: 8px;
- color: #555;
- }
+ .mentions-input {
+ margin-top: 10px;
+ }
- .confirm-import {
- padding: 4px 10px;
- margin: 10px 0;
- }
+ .setting-list-item {
+ margin-top:7px;
+ }
+ .has-error {
+ color: #a94442;
+ }
+ .file-status {
+ font-size: 13px;
+ margin-top: 8px;
+ color: #555;
}
+
+ .confirm-import {
+ padding: 4px 10px;
+ margin: 10px 0;
+ }
+
}
- .nav-pills {
- > li {
- margin: 0;
+}
+.nav-pills {
+ > li {
+ margin: 0;
+ a {
+ border-radius: 0;
+ color: #777;
+ }
+ .glyphicon {
+ width: 25px;
+ top: 2px;
+ }
+ &:hover {
a {
- border-radius: 0;
- color: #777;
+ background: #E6F2FA;
}
- .glyphicon {
- width: 25px;
- top: 2px;
- }
- &:hover {
- a {
- background: #E6F2FA;
+ }
+ &.active {
+ a {
+ color: #111;
+ background-color: #E1E1E1;
+ &:before {
+ content: '';
+ position: absolute;
+ top: 0;
+ left: 0;
+ width: 5px;
+ height: 100%;
+ background: #000;
}
}
- &.active {
- a {
- color: #111;
- background-color: #E1E1E1;
- &:before {
- content: '';
- position: absolute;
- top: 0;
- left: 0;
- width: 5px;
- height: 100%;
- background: #000;
- }
- }
- a, a:hover, a:focus {
- padding-right: 10px;
- background-color: rgba(black, 0.1);
- border-radius: 0;
- font-weight: 400;
- position: relative;
- }
+ a, a:hover, a:focus {
+ padding-right: 10px;
+ background-color: rgba(black, 0.1);
+ border-radius: 0;
+ font-weight: 400;
+ position: relative;
}
}
}
- h3 {
- font-size: em(20px);
- }
+}
+h3 {
+ font-size: em(20px);
+}
}
.channel-settings {