diff options
-rw-r--r-- | webapp/components/select_team/components/select_team_item.jsx | 2 | ||||
-rw-r--r-- | webapp/components/setting_item_max.jsx | 4 | ||||
-rw-r--r-- | webapp/components/setting_item_min.jsx | 6 | ||||
-rw-r--r-- | webapp/components/setting_picture.jsx | 4 | ||||
-rw-r--r-- | webapp/components/user_settings/user_settings_general.jsx | 12 | ||||
-rw-r--r-- | webapp/components/user_settings/user_settings_security.jsx | 12 | ||||
-rw-r--r-- | webapp/sass/components/_mentions.scss | 7 | ||||
-rw-r--r-- | webapp/sass/components/_videos.scss | 146 | ||||
-rw-r--r-- | webapp/sass/layout/_headers.scss | 13 | ||||
-rw-r--r-- | webapp/sass/layout/_post.scss | 78 | ||||
-rw-r--r-- | webapp/sass/layout/_team-sidebar.scss | 2 | ||||
-rw-r--r-- | webapp/sass/responsive/_desktop.scss | 4 | ||||
-rw-r--r-- | webapp/sass/responsive/_mobile.scss | 15 | ||||
-rw-r--r-- | webapp/sass/responsive/_tablet.scss | 5 | ||||
-rw-r--r-- | webapp/utils/utils.jsx | 1 |
15 files changed, 169 insertions, 142 deletions
diff --git a/webapp/components/select_team/components/select_team_item.jsx b/webapp/components/select_team/components/select_team_item.jsx index 825afdd69..c6943722d 100644 --- a/webapp/components/select_team/components/select_team_item.jsx +++ b/webapp/components/select_team/components/select_team_item.jsx @@ -49,7 +49,7 @@ export default class SelectTeamItem extends React.Component { <OverlayTrigger trigger={['hover', 'focus', 'click']} delayShow={1000} - placement='left' + placement='top' overlay={descriptionTooltip} ref='descriptionOverlay' > diff --git a/webapp/components/setting_item_max.jsx b/webapp/components/setting_item_max.jsx index 5971ce584..5b6a5d53a 100644 --- a/webapp/components/setting_item_max.jsx +++ b/webapp/components/setting_item_max.jsx @@ -49,7 +49,7 @@ export default class SettingItemMax extends React.Component { submit = ( <input type='submit' - className='btn btn-sm btn-primary pull-right' + className='btn btn-sm btn-primary' href='#' onClick={this.props.submit} value={Utils.localizeMessage('setting_item_max.save', 'Save')} @@ -88,7 +88,7 @@ export default class SettingItemMax extends React.Component { {clientError} {submit} <a - className='btn btn-sm pull-right' + className='btn btn-sm' href='#' onClick={this.props.updateSection} > diff --git a/webapp/components/setting_item_min.jsx b/webapp/components/setting_item_min.jsx index edcc81693..96d8bf459 100644 --- a/webapp/components/setting_item_min.jsx +++ b/webapp/components/setting_item_min.jsx @@ -10,7 +10,7 @@ export default class SettingItemMin extends React.Component { let editButton = null; if (!this.props.disableOpen) { editButton = ( - <li className='col-sm-3 section-edit'> + <li className='col-xs-12 col-sm-3 section-edit'> <a className='theme' href='#' @@ -31,9 +31,9 @@ export default class SettingItemMin extends React.Component { className='section-min' onClick={this.props.updateSection} > - <li className='col-sm-9 section-title'>{this.props.title}</li> + <li className='col-xs-12 col-sm-9 section-title'>{this.props.title}</li> {editButton} - <li className='col-sm-12 section-describe'>{this.props.describe}</li> + <li className='col-xs-12 section-describe'>{this.props.describe}</li> </ul> ); } diff --git a/webapp/components/setting_picture.jsx b/webapp/components/setting_picture.jsx index d1ff60c6a..b74ee8eb7 100644 --- a/webapp/components/setting_picture.jsx +++ b/webapp/components/setting_picture.jsx @@ -73,7 +73,7 @@ export default class SettingPicture extends React.Component { /> ); } else { - var confirmButtonClass = 'btn btn-sm pull-right'; + var confirmButtonClass = 'btn btn-sm'; if (this.props.submitActive) { confirmButtonClass += ' btn-primary'; } else { @@ -132,7 +132,7 @@ export default class SettingPicture extends React.Component { </span> {confirmButton} <a - className='btn btn-sm theme pull-right' + className='btn btn-sm theme' href='#' onClick={self.props.updateSection} > diff --git a/webapp/components/user_settings/user_settings_general.jsx b/webapp/components/user_settings/user_settings_general.jsx index d9551dccc..7ac2069ff 100644 --- a/webapp/components/user_settings/user_settings_general.jsx +++ b/webapp/components/user_settings/user_settings_general.jsx @@ -355,7 +355,7 @@ class UserSettingsGeneralTab extends React.Component { if (!emailEnabled) { helpText = ( - <div className='setting-list__hint text-danger'> + <div className='setting-list__hint col-sm-12 text-danger'> <FormattedMessage id='user.settings.general.emailHelp2' defaultMessage='Email has been disabled by your System Administrator. No notification emails will be sent until it is enabled.' @@ -437,7 +437,7 @@ class UserSettingsGeneralTab extends React.Component { key='oauthEmailInfo' className='form-group' > - <div className='setting-list__hint'> + <div className='setting-list__hint col-sm-12'> <FormattedMessage id='user.settings.general.emailGitlabCantUpdate' defaultMessage='Login occurs through GitLab. Email cannot be updated. Email address used for notifications is {email}.' @@ -455,7 +455,7 @@ class UserSettingsGeneralTab extends React.Component { key='oauthEmailInfo' className='form-group' > - <div className='setting-list__hint'> + <div className='setting-list__hint col-sm-12'> <FormattedMessage id='user.settings.general.emailGoogleCantUpdate' defaultMessage='Login occurs through Google Apps. Email cannot be updated. Email address used for notifications is {email}.' @@ -473,7 +473,7 @@ class UserSettingsGeneralTab extends React.Component { key='oauthEmailInfo' className='form-group' > - <div className='setting-list__hint'> + <div className='setting-list__hint col-sm-12'> <FormattedMessage id='user.settings.general.emailOffice365CantUpdate' defaultMessage='Login occurs through Office 365. Email cannot be updated. Email address used for notifications is {email}.' @@ -491,7 +491,7 @@ class UserSettingsGeneralTab extends React.Component { key='oauthEmailInfo' className='padding-bottom' > - <div className='setting-list__hint'> + <div className='setting-list__hint col-sm-12'> <FormattedMessage id='user.settings.general.emailLdapCantUpdate' defaultMessage='Login occurs through AD/LDAP. Email cannot be updated. Email address used for notifications is {email}.' @@ -509,7 +509,7 @@ class UserSettingsGeneralTab extends React.Component { key='oauthEmailInfo' className='padding-bottom' > - <div className='setting-list__hint'> + <div className='setting-list__hint col-sm-12'> <FormattedMessage id='user.settings.general.emailSamlCantUpdate' defaultMessage='Login occurs through SAML. Email cannot be updated. Email address used for notifications is {email}.' diff --git a/webapp/components/user_settings/user_settings_security.jsx b/webapp/components/user_settings/user_settings_security.jsx index 210e455b7..3ea65a088 100644 --- a/webapp/components/user_settings/user_settings_security.jsx +++ b/webapp/components/user_settings/user_settings_security.jsx @@ -387,7 +387,7 @@ export default class SecurityTab extends React.Component { key='oauthEmailInfo' className='form-group' > - <div className='setting-list__hint'> + <div className='setting-list__hint col-sm-12'> <FormattedMessage id='user.settings.security.passwordGitlabCantUpdate' defaultMessage='Login occurs through GitLab. Password cannot be updated.' @@ -401,7 +401,7 @@ export default class SecurityTab extends React.Component { key='oauthEmailInfo' className='form-group' > - <div className='setting-list__hint'> + <div className='setting-list__hint col-sm-12'> <FormattedMessage id='user.settings.security.passwordLdapCantUpdate' defaultMessage='Login occurs through AD/LDAP. Password cannot be updated.' @@ -415,7 +415,7 @@ export default class SecurityTab extends React.Component { key='oauthEmailInfo' className='form-group' > - <div className='setting-list__hint'> + <div className='setting-list__hint col-sm-12'> <FormattedMessage id='user.settings.security.passwordSamlCantUpdate' defaultMessage='This field is handled through your login provider. If you want to change it, you need to do so through your login provider.' @@ -429,7 +429,7 @@ export default class SecurityTab extends React.Component { key='oauthEmailInfo' className='form-group' > - <div className='setting-list__hint'> + <div className='setting-list__hint col-sm-12'> <FormattedMessage id='user.settings.security.passwordGoogleCantUpdate' defaultMessage='Login occurs through Google Apps. Password cannot be updated.' @@ -443,7 +443,7 @@ export default class SecurityTab extends React.Component { key='oauthEmailInfo' className='form-group' > - <div className='setting-list__hint'> + <div className='setting-list__hint col-sm-12'> <FormattedMessage id='user.settings.security.passwordOffice365CantUpdate' defaultMessage='Login occurs through Office 365. Password cannot be updated.' @@ -834,7 +834,7 @@ export default class SecurityTab extends React.Component { apps = ( <div className='padding-bottom x2 authorized-app'> <div className='col-sm-12'> - <div className='setting-list__hint'> + <div className='setting-list__hint col-sm-12'> <FormattedMessage id='user.settings.security.noApps' defaultMessage='No OAuth 2.0 Applications are authorized.' diff --git a/webapp/sass/components/_mentions.scss b/webapp/sass/components/_mentions.scss index e1e35ea29..86e7c0a28 100644 --- a/webapp/sass/components/_mentions.scss +++ b/webapp/sass/components/_mentions.scss @@ -21,6 +21,13 @@ width: 100%; z-index: 101; + .status { + font-size: 15px; + text-align: center; + vertical-align: bottom; + width: 20px; + } + .fa-user { position: relative; top: -1px; diff --git a/webapp/sass/components/_videos.scss b/webapp/sass/components/_videos.scss index 93ad5707b..16e3468d1 100644 --- a/webapp/sass/components/_videos.scss +++ b/webapp/sass/components/_videos.scss @@ -1,93 +1,95 @@ @charset 'UTF-8'; -.video-div { - margin-bottom: 8px; - max-width: 480px; - position: relative; +.post { + .video-div { + margin-bottom: 8px; + max-width: 480px; + position: relative; - .video-thumbnail { - height: auto; - max-width: 100%; - } + .video-thumbnail { + height: auto; + max-width: 100%; + } + + .video-thumbnail__error { + height: 100%; + line-height: 2; + padding: 110px 0; + text-align: center; + width: 100%; - .video-thumbnail__error { - height: 100%; - line-height: 2; - padding: 110px 0; - text-align: center; - width: 100%; + .fa { + @include opacity(.5); + } - .fa { - @include opacity(.5); + div { + font-size: 1.2em; + } } - div { - font-size: 1.2em; + .block { + background-color: alpha-color($black, .5); + border-radius: 10px; + height: 150px; + left: 50%; + margin: -75px 0 0 -100px; + position: absolute; + top: 50%; + width: 200px; } } - .block { - background-color: alpha-color($black, .5); - border-radius: 10px; - height: 150px; - left: 50%; - margin: -75px 0 0 -100px; - position: absolute; - top: 50%; - width: 200px; + .video-type { + @include opacity(.8); + font-size: 15px; + margin: 0; + padding: 0; } -} - -.video-type { - @include opacity(.8); - font-size: 15px; - margin: 0; - padding: 0; -} - -.video-title { - font-size: 15px; - margin-top: 3px; -} -.play-button { - @include border-radius(14px); - border: 4px solid alpha-color($white, .4); - height: 100px; - position: absolute; - right: 51px; - top: 26px; - width: 100px; + .video-title { + font-size: 15px; + margin-top: 3px; + } - span { - border-bottom: 36px solid transparent; - border-left: 60px solid alpha-color($white, .4); - border-top: 36px solid transparent; - height: 0; - left: 20px; + .play-button { + @include border-radius(14px); + border: 4px solid alpha-color($white, .4); + height: 100px; position: absolute; - top: 10px; - width: 0; + right: 51px; + top: 26px; + width: 100px; + + span { + border-bottom: 36px solid transparent; + border-left: 60px solid alpha-color($white, .4); + border-top: 36px solid transparent; + height: 0; + left: 20px; + position: absolute; + top: 10px; + width: 0; + } } -} -.img-div { - -moz-force-broken-image-icon: 1; - border-radius: 5px; - margin-bottom: 8px; - max-height: 500px; - max-width: 450px; - position: relative; + .img-div { + -moz-force-broken-image-icon: 1; + border-radius: 5px; + margin-bottom: 8px; + max-height: 500px; + max-width: 450px; + position: relative; - &.placeholder { - height: 500px; + &.placeholder { + height: 500px; + } + + .sidebar--right & { + max-width: 100%; + } } - .sidebar--right & { - max-width: 100%; + .video-loading { + height: 360px; } } - -.video-loading { - height: 360px; -}
\ No newline at end of file diff --git a/webapp/sass/layout/_headers.scss b/webapp/sass/layout/_headers.scss index 710a8ad6a..ca5597bf9 100644 --- a/webapp/sass/layout/_headers.scss +++ b/webapp/sass/layout/_headers.scss @@ -275,8 +275,9 @@ .sidebar-header-dropdown, .admin-navbar-dropdown { font-size: .85em; - position: absolute; + left: 0; margin-right: -15px; + position: absolute; right: 22px; top: 10px; z-index: 5; @@ -287,16 +288,19 @@ @include single-transition(all, .1s, linear); background: none; color: $white; - float: right; + display: block; font-size: 1em; + height: 40px; + left: 0; line-height: 1.8; padding: 10px; + width: 100%; } .dropdown-menu { - width: 199px; - margin-top: 4px; margin-right: 3px; + margin-top: 4px; + width: 199px; a { overflow: hidden; @@ -308,6 +312,7 @@ .sidebar-header-dropdown__icon, .admin-navbar-dropdown__icon { fill: $white; + float: right; } } diff --git a/webapp/sass/layout/_post.scss b/webapp/sass/layout/_post.scss index 0428a20ae..0f72a7f26 100644 --- a/webapp/sass/layout/_post.scss +++ b/webapp/sass/layout/_post.scss @@ -311,7 +311,7 @@ &.scrolling { @include translateY(0); - @include opacity(.8); + @include opacity(.9); } &.rhs { @@ -322,6 +322,7 @@ @include border-radius(3px); @include font-smoothing(initial); background: $primary-color; + border: 1px solid; color: $white; display: inline-block; font-size: 12px; @@ -585,6 +586,7 @@ top: 2px; } } + .search-item-snippet { blockquote { margin-top: 0; @@ -1091,7 +1093,7 @@ } .pending-post-actions { - background: alpha-property($black, .7); + background: alpha-color($black, .7); color: $white; font-size: .9em; padding: 5px 7px; @@ -1111,6 +1113,42 @@ font-size: .87em; } } + + .post-reaction-list { + min-height: 30px; + } + + .post-reaction { + @include user-select(none); + @include border-radius(3px); + border: 1px solid $primary-color; + cursor: pointer; + display: inline-block; + font-size: 11px; + height: 23px; + margin-bottom: 5px; + margin-right: 5px; + padding: 0 4px 0 3px; + + .post-reaction__emoji { + height: 16px; + margin: 2px 3px 0 0; + vertical-align: top; + width: 16px; + } + + .post-reaction__count { + line-height: 10px; + position: relative; + top: 3px; + } + + &--current-user { + .post-reaction__count { + font-weight: 600; + } + } + } } .post__link { @@ -1299,39 +1337,3 @@ margin-left: 50px !important; min-width: 320px; } - -.post-reaction-list { - min-height: 30px; -} - -.post-reaction { - @include user-select(none); - @include border-radius(3px); - border: 1px solid $primary-color; - cursor: pointer; - display: inline-block; - font-size: 11px; - height: 23px; - padding: 0 4px 0 3px; - margin-right: 5px; - margin-bottom: 5px; - - .post-reaction__emoji { - height: 16px; - margin: 2px 3px 0 0; - vertical-align: top; - width: 16px; - } - - .post-reaction__count { - line-height: 10px; - position: relative; - top: 3px; - } - - &--current-user { - .post-reaction__count { - font-weight: 600; - } - } -} diff --git a/webapp/sass/layout/_team-sidebar.scss b/webapp/sass/layout/_team-sidebar.scss index 52f2dbd06..a600b8d44 100644 --- a/webapp/sass/layout/_team-sidebar.scss +++ b/webapp/sass/layout/_team-sidebar.scss @@ -21,6 +21,8 @@ width: 100%; a { + display: block; + margin-left: 11px; text-decoration: none; } diff --git a/webapp/sass/responsive/_desktop.scss b/webapp/sass/responsive/_desktop.scss index 68b47684e..891431f20 100644 --- a/webapp/sass/responsive/_desktop.scss +++ b/webapp/sass/responsive/_desktop.scss @@ -54,6 +54,10 @@ } } + .help__format-text { + display: none; + } + .inner-wrap { &.move--left, &.webrtc--show { diff --git a/webapp/sass/responsive/_mobile.scss b/webapp/sass/responsive/_mobile.scss index 5ade6046e..0914e2a18 100644 --- a/webapp/sass/responsive/_mobile.scss +++ b/webapp/sass/responsive/_mobile.scss @@ -608,6 +608,17 @@ display: block; .settings-content { + .section-title { + padding-right: 15px; + } + + .section-edit { + position: relative; + right: 0; + text-align: left; + top: 0; + } + .appearance-section { .theme-elements { .element { @@ -1080,16 +1091,14 @@ } .post-create-footer { - padding: 0 45px 0 45px; - .control-label { margin: .5em 0; top: 0; } .post-error { - top: 0; left: 0; + top: 0; } } } diff --git a/webapp/sass/responsive/_tablet.scss b/webapp/sass/responsive/_tablet.scss index ac8b50961..a8fb2bbe7 100644 --- a/webapp/sass/responsive/_tablet.scss +++ b/webapp/sass/responsive/_tablet.scss @@ -33,7 +33,6 @@ } .post-error { - left: 32px; position: relative; top: 0; @@ -117,10 +116,6 @@ width: 100%; } - .help__format-text { - display: none; - } - .inner-wrap { &:not(.move--left) { margin-right: 0 !important; diff --git a/webapp/utils/utils.jsx b/webapp/utils/utils.jsx index b70c98b11..815e78e53 100644 --- a/webapp/utils/utils.jsx +++ b/webapp/utils/utils.jsx @@ -526,6 +526,7 @@ export function applyTheme(theme) { changeCss('.app__body .modal .modal-header .modal-title, .app__body .modal .modal-header .modal-title .name, .app__body .modal .modal-header button.close', 'color:' + theme.sidebarHeaderTextColor); changeCss('.app__body #navbar .navbar-default .navbar-brand .heading', 'color:' + theme.sidebarHeaderTextColor); changeCss('.app__body #navbar .navbar-default .navbar-toggle .icon-bar', 'background:' + theme.sidebarHeaderTextColor); + changeCss('.app__body .post-list__timestamp > div', 'border-color:' + changeOpacity(theme.sidebarHeaderTextColor, 0.5)); changeCss('@media(max-width: 768px){.app__body .search-bar__container', 'color:' + theme.sidebarHeaderTextColor); } |