mirrors/mostlymatter
1
0
Форкнуть 0
Код Задачи Запросы на слияние Действия Пакеты Проекты Релизы Вики Активность

PLT-963 - Improving scss structure

Просмотр исходного кода
Этот коммит содержится в:
Asaad Mahmood
2016-03-14 22:35:57 +05:00
родитель bf7ae07117
Коммит e214aae719
113 изменённых файлов: 5493 добавлений и 5018 удалений
Скачать Patch файл Скачать Diff файл Показать все файлы Свернуть все файлы

7
web/react/components/admin_console/admin_controller.jsx
Просмотреть файл

@@ -172,7 +172,10 @@ export default class AdminController extends React.Component {
}
return (
<div id='admin_controller'>
<div
id='admin_controller'
className='admin-controller'
>
<div
className='sidebar--menu'
id='sidebar-menu'
@@ -186,7 +189,7 @@ export default class AdminController extends React.Component {
removeSelectedTeam={this.removeSelectedTeam}
addSelectedTeam={this.addSelectedTeam}
/>
<div className='inner__wrap channel__wrap'>
<div className='inner-wrap channel__wrap'>
<div className='row header'>
</div>
<div className='row main'>

2
web/react/components/admin_console/team_users.jsx
Просмотреть файл

@@ -163,7 +163,7 @@ export default class UserList extends React.Component {
className='form-horizontal'
role='form'
>
<table className='table more-table member-list-holder'>
<table className='more-modal__list member-list-holder'>
<tbody>
{memberList}
</tbody>

8
web/react/components/admin_console/user_item.jsx
Просмотреть файл

@@ -363,15 +363,15 @@ export default class UserItem extends React.Component {
return (
<tr>
<td className='row member-div padding--equal'>
<td className='more-modal__row'>
<img
className='post-profile-img pull-left'
className='more-modal__image pull-left'
src={`/api/v1/users/${user.id}/image?time=${user.update_at}`}
height='36'
width='36'
/>
<span className='more-name'>{Utils.getDisplayName(user)}</span>
<span className='more-description'>{email}</span>
<span className='more-modal__name'>{Utils.getDisplayName(user)}</span>
<span className='more-modal__description'>{email}</span>
<div className='dropdown member-drop'>
<a
href='#'

2
web/react/components/authorize.jsx
Просмотреть файл

@@ -38,7 +38,7 @@ export default class Authorize extends React.Component {
render() {
return (
<div className='container-fluid'>
<div className='oauth-prompt'>
<div className='prompt'>
<div className='prompt__heading'>
<div className='prompt__app-icon'>
<img

2
web/react/components/center_panel.jsx
Просмотреть файл

@@ -103,7 +103,7 @@ export default class CenterPanel extends React.Component {
}
return (
<div className='inner__wrap channel__wrap'>
<div className='inner-wrap channel__wrap'>
<div className='row header'>
<div id='navbar'>
<Navbar/>

6
web/react/components/file_attachment.jsx
Просмотреть файл

@@ -49,8 +49,8 @@ class FileAttachment extends React.Component {
if (name in self.refs) {
var imgDiv = ReactDOM.findDOMNode(self.refs[name]);
$(imgDiv).removeClass('post__load');
$(imgDiv).addClass('post__image');
$(imgDiv).removeClass('post-image__load');
$(imgDiv).addClass('post-image');
var width = this.width || $(this).width();
var height = this.height || $(this).height();
@@ -134,7 +134,7 @@ class FileAttachment extends React.Component {
thumbnail = (
<div
ref={filename}
className='post__load'
className='post-image__load'
style={{backgroundImage: 'url(/static/images/load.gif)'}}
/>
);

16
web/react/components/file_preview.jsx
Просмотреть файл

@@ -41,15 +41,15 @@ export default class FilePreview extends React.Component {
previews.push(
<div
key={filename}
className='preview-div'
className='file-preview'
data-filename={originalFilename}
>
<img
className='preview-img'
className='file-preview__image'
src={filename}
/>
<a
className='remove-preview'
className='file-preview__remove'
onClick={this.handleRemove}
>
<i className='glyphicon glyphicon-remove'/>
@@ -60,12 +60,12 @@ export default class FilePreview extends React.Component {
previews.push(
<div
key={filename}
className='preview-div custom-file'
className='file-preview custom-file'
data-filename={originalFilename}
>
<div className={'file-icon ' + Utils.getIconClassName(type)}/>
<a
className='remove-preview'
className='file-preview__remove'
onClick={this.handleRemove}
>
<i className='glyphicon glyphicon-remove'/>
@@ -80,7 +80,7 @@ export default class FilePreview extends React.Component {
<div
ref={clientId}
key={clientId}
className='preview-div'
className='file-preview'
data-client-id={clientId}
>
<img
@@ -88,7 +88,7 @@ export default class FilePreview extends React.Component {
src='/static/images/load.gif'
/>
<a
className='remove-preview'
className='file-preview__remove'
onClick={this.handleRemove}
>
<i className='glyphicon glyphicon-remove'/>
@@ -98,7 +98,7 @@ export default class FilePreview extends React.Component {
});
return (
<div className='preview-container'>
<div className='file-preview__container'>
{previews}
</div>
);

6
web/react/components/filtered_user_list.jsx
Просмотреть файл

@@ -27,10 +27,6 @@ class FilteredUserList extends React.Component {
};
}
componentDidMount() {
$(ReactDOM.findDOMNode(this.refs.userList)).perfectScrollbar();
}
componentDidUpdate(prevProps, prevState) {
if (prevState.filter !== this.state.filter) {
$(ReactDOM.findDOMNode(this.refs.userList)).scrollTop(0);
@@ -109,7 +105,7 @@ class FilteredUserList extends React.Component {
</div>
<div
ref='userList'
className='user-list'
className='more-modal__list'
>
<UserList
users={users}

2
web/react/components/get_link_modal.jsx
Просмотреть файл

@@ -81,7 +81,7 @@ export default class GetLinkModal extends React.Component {
var copyLinkConfirm = null;
if (this.state.copiedLink) {
copyLinkConfirm = (
<p className='alert alert-success copy-link-confirm'>
<p className='alert alert-success alert--confirm'>
<i className='fa fa-check'></i>
<FormattedMessage
id='get_link.clipboard'

31
web/react/components/more_channels.jsx
Просмотреть файл

@@ -95,17 +95,18 @@ export default class MoreChannels extends React.Component {
}
return (
<tr key={channel.id}>
<td className='more-row'>
<div className='more-details'>
<p className='more-name'>{channel.display_name}</p>
<p className='more-description'>{channel.purpose}</p>
</div>
<div className='more-actions'>
{joinButton}
</div>
</td>
</tr>
<div
className='more-modal__row'
key={channel.id}
>
<div className='more-modal__details'>
<p className='more-modal__name'>{channel.display_name}</p>
<p className='more-modal__description'>{channel.purpose}</p>
</div>
<div className='more-modal__actions'>
{joinButton}
</div>
</div>
);
}
render() {
@@ -127,11 +128,9 @@ export default class MoreChannels extends React.Component {
moreChannels = <LoadingScreen/>;
} else if (channels.length) {
moreChannels = (
<table className='more-table table'>
<tbody>
{channels.map(this.createChannelRow)}
</tbody>
</table>
<div className='more-modal__list'>
{channels.map(this.createChannelRow)}
</div>
);
} else {
moreChannels = (

8
web/react/components/navbar.jsx
Просмотреть файл

@@ -66,7 +66,7 @@ export default class Navbar extends React.Component {
componentDidMount() {
ChannelStore.addChangeListener(this.onChange);
ChannelStore.addExtraInfoChangeListener(this.onChange);
$('.inner__wrap').click(this.hideSidebars);
$('.inner-wrap').click(this.hideSidebars);
attachFastClick(document.body);
}
componentWillUnmount() {
@@ -101,7 +101,7 @@ export default class Navbar extends React.Component {
});
if (e.target.className !== 'navbar-toggle' && e.target.className !== 'icon-bar') {
$('.inner__wrap').removeClass('move--right move--left move--left-small');
$('.inner-wrap').removeClass('move--right move--left move--left-small');
$('.sidebar--left').removeClass('move--right');
$('.sidebar--right').removeClass('move--left');
$('.sidebar--menu').removeClass('move--left');
@@ -109,11 +109,11 @@ export default class Navbar extends React.Component {
}
}
toggleLeftSidebar() {
$('.inner__wrap').toggleClass('move--right');
$('.inner-wrap').toggleClass('move--right');
$('.sidebar--left').toggleClass('move--right');
}
toggleRightSidebar() {
$('.inner__wrap').toggleClass('move--left-small');
$('.inner-wrap').toggleClass('move--left-small');
$('.sidebar--menu').toggleClass('move--left');
}
showSearch() {

4
web/react/components/not_logged_in.jsx
Просмотреть файл

@@ -5,7 +5,7 @@ import {FormattedMessage} from 'mm-intl';
export default class NotLoggedIn extends React.Component {
componentDidMount() {
$('body').attr('class', 'white');
$('body').attr('class', 'sticky');
$('#root').attr('class', 'container-fluid');
}
componentWillUnmount() {
@@ -14,7 +14,7 @@ export default class NotLoggedIn extends React.Component {
}
render() {
return (
<div className='inner__wrap'>
<div className='inner-wrap'>
<div className='row content'>
{this.props.children}
<div className='footer-push'></div>

12
web/react/components/popover_list_members.jsx
Просмотреть файл

@@ -110,25 +110,25 @@ export default class PopoverListMembers extends React.Component {
if (name) {
popoverHtml.push(
<div
className='text-nowrap'
className='more-modal__row'
key={'popover-member-' + i}
>
<img
className='profile-img rounded pull-left'
className='more-modal__image'
width='26px'
height='26px'
src={`/api/v1/users/${m.id}/image?time=${m.update_at}`}
/>
<div className='pull-left'>
<div className='more-modal__details'>
<div
className='more-name'
className='more-modal__name'
>
{name}
</div>
</div>
<div
className='pull-right'
className='more-modal__actions'
>
{button}
</div>
@@ -185,7 +185,7 @@ export default class PopoverListMembers extends React.Component {
title={title}
id='member-list-popover'
>
{popoverHtml}
<div className='more-modal__list'>{popoverHtml}</div>
</Popover>
</Overlay>
</div>

2
web/react/components/search_bar.jsx
Просмотреть файл

@@ -164,7 +164,7 @@ class SearchBar extends React.Component {
</span>
<form
role='form'
className='search__form relative-div'
className='search__form'
onSubmit={this.handleSubmit}
style={{overflow: 'visible'}}
autoComplete='off'

2
web/react/components/search_results_item.jsx
Просмотреть файл

@@ -25,7 +25,7 @@ export default class SearchResultsItem extends React.Component {
if ($(window).width() < 768) {
$('.sidebar--right').removeClass('move--left');
$('.inner__wrap').removeClass('move--left');
$('.inner-wrap').removeClass('move--left');
}
}

14
web/react/components/sidebar_right.jsx
Просмотреть файл

@@ -55,27 +55,27 @@ export default class SidebarRight extends React.Component {
var windowWidth = $(window).outerWidth();
var sidebarRightWidth = $('.sidebar--right').outerWidth();
$('.inner__wrap').removeClass('.move--right');
$('.inner__wrap').addClass('move--left');
$('.inner-wrap').removeClass('.move--right');
$('.inner-wrap').addClass('move--left');
$('.sidebar--left').removeClass('move--right');
$('.sidebar--right').addClass('move--left');
//$('.sidebar--right').prepend('<div class="sidebar__overlay"></div>');
if (this.state.search_visible || this.state.post_right_visible) {
if (windowWidth > 960) {
$('.inner__wrap').velocity({marginRight: sidebarRightWidth}, {duration: 500, easing: 'easeOutSine'});
$('.inner-wrap').velocity({marginRight: sidebarRightWidth}, {duration: 500, easing: 'easeOutSine'});
$('.sidebar--right').velocity({translateX: 0}, {duration: 500, easing: 'easeOutSine'});
} else {
$('.inner__wrap, .sidebar--right').attr('style', '');
$('.inner-wrap, .sidebar--right').attr('style', '');
}
} else {
if (windowWidth > 960) {
$('.inner__wrap').velocity({marginRight: 0}, {duration: 500, easing: 'easeOutSine'});
$('.inner-wrap').velocity({marginRight: 0}, {duration: 500, easing: 'easeOutSine'});
$('.sidebar--right').velocity({translateX: sidebarRightWidth}, {duration: 500, easing: 'easeOutSine'});
} else {
$('.inner__wrap, .sidebar--right').attr('style', '');
$('.inner-wrap, .sidebar--right').attr('style', '');
}
$('.inner__wrap').removeClass('move--left').removeClass('move--right');
$('.inner-wrap').removeClass('move--left').removeClass('move--right');
$('.sidebar--right').removeClass('move--left');
return (
<div></div>

12
web/react/components/suggestion/at_mention_provider.jsx
Просмотреть файл

@@ -24,7 +24,7 @@ class AtMentionSuggestion extends React.Component {
defaultMessage='Notifies everyone in the team'
/>
);
icon = <i className='mention-img fa fa-users fa-2x'/>;
icon = <i className='mention__image fa fa-users fa-2x'/>;
} else if (item.username === 'channel') {
username = 'channel';
description = (
@@ -33,19 +33,19 @@ class AtMentionSuggestion extends React.Component {
defaultMessage='Notifies everyone in the channel'
/>
);
icon = <i className='mention-img fa fa-users fa-2x'/>;
icon = <i className='mention__image fa fa-users fa-2x'/>;
} else {
username = item.username;
description = Utils.getFullName(item);
icon = (
<img
className='mention-img'
className='mention__image'
src={'/api/v1/users/' + item.id + '/image?time=' + item.update_at}
/>
);
}
let className = 'mentions-name';
let className = 'mentions__name';
if (isSelection) {
className += ' suggestion--selected';
}
@@ -58,11 +58,11 @@ class AtMentionSuggestion extends React.Component {
<div className='pull-left'>
{icon}
</div>
<div className='pull-left mention-align'>
<div className='pull-left mention--align'>
<span>
{'@' + username}
</span>
<span className='mention-fullname'>
<span className='mention__fullname'>
{description}
</span>
</div>

2
web/react/components/suggestion/command_provider.jsx
Просмотреть файл

@@ -7,7 +7,7 @@ class CommandSuggestion extends React.Component {
render() {
const {item, isSelection, onClick} = this.props;
let className = 'command-name';
let className = 'command';
if (isSelection) {
className += ' suggestion--selected';
}

2
web/react/components/suggestion/suggestion_list.jsx
Просмотреть файл

@@ -111,7 +111,7 @@ export default class SuggestionList extends React.Component {
<div className='suggestion-list suggestion-list--top'>
<div
ref='content'
className='suggestion-content suggestion-content--top'
className='suggestion-list__content suggestion-list__content--top'
>
{items}
</div>

22
web/react/components/user_list.jsx
Просмотреть файл

@@ -21,23 +21,19 @@ export default class UserList extends React.Component {
});
} else {
content = (
<tr key='no-users-found'>
<td>
<FormattedMessage
id='user_list.notFound'
defaultMessage='No users found :('
/>
</td>
</tr>
<div key='no-users-found'>
<FormattedMessage
id='user_list.notFound'
defaultMessage='No users found :('
/>
</div>
);
}
return (
<table className='more-table table'>
<tbody>
{content}
</tbody>
</table>
<div>
{content}
</div>
);
}
}

46
web/react/components/user_list_row.jsx
Просмотреть файл

@@ -25,32 +25,32 @@ export default function UserListRow({user, actions}) {
});
return (
<tr>
<td
key={user.id}
style={{display: 'flex'}}
<div
key={user.id}
className='more-modal__row'
>
<img
className='more-modal__image'
width='38'
height='38'
src={`/api/v1/users/${user.id}/image?time=${user.update_at}`}
/>
<div
className='more-modal__details'
>
<img
className='profile-img'
src={`/api/v1/users/${user.id}/image?time=${user.update_at}`}
/>
<div
className='user-list-item__details'
>
<div className='more-name'>
{name}
</div>
<div className='more-description'>
{user.email}
</div>
<div className='more-modal__name'>
{name}
</div>
<div
className='user-list-item__actions'
>
{buttons}
<div className='more-modal__description'>
{user.email}
</div>
</td>
</tr>
</div>
<div
className='more-modal__actions'
>
{buttons}
</div>
</div>
);
}