* PLT-6505 - Fixing z-index for post control menu

* PLT-6507 - Channel header icons not aligned

* PLT-6508 - Options popover issue on android

* PLT-6528 - Removing cross contamination on badge

* PLT-6535 - Aligning content in SSO buttons

* PLT-6509 - Aligning dropdown close icon
Этот коммит содержится в:
Asaad Mahmood
2017-05-10 18:48:22 +05:00
коммит произвёл Joram Wilander
родитель 9625362494
Коммит b868aa1dc7
8 изменённых файлов: 126 добавлений и 80 удалений

Просмотреть файл

@@ -493,12 +493,14 @@ export default class LoginController extends React.Component {
key='gitlab' key='gitlab'
href={Client.getOAuthRoute() + '/gitlab/login' + this.props.location.search} href={Client.getOAuthRoute() + '/gitlab/login' + this.props.location.search}
> >
<span className='icon'/>
<span> <span>
<FormattedMessage <span className='icon'/>
id='login.gitlab' <span>
defaultMessage='GitLab' <FormattedMessage
/> id='login.gitlab'
defaultMessage='GitLab'
/>
</span>
</span> </span>
</a> </a>
); );
@@ -511,12 +513,14 @@ export default class LoginController extends React.Component {
key='google' key='google'
href={Client.getOAuthRoute() + '/google/login' + this.props.location.search} href={Client.getOAuthRoute() + '/google/login' + this.props.location.search}
> >
<span className='icon'/>
<span> <span>
<FormattedMessage <span className='icon'/>
id='login.google' <span>
defaultMessage='Google Apps' <FormattedMessage
/> id='login.google'
defaultMessage='Google Apps'
/>
</span>
</span> </span>
</a> </a>
); );
@@ -529,12 +533,14 @@ export default class LoginController extends React.Component {
key='office365' key='office365'
href={Client.getOAuthRoute() + '/office365/login' + this.props.location.search} href={Client.getOAuthRoute() + '/office365/login' + this.props.location.search}
> >
<span className='icon'/>
<span> <span>
<FormattedMessage <span className='icon'/>
id='login.office365' <span>
defaultMessage='Office 365' <FormattedMessage
/> id='login.office365'
defaultMessage='Office 365'
/>
</span>
</span> </span>
</a> </a>
); );
@@ -547,9 +553,11 @@ export default class LoginController extends React.Component {
key='saml' key='saml'
href={'/login/sso/saml' + this.props.location.search} href={'/login/sso/saml' + this.props.location.search}
> >
<span className='icon fa fa-lock fa--margin-top'/>
<span> <span>
{global.window.mm_config.SamlLoginButtonText} <span className='icon fa fa-lock fa--margin-top'/>
<span>
{global.window.mm_config.SamlLoginButtonText}
</span>
</span> </span>
</a> </a>
); );

Просмотреть файл

@@ -144,9 +144,8 @@ export default class SignupController extends React.Component {
key='email' key='email'
to={'/signup_email' + window.location.search} to={'/signup_email' + window.location.search}
> >
<span className='icon fa fa-envelope'/>
<span> <span>
<span className='icon fa fa-envelope'/>
<FormattedMessage <FormattedMessage
id='signup.email' id='signup.email'
defaultMessage='Email and Password' defaultMessage='Email and Password'
@@ -163,12 +162,14 @@ export default class SignupController extends React.Component {
key='gitlab' key='gitlab'
href={Client.getOAuthRoute() + '/gitlab/signup' + window.location.search} href={Client.getOAuthRoute() + '/gitlab/signup' + window.location.search}
> >
<span className='icon'/>
<span> <span>
<FormattedMessage <span className='icon'/>
id='signup.gitlab' <span>
defaultMessage='GitLab Single-Sign-On' <FormattedMessage
/> id='signup.gitlab'
defaultMessage='GitLab Single-Sign-On'
/>
</span>
</span> </span>
</a> </a>
); );
@@ -181,12 +182,14 @@ export default class SignupController extends React.Component {
key='google' key='google'
href={Client.getOAuthRoute() + '/google/signup' + window.location.search} href={Client.getOAuthRoute() + '/google/signup' + window.location.search}
> >
<span className='icon'/>
<span> <span>
<FormattedMessage <span className='icon'/>
id='signup.google' <span>
defaultMessage='Google Account' <FormattedMessage
/> id='signup.google'
defaultMessage='Google Account'
/>
</span>
</span> </span>
</a> </a>
); );
@@ -199,12 +202,14 @@ export default class SignupController extends React.Component {
key='office365' key='office365'
href={Client.getOAuthRoute() + '/office365/signup' + window.location.search} href={Client.getOAuthRoute() + '/office365/signup' + window.location.search}
> >
<span className='icon'/>
<span> <span>
<FormattedMessage <span className='icon'/>
id='signup.office365' <span>
defaultMessage='Office 365' <FormattedMessage
/> id='signup.office365'
defaultMessage='Office 365'
/>
</span>
</span> </span>
</a> </a>
); );
@@ -217,12 +222,14 @@ export default class SignupController extends React.Component {
key='ldap' key='ldap'
to={'/signup_ldap' + window.location.search} to={'/signup_ldap' + window.location.search}
> >
<span className='icon fa fa-folder-open fa--margin-top'/>
<span> <span>
<FormattedMessage <span className='icon fa fa-folder-open fa--margin-top'/>
id='signup.ldap' <span>
defaultMessage='AD/LDAP Credentials' <FormattedMessage
/> id='signup.ldap'
defaultMessage='AD/LDAP Credentials'
/>
</span>
</span> </span>
</Link> </Link>
); );
@@ -242,9 +249,11 @@ export default class SignupController extends React.Component {
key='saml' key='saml'
href={'/login/sso/saml' + window.location.search + query} href={'/login/sso/saml' + window.location.search + query}
> >
<span className='icon fa fa-lock fa--margin-top'/>
<span> <span>
{global.window.mm_config.SamlLoginButtonText} <span className='icon fa fa-lock fa--margin-top'/>
<span>
{global.window.mm_config.SamlLoginButtonText}
</span>
</span> </span>
</a> </a>
); );

Просмотреть файл

@@ -41,6 +41,14 @@
width: 43px; width: 43px;
z-index: 5; z-index: 5;
> span {
> svg {
position: relative;
top: 13px;
vertical-align: top;
}
}
.icon-bar { .icon-bar {
background: $white; background: $white;
width: 21px; width: 21px;
@@ -49,7 +57,8 @@
.icon-search { .icon-search {
font-size: 17px; font-size: 17px;
position: relative; position: relative;
top: -2px; top: 11px;
vertical-align: top;
} }
.icon--white { .icon--white {
@@ -93,7 +102,7 @@
.description { .description {
color: $white; color: $white;
display: inline-block; display: inline-block;
margin-right: .5em; margin-right: 1em;
&.info-popover { &.info-popover {
@include background-size(100% 100%); @include background-size(100% 100%);

Просмотреть файл

@@ -651,6 +651,12 @@
visibility: visible; visibility: visible;
} }
.post__header {
.col__reply {
z-index: 7;
}
}
.post__body { .post__body {
background: transparent !important; background: transparent !important;
} }

Просмотреть файл

@@ -8,7 +8,7 @@
position: fixed; position: fixed;
right: 0; right: 0;
width: 400px; width: 400px;
z-index: 6; z-index: 8;
&.webrtc { &.webrtc {
z-index: 5; z-index: 5;

Просмотреть файл

@@ -1,6 +1,12 @@
@charset 'UTF-8'; @charset 'UTF-8';
@media screen and (max-width: 768px) { @media screen and (max-width: 768px) {
.member-role .member-menu,
.member-drop .member-menu {
right: 0;
top: 30px;
}
.post-code { .post-code {
word-wrap: normal; word-wrap: normal;
} }
@@ -109,9 +115,10 @@
font-weight: 200; font-weight: 200;
height: 30px; height: 30px;
left: 50%; left: 50%;
line-height: 27px; line-height: 0;
margin-left: -15px; margin-left: -15px;
opacity: 1; opacity: 1;
padding-top: 13px;
position: fixed; position: fixed;
text-align: center; text-align: center;
text-shadow: none; text-shadow: none;
@@ -856,6 +863,18 @@
.navbar-brand { .navbar-brand {
white-space: nowrap; white-space: nowrap;
.heading {
line-height: normal;
position: relative;
top: 11px;
vertical-align: top;
}
.header-dropdown__icon {
top: 18px;
vertical-align: top;
}
} }
.dropdown { .dropdown {
@@ -892,9 +911,10 @@
font-weight: 200; font-weight: 200;
height: 30px; height: 30px;
left: 50%; left: 50%;
line-height: 27px; line-height: 0;
margin-left: -15px; margin-left: -15px;
opacity: 1; opacity: 1;
padding-top: 13px;
position: fixed; position: fixed;
text-align: center; text-align: center;
text-shadow: none; text-shadow: none;
@@ -1734,7 +1754,7 @@
} }
} }
@media screen and (max-width: 320px) and (max-height: 560px) { @media screen and (max-width: 380px) and (max-height: 580px) {
#navbar { #navbar {
.navbar-default { .navbar-default {
.dropdown-menu { .dropdown-menu {
@@ -1743,7 +1763,8 @@
> li { > li {
> a { > a {
border: none; border: none;
line-height: 28px; font-size: 13px;
line-height: 27px;
} }
} }
} }
@@ -1751,16 +1772,19 @@
} }
} }
// on iOS, allow clicks within an input's label to actually propagate through to the input itself, // on iOS, allow clicks within an input's label to actually propagate through to the input itself,
// but still allow clicks to a elements to go trough // but still allow clicks to a elements to go trough
// http://stackoverflow.com/a/34810294/6325807 // http://stackoverflow.com/a/34810294/6325807
label { label {
span { span {
pointer-events: none; pointer-events: none;
} }
span a {
pointer-events: all; span a {
} pointer-events: all;
}
} }
@media screen and (-webkit-min-device-pixel-ratio: 0) { @media screen and (-webkit-min-device-pixel-ratio: 0) {

Просмотреть файл

@@ -215,7 +215,9 @@
display: inline-block; display: inline-block;
height: 18px; height: 18px;
margin-right: 8px; margin-right: 8px;
position: relative;
text-align: center; text-align: center;
top: -1px;
width: 18px; width: 18px;
} }
@@ -231,6 +233,18 @@
text-align: left; text-align: left;
width: 200px; width: 200px;
> span {
position: relative;
top: 11px;
vertical-align: top;
> span {
display: inline-block;
line-height: normal;
vertical-align: top;
}
}
&.gitlab { &.gitlab {
background: #554488; background: #554488;
@@ -238,10 +252,6 @@
background: darken(#554488, 10%); background: darken(#554488, 10%);
} }
span {
vertical-align: middle;
}
.icon { .icon {
background-image: url('../images/gitlabLogo.png'); background-image: url('../images/gitlabLogo.png');
} }
@@ -254,10 +264,6 @@
background: darken(#dd4b39, 10%); background: darken(#dd4b39, 10%);
} }
span {
vertical-align: middle;
}
.icon { .icon {
background-image: url('../images/googleLogo.png'); background-image: url('../images/googleLogo.png');
} }
@@ -270,10 +276,6 @@
background: darken(#0079d6, 10%); background: darken(#0079d6, 10%);
} }
span {
vertical-align: middle;
}
.icon { .icon {
background-image: url('../images/office365Logo.png'); background-image: url('../images/office365Logo.png');
} }
@@ -285,10 +287,6 @@
&:hover { &:hover {
background: darken(#3AA1CF, 10%); background: darken(#3AA1CF, 10%);
} }
span {
vertical-align: middle;
}
} }
&.email { &.email {
@@ -297,10 +295,6 @@
&:hover { &:hover {
background: $primary-color--hover; background: $primary-color--hover;
} }
span {
vertical-align: middle;
}
} }
&.saml { &.saml {
@@ -309,10 +303,6 @@
&:hover { &:hover {
background: darken(#34a28b, 10%); background: darken(#34a28b, 10%);
} }
span {
vertical-align: middle;
}
} }
&.btn--full { &.btn--full {

Просмотреть файл

@@ -558,13 +558,13 @@ export function applyTheme(theme) {
if (theme.mentionBj) { if (theme.mentionBj) {
changeCss('.sidebar--left .nav-pills__unread-indicator, .app__body .new-messages__button div', 'background:' + theme.mentionBj); changeCss('.sidebar--left .nav-pills__unread-indicator, .app__body .new-messages__button div', 'background:' + theme.mentionBj);
changeCss('.sidebar--left .badge', 'background:' + theme.mentionBj + ' !important'); changeCss('.app__body .sidebar--left .badge', 'background:' + theme.mentionBj);
changeCss('.multi-teams .team-sidebar .team-wrapper .team-container .team-btn .badge', 'background:' + theme.mentionBj + ' !important'); changeCss('.multi-teams .team-sidebar .team-wrapper .team-container .team-btn .badge', 'background:' + theme.mentionBj + ' !important');
} }
if (theme.mentionColor) { if (theme.mentionColor) {
changeCss('.app__body .sidebar--left .nav-pills__unread-indicator, .app__body .new-messages__button div', 'color:' + theme.mentionColor); changeCss('.app__body .sidebar--left .nav-pills__unread-indicator, .app__body .new-messages__button div', 'color:' + theme.mentionColor);
changeCss('.app__body .sidebar--left .badge', 'color:' + theme.mentionColor + ' !important'); changeCss('.app__body .sidebar--left .badge', 'color:' + theme.mentionColor);
changeCss('.app__body .multi-teams .team-sidebar .team-wrapper .team-container .team-btn .badge', 'color:' + theme.mentionColor + ' !important'); changeCss('.app__body .multi-teams .team-sidebar .team-wrapper .team-container .team-btn .badge', 'color:' + theme.mentionColor + ' !important');
} }