Multiple UI Improvements
Этот коммит содержится в:
@@ -227,7 +227,6 @@ export default class UserItem extends React.Component {
|
|||||||
href='#'
|
href='#'
|
||||||
className='dropdown-toggle theme'
|
className='dropdown-toggle theme'
|
||||||
type='button'
|
type='button'
|
||||||
id='channel_header_dropdown'
|
|
||||||
data-toggle='dropdown'
|
data-toggle='dropdown'
|
||||||
aria-expanded='true'
|
aria-expanded='true'
|
||||||
>
|
>
|
||||||
@@ -237,7 +236,6 @@ export default class UserItem extends React.Component {
|
|||||||
<ul
|
<ul
|
||||||
className='dropdown-menu member-menu'
|
className='dropdown-menu member-menu'
|
||||||
role='menu'
|
role='menu'
|
||||||
aria-labelledby='channel_header_dropdown'
|
|
||||||
>
|
>
|
||||||
{makeAdmin}
|
{makeAdmin}
|
||||||
{makeMember}
|
{makeMember}
|
||||||
|
|||||||
@@ -362,11 +362,11 @@ export default class CreateComment extends React.Component {
|
|||||||
onClick={this.handleSubmit}
|
onClick={this.handleSubmit}
|
||||||
/>
|
/>
|
||||||
{uploadsInProgressText}
|
{uploadsInProgressText}
|
||||||
|
{preview}
|
||||||
{postError}
|
{postError}
|
||||||
{serverError}
|
{serverError}
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
{preview}
|
|
||||||
</form>
|
</form>
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -470,13 +470,13 @@ export default class CreatePost extends React.Component {
|
|||||||
{tutorialTip}
|
{tutorialTip}
|
||||||
</div>
|
</div>
|
||||||
<div className={postFooterClassName}>
|
<div className={postFooterClassName}>
|
||||||
{postError}
|
|
||||||
{serverError}
|
|
||||||
{preview}
|
|
||||||
<MsgTyping
|
<MsgTyping
|
||||||
channelId={this.state.channelId}
|
channelId={this.state.channelId}
|
||||||
parentId=''
|
parentId=''
|
||||||
/>
|
/>
|
||||||
|
{preview}
|
||||||
|
{postError}
|
||||||
|
{serverError}
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</form>
|
</form>
|
||||||
|
|||||||
@@ -78,17 +78,15 @@ export default class MemberListItem extends React.Component {
|
|||||||
href='#'
|
href='#'
|
||||||
className='dropdown-toggle theme'
|
className='dropdown-toggle theme'
|
||||||
type='button'
|
type='button'
|
||||||
id='channel_header_dropdown'
|
|
||||||
data-toggle='dropdown'
|
data-toggle='dropdown'
|
||||||
aria-expanded='true'
|
aria-expanded='true'
|
||||||
>
|
>
|
||||||
|
<span className='fa fa-pencil'></span>
|
||||||
<span className='text-capitalize'>{member.roles || 'Member'} </span>
|
<span className='text-capitalize'>{member.roles || 'Member'} </span>
|
||||||
<span className='caret'></span>
|
|
||||||
</a>
|
</a>
|
||||||
<ul
|
<ul
|
||||||
className='dropdown-menu member-menu'
|
className='dropdown-menu member-menu'
|
||||||
role='menu'
|
role='menu'
|
||||||
aria-labelledby='channel_header_dropdown'
|
|
||||||
>
|
>
|
||||||
{makeAdminOption}
|
{makeAdminOption}
|
||||||
{handleRemoveOption}
|
{handleRemoveOption}
|
||||||
@@ -96,7 +94,7 @@ export default class MemberListItem extends React.Component {
|
|||||||
</div>
|
</div>
|
||||||
);
|
);
|
||||||
} else {
|
} else {
|
||||||
invite = <div className='member-role text-capitalize'>{member.roles || 'Member'}<span className='caret hidden'></span></div>;
|
invite = <div className='member-role text-capitalize'><span className='fa fa-pencil hidden'></span>{member.roles || 'Member'}</div>;
|
||||||
}
|
}
|
||||||
|
|
||||||
return (
|
return (
|
||||||
|
|||||||
@@ -181,17 +181,15 @@ export default class MemberListTeamItem extends React.Component {
|
|||||||
href='#'
|
href='#'
|
||||||
className='dropdown-toggle theme'
|
className='dropdown-toggle theme'
|
||||||
type='button'
|
type='button'
|
||||||
id='channel_header_dropdown'
|
|
||||||
data-toggle='dropdown'
|
data-toggle='dropdown'
|
||||||
aria-expanded='true'
|
aria-expanded='true'
|
||||||
>
|
>
|
||||||
|
<span className='fa fa-pencil'></span>
|
||||||
<span>{currentRoles} </span>
|
<span>{currentRoles} </span>
|
||||||
<span className='caret'></span>
|
|
||||||
</a>
|
</a>
|
||||||
<ul
|
<ul
|
||||||
className='dropdown-menu member-menu'
|
className='dropdown-menu member-menu'
|
||||||
role='menu'
|
role='menu'
|
||||||
aria-labelledby='channel_header_dropdown'
|
|
||||||
>
|
>
|
||||||
{makeAdmin}
|
{makeAdmin}
|
||||||
{makeMember}
|
{makeMember}
|
||||||
|
|||||||
@@ -272,7 +272,6 @@ export default class Navbar extends React.Component {
|
|||||||
href='#'
|
href='#'
|
||||||
className='dropdown-toggle theme'
|
className='dropdown-toggle theme'
|
||||||
type='button'
|
type='button'
|
||||||
id='channel_header_dropdown'
|
|
||||||
data-toggle='dropdown'
|
data-toggle='dropdown'
|
||||||
aria-expanded='true'
|
aria-expanded='true'
|
||||||
>
|
>
|
||||||
@@ -282,7 +281,6 @@ export default class Navbar extends React.Component {
|
|||||||
<ul
|
<ul
|
||||||
className='dropdown-menu'
|
className='dropdown-menu'
|
||||||
role='menu'
|
role='menu'
|
||||||
aria-labelledby='channel_header_dropdown'
|
|
||||||
>
|
>
|
||||||
{viewInfoOption}
|
{viewInfoOption}
|
||||||
{addMembersOption}
|
{addMembersOption}
|
||||||
|
|||||||
@@ -1,7 +1,6 @@
|
|||||||
@charset "UTF-8";
|
@charset "UTF-8";
|
||||||
|
|
||||||
.inner__wrap {
|
.inner__wrap {
|
||||||
@include single-transition(all, 0.5s, ease);
|
|
||||||
&.move--left {
|
&.move--left {
|
||||||
margin-right: 400px;
|
margin-right: 400px;
|
||||||
.search-bar__container {
|
.search-bar__container {
|
||||||
|
|||||||
@@ -19,6 +19,7 @@
|
|||||||
font-weight: 600;
|
font-weight: 600;
|
||||||
text-decoration: none;
|
text-decoration: none;
|
||||||
padding: 0 10px;
|
padding: 0 10px;
|
||||||
|
font-family: 'Open Sans', sans-serif;
|
||||||
&:hover {
|
&:hover {
|
||||||
color: #FFF;
|
color: #FFF;
|
||||||
text-decoration: none;
|
text-decoration: none;
|
||||||
|
|||||||
@@ -2,7 +2,7 @@
|
|||||||
|
|
||||||
.preview-container {
|
.preview-container {
|
||||||
position: relative;
|
position: relative;
|
||||||
margin-top: 25px;
|
margin: 1px 0 10px;
|
||||||
width: 100%;
|
width: 100%;
|
||||||
max-height: 100px;
|
max-height: 100px;
|
||||||
height: 100px;
|
height: 100px;
|
||||||
|
|||||||
@@ -186,6 +186,7 @@
|
|||||||
padding: 8px 15px 8px 8px;
|
padding: 8px 15px 8px 8px;
|
||||||
width: 80px;
|
width: 80px;
|
||||||
vertical-align: middle;
|
vertical-align: middle;
|
||||||
|
position: relative;
|
||||||
&.lg {
|
&.lg {
|
||||||
width: 110px;
|
width: 110px;
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -319,13 +319,11 @@ body.ios {
|
|||||||
@include clearfix;
|
@include clearfix;
|
||||||
padding: 3px 0 0 0;
|
padding: 3px 0 0 0;
|
||||||
font-size: 13px;
|
font-size: 13px;
|
||||||
.has-error {
|
.control-label {
|
||||||
.control-label {
|
font-weight: normal;
|
||||||
height: 0;
|
margin-bottom: 0;
|
||||||
display: block;
|
top: -5px;
|
||||||
font-weight: normal;
|
position: relative;
|
||||||
margin-bottom: 0;
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
.msg-typing {
|
.msg-typing {
|
||||||
min-height: 25px;
|
min-height: 25px;
|
||||||
|
|||||||
@@ -44,6 +44,9 @@
|
|||||||
.textarea-wrapper {
|
.textarea-wrapper {
|
||||||
min-height: 100px;
|
min-height: 100px;
|
||||||
}
|
}
|
||||||
|
.btn {
|
||||||
|
margin-bottom: 10px;
|
||||||
|
}
|
||||||
.custom-textarea {
|
.custom-textarea {
|
||||||
min-height: 100px;
|
min-height: 100px;
|
||||||
}
|
}
|
||||||
@@ -123,6 +126,11 @@
|
|||||||
overflow: auto;
|
overflow: auto;
|
||||||
-webkit-overflow-scrolling: touch;
|
-webkit-overflow-scrolling: touch;
|
||||||
@include flex(1 1 auto);
|
@include flex(1 1 auto);
|
||||||
|
|
||||||
|
.preview-container {
|
||||||
|
margin-top: 5px;
|
||||||
|
}
|
||||||
|
|
||||||
}
|
}
|
||||||
|
|
||||||
.post-right-comment-time {
|
.post-right-comment-time {
|
||||||
|
|||||||
@@ -377,10 +377,8 @@
|
|||||||
.msg-typing {
|
.msg-typing {
|
||||||
display: none;
|
display: none;
|
||||||
}
|
}
|
||||||
.has-error {
|
.control-label {
|
||||||
.control-label {
|
top: 0;
|
||||||
height: auto;
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
.post-create-body {
|
.post-create-body {
|
||||||
@@ -409,8 +407,7 @@
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
.preview-container {
|
.preview-container {
|
||||||
padding: 0px;
|
margin: 5px 0 0;
|
||||||
margin-top: 5px;
|
|
||||||
.preview-div {
|
.preview-div {
|
||||||
margin-top: 0;
|
margin-top: 0;
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -135,9 +135,10 @@
|
|||||||
.input-group-addon {
|
.input-group-addon {
|
||||||
padding: 4px 5px;
|
padding: 4px 5px;
|
||||||
width: 40px;
|
width: 40px;
|
||||||
img {
|
}
|
||||||
border: 1px solid rgba(black, 0.15);
|
img {
|
||||||
}
|
border: 1px solid rgba(black, 0.15);
|
||||||
|
width: 29px;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
.premade-themes {
|
.premade-themes {
|
||||||
@@ -325,12 +326,22 @@
|
|||||||
overflow: hidden;
|
overflow: hidden;
|
||||||
text-overflow: ellipsis;
|
text-overflow: ellipsis;
|
||||||
}
|
}
|
||||||
|
}
|
||||||
|
|
||||||
.member-role, .member-drop {
|
.member-role, .member-drop {
|
||||||
position:absolute;
|
position:absolute;
|
||||||
right: 15px;
|
right: 15px;
|
||||||
top: 8px;
|
top: 8px;
|
||||||
|
|
||||||
|
.fa {
|
||||||
|
margin-right: 5px;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.member-menu {
|
||||||
|
top: -50%;
|
||||||
|
right: 110%;
|
||||||
|
}
|
||||||
|
|
||||||
}
|
}
|
||||||
|
|
||||||
.member-invite {
|
.member-invite {
|
||||||
|
|||||||
Ссылка в новой задаче
Block a user