summaryrefslogtreecommitdiffstats
diff options
context:
space:
mode:
-rw-r--r--webapp/components/channel_members_modal.jsx2
-rw-r--r--webapp/components/more_channels.jsx2
-rw-r--r--webapp/components/more_direct_channels.jsx4
-rw-r--r--webapp/components/profile_popover.jsx32
-rw-r--r--webapp/components/searchable_channel_list.jsx4
-rw-r--r--webapp/components/setting_item_max.jsx4
-rw-r--r--webapp/sass/base/_typography.scss5
-rw-r--r--webapp/sass/components/_modal.scss39
-rw-r--r--webapp/sass/responsive/_mobile.scss35
9 files changed, 58 insertions, 69 deletions
diff --git a/webapp/components/channel_members_modal.jsx b/webapp/components/channel_members_modal.jsx
index 9f6a2a2eb..70547d409 100644
--- a/webapp/components/channel_members_modal.jsx
+++ b/webapp/components/channel_members_modal.jsx
@@ -168,7 +168,7 @@ export default class ChannelMembersModal extends React.Component {
return (
<div>
<Modal
- dialogClassName='more-modal'
+ dialogClassName='more-modal more-modal--action'
show={this.state.show}
onHide={this.onHide}
onExited={this.props.onModalDismissed}
diff --git a/webapp/components/more_channels.jsx b/webapp/components/more_channels.jsx
index b9b841ad8..b0064f18a 100644
--- a/webapp/components/more_channels.jsx
+++ b/webapp/components/more_channels.jsx
@@ -163,7 +163,7 @@ export default class MoreChannels extends React.Component {
return (
<Modal
- dialogClassName='more-modal more-public-channels'
+ dialogClassName='more-modal more-modal--action'
show={this.state.show}
onHide={this.handleHide}
onExited={this.handleExit}
diff --git a/webapp/components/more_direct_channels.jsx b/webapp/components/more_direct_channels.jsx
index 1b287b3b2..a3318d0c8 100644
--- a/webapp/components/more_direct_channels.jsx
+++ b/webapp/components/more_direct_channels.jsx
@@ -195,7 +195,9 @@ export default class MoreDirectChannels extends React.Component {
render() {
let teamToggle;
+ let memberClass = '';
if (global.window.mm_config.RestrictDirectMessage === 'any') {
+ memberClass = 'more-system-members';
teamToggle = (
<div className='member-select__container'>
<select
@@ -226,7 +228,7 @@ export default class MoreDirectChannels extends React.Component {
return (
<Modal
- dialogClassName='more-modal more-direct-channels'
+ dialogClassName={'more-modal more-direct-channels ' + memberClass}
show={this.state.show}
onHide={this.handleHide}
onExited={this.handleExit}
diff --git a/webapp/components/profile_popover.jsx b/webapp/components/profile_popover.jsx
index a342f312f..8b431b643 100644
--- a/webapp/components/profile_popover.jsx
+++ b/webapp/components/profile_popover.jsx
@@ -152,34 +152,34 @@ export default class ProfilePopover extends React.Component {
const fullname = Utils.getFullName(this.props.user);
if (fullname) {
dataContent.push(
- <div
- data-toggle='tooltip'
- title={fullname}
- key='user-popover-fullname'
+ <OverlayTrigger
+ delayShow={Constants.WEBRTC_TIME_DELAY}
+ placement='top'
+ overlay={<Tooltip id='fullNameTooltip'>{fullname}</Tooltip>}
>
- <p
- className='text-nowrap'
+ <div
+ className='overflow--ellipsis text-nowrap padding-bottom'
>
{fullname}
- </p>
- </div>
+ </div>
+ </OverlayTrigger>
);
}
if (this.props.user.position) {
const position = this.props.user.position.substring(0, Constants.MAX_POSITION_LENGTH);
dataContent.push(
- <div
- data-toggle='tooltip'
- title={position}
- key='user-popover-position'
+ <OverlayTrigger
+ delayShow={Constants.WEBRTC_TIME_DELAY}
+ placement='top'
+ overlay={<Tooltip id='positionTooltip'>{position}</Tooltip>}
>
- <p
- className='text-nowrap'
+ <div
+ className='overflow--ellipsis text-nowrap padding-bottom'
>
{position}
- </p>
- </div>
+ </div>
+ </OverlayTrigger>
);
}
diff --git a/webapp/components/searchable_channel_list.jsx b/webapp/components/searchable_channel_list.jsx
index afd113975..df1fb61f7 100644
--- a/webapp/components/searchable_channel_list.jsx
+++ b/webapp/components/searchable_channel_list.jsx
@@ -180,7 +180,9 @@ export default class SearchableChannelList extends React.Component {
ref='channelList'
className='more-modal__list'
>
- {listContent}
+ <div>
+ {listContent}
+ </div>
</div>
<div className='filter-controls'>
{previousButton}
diff --git a/webapp/components/setting_item_max.jsx b/webapp/components/setting_item_max.jsx
index 904e6c8d1..5971ce584 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'
+ className='btn btn-sm btn-primary pull-right'
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 theme'
+ className='btn btn-sm pull-right'
href='#'
onClick={this.props.updateSection}
>
diff --git a/webapp/sass/base/_typography.scss b/webapp/sass/base/_typography.scss
index f595e0ed9..1d3f1d052 100644
--- a/webapp/sass/base/_typography.scss
+++ b/webapp/sass/base/_typography.scss
@@ -26,6 +26,11 @@ body {
word-break: break-all;
}
+.overflow--ellipsis {
+ overflow: hidden;
+ text-overflow: ellipsis;
+}
+
.fa {
&.fa-margin--left {
margin-left: 2px;
diff --git a/webapp/sass/components/_modal.scss b/webapp/sass/components/_modal.scss
index 4012a4611..e23630c3b 100644
--- a/webapp/sass/components/_modal.scss
+++ b/webapp/sass/components/_modal.scss
@@ -464,24 +464,10 @@
float: right;
margin-top: 5px;
}
-
- .more-modal__list {
- max-height: calc(100vh - 270px);
- }
}
}
.more-modal {
- .more-modal__list {
- height: 100vh;
- max-height: calc(100vh - 340px);
- }
-
- &.more-direct-channels {
- .more-modal__list {
- max-height: calc(100vh - 325px);
- }
- }
.user-list {
margin-top: 10px;
@@ -496,7 +482,6 @@
}
.filter-row {
- @include clearfix;
margin: 5px 0 10px;
width: 300px;
}
@@ -561,7 +546,11 @@
.more-modal__list {
display: flex;
flex-direction: column;
- overflow: auto;
+
+ > div {
+ min-height: 100%;
+ overflow: auto;
+ }
.popover & {
font-size: .95em;
@@ -606,6 +595,7 @@
.more-modal__actions {
flex-grow: 0;
flex-shrink: 0;
+ margin: 5px 0 10px;
padding-left: 20px;
}
@@ -628,8 +618,7 @@
.more-modal__row {
border-bottom: 1px solid $light-gray;
display: flex;
- min-height: 70px;
- padding: 8px 15px;
+ padding: 10px 15px;
}
p {
@@ -650,16 +639,15 @@
.filtered-user-list {
display: flex;
flex-direction: column;
+ height: calc(90vh - 120px);
width: 100%;
- .filter-row {
- flex-grow: 0;
- flex-shrink: 0;
+ > div {
+ flex: 1;
}
- .user-list {
- flex-grow: 1;
- flex-shrink: 1;
+ .more-modal__list {
+ flex-grow: 500;
}
.filter-button {
@@ -669,9 +657,6 @@
}
.filter-controls {
- @include clearfix;
- flex-grow: 0;
- flex-shrink: 0;
padding: 1em 1.5em 0;
.filter-control__next {
diff --git a/webapp/sass/responsive/_mobile.scss b/webapp/sass/responsive/_mobile.scss
index 16f0d3851..39f2b1a35 100644
--- a/webapp/sass/responsive/_mobile.scss
+++ b/webapp/sass/responsive/_mobile.scss
@@ -1206,6 +1206,16 @@
}
@media screen and (max-width: 640px) {
+ .filtered-user-list {
+ height: calc(100vh - 80px);
+ }
+
+ .more-modal--action {
+ .filtered-user-list {
+ height: calc(100vh - 110px);
+ }
+ }
+
.app__body {
.modal {
.more-modal {
@@ -1213,10 +1223,6 @@
max-height: calc(100vh - 62px);
padding-bottom: 5px;
}
-
- .more-modal__list {
- max-height: calc(100vh - 230px);
- }
}
}
@@ -1377,15 +1383,14 @@
@media screen and (max-width: 550px) {
.app__body {
.more-modal {
- .filter-row {
- width: 100%;
- }
-
- &.more-direct-channels {
+ &.more-system-members {
.filter-row {
- padding-bottom: 50px;
+ min-height: 80px;
+ width: 100%;
}
+ }
+ &.more-direct-channels {
.member-show {
display: none;
}
@@ -1443,16 +1448,6 @@
.app__body {
.modal {
- &.more-channel__modal {
- .more-modal__list {
- max-height: calc(100vh - 250px);
- }
-
- .modal-body {
- padding-bottom: 35px;
- }
- }
-
.settings-modal {
&.display--content {
.modal-body {