IntenseWebs/mattermost
3
0
Fork 0
mirror of https://github.com/mattermost/mattermost.git synced 2025-02-25 18:55:24 -06:00
Code Issues Packages Projects Releases Wiki Activity

Multiple UI improvements (#4835)

Browse Source 
* Updating sizes for teams sidebar

* PLT-4641 - Rearranging notification option

* PLT-4504 - Updating styles for Oauth apps

* PLT-4852 - Updating font size for lists

* Fix for the unread indicator with teams sidebar
This commit is contained in:
Asaad Mahmood
2016-12-20 02:44:13 +05:00
committed by Joram Wilander
parent a55e7a97ee
commit 58e8da11b1
7 changed files with 35 additions and 35 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
webapp/components/navbar.jsx
View File

@@ -539,11 +539,11 @@ export default class Navbar extends React.Component {
role='menu'
>
{viewInfoOption}
{notificationPreferenceOption}
{addMembersOption}
{manageMembersOption}
{setChannelHeaderOption}
{setChannelPurposeOption}
{notificationPreferenceOption}
{renameChannelOption}
{deleteChannelOption}
{leaveChannelOption}

2
webapp/sass/layout/_forms.scss
View File

@@ -23,7 +23,7 @@
.input__help {
@include opacity(.8);
color: inherit;
margin: 10px 0 0 10px;
margin: 10px 0 0 0;
word-break: break-word;
&.dark {

1
webapp/sass/layout/_post.scss
View File

@@ -1022,6 +1022,7 @@
li {
ul,
ol {
font-size: 1em;
margin: 0;
padding: 0 0 0 20px;
}

43
webapp/sass/layout/_team-sidebar.scss
View File

@@ -4,7 +4,7 @@
left: 0;
position: fixed;
text-align: center;
width: 75px;
width: 65px;
z-index: 5;
.team-wrapper {
@@ -14,41 +14,40 @@
padding-top: 15px;
.team-container {
width: 100%;
text-align: center;
display: table;
margin-bottom: 10px;
position: relative;
text-align: center;
width: 100%;
.team-btn {
border: none;
height: 42px;
text-align: center;
font-weight: bold;
border-radius: 5px;
position: relative;
width: 42px;
background-color: rgba(0, 0, 0, 0.3);
@include border-radius(2px);
background-color: alpha-color($black, .3);
display: table-cell;
font-weight: bold;
height: 35px;
position: relative;
text-align: center;
vertical-align: middle;
width: 35px;
.badge {
position: absolute;
top: -3px;
right: -6px;
font-size: 10px;
position: absolute;
right: -6px;
top: -3px;
}
}
&.active {
.team-btn {
border: 1px solid #fff;
background-color: transparent;
border: 1px solid $white;
}
}
&.active:before {
background: black;
background: $black;
content: '';
height: 100%;
left: 0;
@@ -58,7 +57,7 @@
}
&.unread:before {
background: black;
background: $black;
border-radius: 50%;
content: '';
height: 5px;
@@ -69,8 +68,8 @@
}
a.team-disabled {
@include opacity(.5);
cursor: not-allowed;
opacity: 0.5;
}
}
@@ -81,10 +80,14 @@
}
.sidebar--left {
left: 75px;
left: 65px;
.nav-pills__unread-indicator {
left: 80px;
}
}
.app__content {
margin-left: 295px;
margin-left: 285px;
}
}

17
webapp/sass/responsive/_mobile.scss
View File

@@ -1165,9 +1165,6 @@
}
.multi-teams {
.team-sidebar {
width: 75px;
}
.app__content {
margin-left: 0;
@@ -1177,7 +1174,11 @@
left: 0;
&.move--right {
left: 75px;
left: 65px;
.nav-pills__unread-indicator {
left: 15px;
}
}
}
@@ -1521,15 +1522,11 @@
@media screen and (max-width: 320px) {
.multi-teams {
.team-sidebar {
width: 65px;
}
.sidebar--left {
width: 220px;
&.move--right {
left: 65px;
.nav-pills__unread-indicator {
width: 190px;
}
}
}

1
webapp/sass/routes/_settings.scss
View File

@@ -15,7 +15,6 @@
}
.authorized-apps__wrapper {
background-color: #fff;
padding: 10px 0;
}

4
webapp/utils/utils.jsx
View File

@@ -610,7 +610,7 @@ export function applyTheme(theme) {
changeCss('.app__body .date-separator .separator__hr, .app__body .modal-footer, .app__body .modal .custom-textarea', 'border-color:' + changeOpacity(theme.centerChannelColor, 0.2));
changeCss('.app__body .search-item-container, .app__body .post-right__container .post.post--root', 'border-color:' + changeOpacity(theme.centerChannelColor, 0.1));
changeCss('.app__body .modal .custom-textarea:focus', 'border-color:' + changeOpacity(theme.centerChannelColor, 0.3));
changeCss('.app__body .channel-intro, .app__body .modal .settings-modal .settings-table .settings-content .divider-dark, .app__body hr, .app__body .modal .settings-modal .settings-table .settings-links, .app__body .modal .settings-modal .settings-table .settings-content .appearance-section .theme-elements__header', 'border-color:' + changeOpacity(theme.centerChannelColor, 0.2));
changeCss('.app__body .channel-intro, .app__body .modal .settings-modal .settings-table .settings-content .divider-dark, .app__body hr, .app__body .modal .settings-modal .settings-table .settings-links, .app__body .modal .settings-modal .settings-table .settings-content .appearance-section .theme-elements__header, .app__body .user-settings .authorized-app:not(:last-child)', 'border-color:' + changeOpacity(theme.centerChannelColor, 0.2));
changeCss('.app__body .post.current--user .post__body, .app__body .post.post--comment.other--root.current--user .post-comment, .app__body pre, .app__body .post-right__container .post.post--root', 'background:' + changeOpacity(theme.centerChannelColor, 0.05));
changeCss('.app__body .post.post--comment.other--root.current--user .post-comment, .app__body .more-modal__list .more-modal__row, .app__body .member-div:first-child, .app__body .member-div, .app__body .access-history__table .access__report, .app__body .activity-log__table', 'border-color:' + changeOpacity(theme.centerChannelColor, 0.1));
changeCss('@media(max-width: 1800px){.app__body .inner-wrap.move--left .post.post--comment.same--root', 'border-color:' + changeOpacity(theme.centerChannelColor, 0.07));
@@ -637,7 +637,7 @@ export function applyTheme(theme) {
changeCss('.app__body .channel-header__info .status .offline--icon', 'fill:' + theme.centerChannelColor);
changeCss('.app__body .navbar .status .offline--icon', 'fill:' + theme.centerChannelColor);
changeCss('.app__body .post-reaction:not(.post-reaction--current-user)', 'border-color:' + changeOpacity(theme.centerChannelColor, 0.25));
changeCss('.app__body .post-reaction:not(.post-reaction--current-user)', 'color:' + changeOpacity(theme.centerChannelColor, 0.6));
changeCss('.app__body .post-reaction:not(.post-reaction--current-user)', 'color:' + changeOpacity(theme.centerChannelColor, 0.7));
}
if (theme.newMessageSeparator) {