summaryrefslogtreecommitdiffstats
diff options
context:
space:
mode:
-rw-r--r--webapp/components/admin_console/multiselect_settings.jsx5
-rw-r--r--webapp/components/analytics/statistic_count.jsx2
-rw-r--r--webapp/components/change_url_modal.jsx16
-rw-r--r--webapp/components/form_error.jsx12
-rw-r--r--webapp/components/tutorial/tutorial_intro_screens.jsx57
-rw-r--r--webapp/components/user_settings/user_settings_notifications.jsx2
-rw-r--r--webapp/sass/components/_tutorial.scss9
-rw-r--r--webapp/sass/layout/_post.scss17
-rw-r--r--webapp/sass/routes/_admin-console.scss7
-rw-r--r--webapp/sass/routes/_backstage.scss6
-rw-r--r--webapp/sass/routes/_settings.scss9
-rw-r--r--webapp/utils/utils.jsx4
12 files changed, 88 insertions, 58 deletions
diff --git a/webapp/components/admin_console/multiselect_settings.jsx b/webapp/components/admin_console/multiselect_settings.jsx
index 8aad5d6eb..3120e03a8 100644
--- a/webapp/components/admin_console/multiselect_settings.jsx
+++ b/webapp/components/admin_console/multiselect_settings.jsx
@@ -54,7 +54,10 @@ export default class MultiSelectSetting extends React.Component {
onChange={this.handleChange}
value={this.props.selected}
/>
- <FormError error={this.state.error}/>
+ <FormError
+ noMargin={true}
+ error={this.state.error}
+ />
</Setting>
);
}
diff --git a/webapp/components/analytics/statistic_count.jsx b/webapp/components/analytics/statistic_count.jsx
index 89e0cc8df..a4ca66476 100644
--- a/webapp/components/analytics/statistic_count.jsx
+++ b/webapp/components/analytics/statistic_count.jsx
@@ -15,7 +15,7 @@ export default class StatisticCount extends React.Component {
);
return (
- <div className='col-sm-3'>
+ <div className='col-md-3 col-sm-6'>
<div className='total-count'>
<div className='title'>
{this.props.title}
diff --git a/webapp/components/change_url_modal.jsx b/webapp/components/change_url_modal.jsx
index daba16827..73bcfdb95 100644
--- a/webapp/components/change_url_modal.jsx
+++ b/webapp/components/change_url_modal.jsx
@@ -2,7 +2,7 @@
// See License.txt for license information.
import ReactDOM from 'react-dom';
-import {Modal} from 'react-bootstrap';
+import {Modal, Tooltip, OverlayTrigger} from 'react-bootstrap';
import * as Utils from 'utils/utils.jsx';
import {FormattedMessage} from 'react-intl';
@@ -131,6 +131,9 @@ export default class ChangeUrlModal extends React.Component {
const fullTeamUrl = Utils.getTeamURLFromAddressBar();
const teamURL = Utils.getShortenedTeamURL();
+ const urlTooltip = (
+ <Tooltip id='urlTooltip'>{fullTeamUrl}</Tooltip>
+ );
return (
<Modal
@@ -150,13 +153,12 @@ export default class ChangeUrlModal extends React.Component {
<label className='col-sm-2 form__label control-label'>{this.props.urlLabel}</label>
<div className='col-sm-10'>
<div className={urlClass}>
- <span
- data-toggle='tooltip'
- title={fullTeamUrl}
- className='input-group-addon'
+ <OverlayTrigger
+ placement='top'
+ overlay={urlTooltip}
>
- {teamURL}
- </span>
+ <span className='input-group-addon'>{teamURL}</span>
+ </OverlayTrigger>
<input
type='text'
ref='urlinput'
diff --git a/webapp/components/form_error.jsx b/webapp/components/form_error.jsx
index b7d1de16a..395adfaab 100644
--- a/webapp/components/form_error.jsx
+++ b/webapp/components/form_error.jsx
@@ -8,6 +8,7 @@ export default class FormError extends React.Component {
// accepts either a single error or an array of errors
return {
error: React.PropTypes.node,
+ noMargin: React.PropTypes.node,
errors: React.PropTypes.arrayOf(React.PropTypes.node)
};
}
@@ -26,6 +27,7 @@ export default class FormError extends React.Component {
// look for the first truthy error to display
let message = this.props.error;
+ const noMargin = this.props.noMargin;
if (!message) {
for (const error of this.props.errors) {
@@ -39,6 +41,16 @@ export default class FormError extends React.Component {
return null;
}
+ if (noMargin) {
+ return (
+ <div className='has-error'>
+ <label className='control-label'>
+ {message}
+ </label>
+ </div>
+ );
+ }
+
return (
<div className='form-group has-error'>
<label className='control-label'>
diff --git a/webapp/components/tutorial/tutorial_intro_screens.jsx b/webapp/components/tutorial/tutorial_intro_screens.jsx
index 277ff967f..af1ac4760 100644
--- a/webapp/components/tutorial/tutorial_intro_screens.jsx
+++ b/webapp/components/tutorial/tutorial_intro_screens.jsx
@@ -4,7 +4,6 @@
import UserStore from 'stores/user_store.jsx';
import TeamStore from 'stores/team_store.jsx';
import PreferenceStore from 'stores/preference_store.jsx';
-import * as Utils from 'utils/utils.jsx';
import * as AsyncClient from 'utils/async_client.jsx';
import * as GlobalActions from 'actions/global_actions.jsx';
@@ -218,40 +217,34 @@ export default class TutorialIntroScreens extends React.Component {
);
}
render() {
- const height = Utils.windowHeight() - 100;
const screen = this.createScreen();
return (
- <div
- className='tutorials__scroll'
- style={{height}}
- >
- <div className='tutorial-steps__container'>
- <div className='tutorial__content'>
- <div className='tutorial__steps'>
- {screen}
- <div className='tutorial__footer'>
- <button
- className='btn btn-primary'
- tabIndex='1'
- onClick={this.handleNext}
- >
- <FormattedMessage
- id='tutorial_intro.next'
- defaultMessage='Next'
- />
- </button>
- <a
- className='tutorial-skip'
- href='#'
- onClick={this.skipTutorial}
- >
- <FormattedMessage
- id='tutorial_intro.skip'
- defaultMessage='Skip tutorial'
- />
- </a>
- </div>
+ <div className='tutorial-steps__container'>
+ <div className='tutorial__content'>
+ <div className='tutorial__steps'>
+ {screen}
+ <div className='tutorial__footer'>
+ <button
+ className='btn btn-primary'
+ tabIndex='1'
+ onClick={this.handleNext}
+ >
+ <FormattedMessage
+ id='tutorial_intro.next'
+ defaultMessage='Next'
+ />
+ </button>
+ <a
+ className='tutorial-skip'
+ href='#'
+ onClick={this.skipTutorial}
+ >
+ <FormattedMessage
+ id='tutorial_intro.skip'
+ defaultMessage='Skip tutorial'
+ />
+ </a>
</div>
</div>
</div>
diff --git a/webapp/components/user_settings/user_settings_notifications.jsx b/webapp/components/user_settings/user_settings_notifications.jsx
index 1b5e78eb2..26d960d46 100644
--- a/webapp/components/user_settings/user_settings_notifications.jsx
+++ b/webapp/components/user_settings/user_settings_notifications.jsx
@@ -320,7 +320,7 @@ class NotificationsTab extends React.Component {
inputs.push(
<div
key='oauthEmailInfo'
- className='form-group'
+ className='padding-top'
>
<FormattedMessage
id='user.settings.push_notification.disabled_long'
diff --git a/webapp/sass/components/_tutorial.scss b/webapp/sass/components/_tutorial.scss
index e735ba3f3..e4aff1785 100644
--- a/webapp/sass/components/_tutorial.scss
+++ b/webapp/sass/components/_tutorial.scss
@@ -66,11 +66,11 @@
margin-top: -10px;
.arrow {
- border-top-width: 0;
border-bottom-color: $white;
- top: -10px;
+ border-top-width: 0;
left: 50%;
margin-left: -10px;
+ top: -10px;
}
}
@@ -168,12 +168,15 @@
.tutorial-steps__container {
display: table;
height: 100%;
+ left: 0;
+ position: absolute;
text-align: center;
+ top: 0;
width: 100%;
.tutorial__content {
display: table-cell;
- padding: 20px 40px 40px;
+ padding: 20px 40px 80px;
vertical-align: middle;
.tutorial__steps {
diff --git a/webapp/sass/layout/_post.scss b/webapp/sass/layout/_post.scss
index a3c354f89..baca9a127 100644
--- a/webapp/sass/layout/_post.scss
+++ b/webapp/sass/layout/_post.scss
@@ -534,9 +534,8 @@ body.ios {
ol,
ul {
- display: inline-block;
- margin-top: 1px;
- padding-left: 30px;
+ clear: both;
+ padding-left: 20px;
}
}
@@ -911,14 +910,18 @@ body.ios {
ul,
ol {
margin-bottom: .4em;
+ padding-left: 20px;
p {
margin-bottom: 0;
}
- li ul,
- li ol {
- padding: 10px 0 0 20px;
+ li {
+ ul,
+ ol {
+ margin: 0;
+ padding: 0 0 0 20px;
+ }
}
li.list-item--task-list ul,
@@ -991,7 +994,7 @@ body.ios {
margin: 0 0 10px;
text-rendering: auto;
- &.pull-left{
+ &.pull-left {
margin: 5px 5px 0 0;
}
diff --git a/webapp/sass/routes/_admin-console.scss b/webapp/sass/routes/_admin-console.scss
index 676264ab2..2a10fc486 100644
--- a/webapp/sass/routes/_admin-console.scss
+++ b/webapp/sass/routes/_admin-console.scss
@@ -82,6 +82,12 @@
text-align: left;
}
+ .has-error {
+ .control-label {
+ font-weight: normal;
+ }
+ }
+
.form-group {
margin-bottom: 25px;
}
@@ -321,7 +327,6 @@
.sidebar-section-title,
.sidebar-subsection-title {
- @include clearfix;
color: alpha-color($white, .5);
display: block;
font-size: 13px;
diff --git a/webapp/sass/routes/_backstage.scss b/webapp/sass/routes/_backstage.scss
index f9754f16d..244aad043 100644
--- a/webapp/sass/routes/_backstage.scss
+++ b/webapp/sass/routes/_backstage.scss
@@ -303,14 +303,14 @@ body {
border: 1px solid $light-gray;
display: inline-block;
height: 210px;
- margin: 0 0 20px 30px;
+ margin: 0 30px 30px 0;
padding: 20px;
text-align: center;
vertical-align: top;
width: 250px;
- &:first-child {
- margin-left: 0;
+ &:last-child {
+ margin-right: 0;
}
&:hover {
diff --git a/webapp/sass/routes/_settings.scss b/webapp/sass/routes/_settings.scss
index 376cf611e..5b8c36c5c 100644
--- a/webapp/sass/routes/_settings.scss
+++ b/webapp/sass/routes/_settings.scss
@@ -269,6 +269,7 @@
display: none;
font-size: 12px;
margin-right: 5px;
+
&.fa-chevron-down {
margin-right: 0;
position: relative;
@@ -290,6 +291,14 @@
.divider-light {
border-bottom: 1px solid lightgrey;
+
+ & + .divider-light {
+ display: none;
+ }
+
+ & + .divider-dark {
+ display: none;
+ }
}
.setting-list {
diff --git a/webapp/utils/utils.jsx b/webapp/utils/utils.jsx
index d2fd2efbf..003f6025d 100644
--- a/webapp/utils/utils.jsx
+++ b/webapp/utils/utils.jsx
@@ -607,7 +607,7 @@ export function applyTheme(theme) {
if (theme.centerChannelColor) {
changeCss('.app__body .post-list__arrows', 'fill:' + changeOpacity(theme.centerChannelColor, 0.3), 1);
changeCss('.app__body .sidebar--left, .app__body .sidebar--right .sidebar--right__header, .app__body .suggestion-list__content .command', 'border-color:' + changeOpacity(theme.centerChannelColor, 0.2), 1);
- changeCss('.app__body .app__content, .app__body .post-create__container .post-create-body .btn-file, .app__body .post-create__container .post-create-footer .msg-typing, .app__body .suggestion-list__content .command, .app__body .modal .modal-content, .app__body .dropdown-menu, .app__body .popover, .app__body .mentions__name, .app__body .tip-overlay', 'color:' + theme.centerChannelColor, 1);
+ changeCss('.app__body .input-group-addon, .app__body .app__content, .app__body .post-create__container .post-create-body .btn-file, .app__body .post-create__container .post-create-footer .msg-typing, .app__body .suggestion-list__content .command, .app__body .modal .modal-content, .app__body .dropdown-menu, .app__body .popover, .app__body .mentions__name, .app__body .tip-overlay', 'color:' + theme.centerChannelColor, 1);
changeCss('.app__body .post .post__link', 'color:' + changeOpacity(theme.centerChannelColor, 0.65), 1);
changeCss('.app__body #archive-link-home, .video-div .video-thumbnail__error', 'background:' + changeOpacity(theme.centerChannelColor, 0.15), 1);
changeCss('.app__body #post-create', 'color:' + theme.centerChannelColor, 2);
@@ -638,7 +638,7 @@ export function applyTheme(theme) {
changeCss('.app__body .input-group-addon, .app__body .search-bar__container .search__form, .app__body .form-control', 'border-color:' + changeOpacity(theme.centerChannelColor, 0.2), 1);
changeCss('.app__body .form-control:focus', 'border-color:' + changeOpacity(theme.centerChannelColor, 0.3), 1);
changeCss('.app__body .attachment .attachment__content', 'border-color:' + changeOpacity(theme.centerChannelColor, 0.3), 1);
- changeCss('.app__body .channel-intro .channel-intro__content, .app__body .webhooks__container', 'background:' + changeOpacity(theme.centerChannelColor, 0.05), 1);
+ changeCss('.app__body .input-group-addon, .app__body .channel-intro .channel-intro__content, .app__body .webhooks__container', 'background:' + changeOpacity(theme.centerChannelColor, 0.05), 1);
changeCss('.app__body .date-separator .separator__text', 'color:' + theme.centerChannelColor, 2);
changeCss('.app__body .date-separator .separator__hr, .app__body .modal-footer, .app__body .modal .custom-textarea', 'border-color:' + changeOpacity(theme.centerChannelColor, 0.2), 1);
changeCss('.app__body .search-item-container, .app__body .post-right__container .post.post--root', 'border-color:' + changeOpacity(theme.centerChannelColor, 0.1), 1);