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

Shift UI changes (#4353)

Просмотр исходного кода 
* Shift UI changes

* Reverting config.json
Этот коммит содержится в:
Asaad Mahmood
2016-10-28 01:49:32 +05:00
коммит произвёл Joram Wilander
родитель 55803ebcc8
Коммит c5a0ac8c6a
9 изменённых файлов: 102 добавлений и 70 удалений
Скачать Patch файл Скачать Diff файл Показать все файлы Свернуть все файлы

2
config/config.json
Просмотреть файл

@@ -238,4 +238,4 @@
"TurnUsername": "",
"TurnSharedKey": ""
}
}
}

15
webapp/components/post_view/components/post_info.jsx
Просмотреть файл

@@ -167,6 +167,7 @@ export default class PostInfo extends React.Component {
<li
key='editPost'
role='presentation'
className='dropdown-submenu'
>
<a
href='#'
@@ -205,12 +206,14 @@ export default class PostInfo extends React.Component {
aria-expanded='false'
onClick={this.handleDropdownClick}
/>
<ul
className='dropdown-menu'
role='menu'
>
{dropdownContents}
</ul>
<div className='dropdown-menu__content'>
<ul
className='dropdown-menu'
role='menu'
>
{dropdownContents}
</ul>
</div>
</div>
);
}

14
webapp/components/rhs_comment.jsx
Просмотреть файл

@@ -226,12 +226,14 @@ export default class RhsComment extends React.Component {
data-toggle='dropdown'
aria-expanded='false'
/>
<ul
className='dropdown-menu'
role='menu'
>
{dropdownContents}
</ul>
<div className='dropdown-menu__content'>
<ul
className='dropdown-menu'
role='menu'
>
{dropdownContents}
</ul>
</div>
</div>
);
}

14
webapp/components/rhs_root_post.jsx
Просмотреть файл

@@ -236,12 +236,14 @@ export default class RhsRootPost extends React.Component {
data-toggle='dropdown'
aria-expanded='false'
/>
<ul
className='dropdown-menu'
role='menu'
>
{dropdownContents}
</ul>
<div className='dropdown-menu__content'>
<ul
className='dropdown-menu'
role='menu'
>
{dropdownContents}
</ul>
</div>
</div>
);
}

17
webapp/sass/components/_dropdown.scss
Просмотреть файл

@@ -17,8 +17,9 @@
@include opacity(.15);
}
> li > a {
div > a {
color: inherit;
text-decoration: none;
&:focus,
&:hover {
@@ -26,3 +27,17 @@
}
}
}
.open {
> .dropdown-menu__content {
display: block;
> .dropdown-menu {
display: block;
}
}
}
.dropdown-menu__content {
display: none;
}

1
webapp/sass/components/_modal.scss
Просмотреть файл

@@ -590,6 +590,7 @@
.more-modal__row {
border-bottom: 1px solid $light-gray;
display: flex;
min-height: 65px;
padding: 8px 15px;
}

1
webapp/sass/layout/_sidebar-left.scss
Просмотреть файл

@@ -117,6 +117,7 @@
> a {
border-radius: 0;
line-height: 1.5;
outline: none;
overflow: hidden;
padding: 3px 10px 3px 25px;
text-overflow: ellipsis;

99
webapp/sass/responsive/_mobile.scss
Просмотреть файл

@@ -1149,42 +1149,26 @@
}
@media screen and (max-width: 640px) {
.post-list__table {
.post-list__content {
.dropdown-menu {
&.bottom {
bottom: auto;
top: 30%;
}
.app__body {
.post {
.open {
> .dropdown-menu__content {
display: table;
bottom: auto;
height: auto;
> .dropdown-menu {
display: table-cell;
}
}
}
.dropdown-menu__content {
height: 100%;
left: 0;
margin-left: 25px;
position: fixed;
top: 30%;
width: calc(100% - 50px);
top: 0;
width: 100%;
z-index: 9999;
> li {
> a {
border-bottom: 1px solid;
line-height: 50px;
position: relative;
text-align: center;
&:hover {
background: transparent;
}
}
&:last-child {
a {
border: none;
}
}
}
&:before {
background: alpha-color($black, .3);
content: '';
@@ -1195,10 +1179,45 @@
width: 100%;
}
}
}
}
.app__body {
.dropdown-menu {
&.bottom {
bottom: auto;
top: 0;
}
background: transparent;
border: none;
bottom: auto;
box-shadow: none;
float: none;
height: 100%;
left: 0;
margin: 0;
padding: 0 2em;
position: relative;
top: 0;
vertical-align: middle;
width: 100%;
z-index: 9999;
> li {
&:last-child {
a {
border: none;
}
}
}
a {
border-bottom: 1px solid;
line-height: 50px;
position: relative;
text-align: center;
}
}
}
.modal {
overflow: hidden;
padding: 0 !important;
@@ -1398,18 +1417,6 @@
min-height: 440px;
}
}
.post-list__table {
.post-list__content {
.dropdown-menu {
&.bottom {
top: 25%;
}
top: 25%;
}
}
}
}
// on iOS, allow clicks within an input's label to actually propagate through to the input itself

9
webapp/utils/utils.jsx
Просмотреть файл

@@ -484,7 +484,7 @@ export function applyTheme(theme) {
}
if (theme.sidebarTextHoverBg) {
changeCss('.app__body .sidebar--left .nav-pills__container li>a:hover, .app__body .sidebar--left .nav-pills__container li>a:focus, .app__body .modal .settings-modal .nav-pills>li:hover a, .app__body .modal .settings-modal .nav-pills>li:focus a', 'background:' + theme.sidebarTextHoverBg, 1);
changeCss('.app__body .sidebar--left .nav-pills__container li>a:hover, .app__body .modal .settings-modal .nav-pills>li:hover a', 'background:' + theme.sidebarTextHoverBg, 1);
changeCss('@media(max-width: 768px){.app__body .modal .settings-modal .settings-table .nav>li:hover a', 'background:' + theme.sidebarTextHoverBg, 1);
}
@@ -545,7 +545,7 @@ export function applyTheme(theme) {
if (theme.centerChannelBg) {
changeCss('@media(min-width: 768px){.app__body .post:hover .post__header .col__reply, .app__body .post.post--hovered .post__header .col__reply', 'background:' + theme.centerChannelBg, 1);
changeCss('.app__body .app__content, .app__body .markdown__table, .app__body .markdown__table tbody tr, .app__body .suggestion-list__content, .app__body .modal .modal-content, .app__body .post.post--compact .post-image__column, .app__body .suggestion-list__divider > span', 'background:' + theme.centerChannelBg, 1);
changeCss('#post-list .post-list-holder-by-time, .app__body .post-list__table .post-list__content .dropdown-menu a', 'background:' + theme.centerChannelBg, 1);
changeCss('#post-list .post-list-holder-by-time, .app__body .post .dropdown-menu a', 'background:' + theme.centerChannelBg, 1);
changeCss('#post-create', 'background:' + theme.centerChannelBg, 1);
changeCss('.app__body .date-separator .separator__text, .app__body .new-separator .separator__text', 'background:' + theme.centerChannelBg, 1);
changeCss('.app__body .post-image__details, .app__body .search-help-popover .search-autocomplete__divider span', 'background:' + theme.centerChannelBg, 1);
@@ -566,7 +566,7 @@ export function applyTheme(theme) {
changeCss('.app__body .post-list__arrows, .app__body .post .flag-icon__container', 'fill:' + changeOpacity(theme.centerChannelColor, 0.3), 1);
changeCss('.app__body .modal .status .offline--icon, .app__body .channel-header__links .icon, .app__body .sidebar--right .sidebar--right__subheader .usage__icon', 'fill:' + theme.centerChannelColor, 1);
changeCss('@media(min-width: 768px){.app__body .post:hover .post__header .col__reply, .app__body .post.post--hovered .post__header .col__reply', 'border-color:' + changeOpacity(theme.centerChannelColor, 0.2), 2);
changeCss('.app__body .post-list__table .post-list__content .dropdown-menu a, .app__body .sidebar--left, .app__body .sidebar--right .sidebar--right__header, .app__body .suggestion-list__content .command', 'border-color:' + changeOpacity(theme.centerChannelColor, 0.2), 1);
changeCss('.app__body .post .dropdown-menu a, .app__body .sidebar--left, .app__body .sidebar--right .sidebar--right__header, .app__body .suggestion-list__content .command', 'border-color:' + changeOpacity(theme.centerChannelColor, 0.2), 1);
changeCss('.app__body .post.post--system .post__body', 'color:' + changeOpacity(theme.centerChannelColor, 0.6), 1);
changeCss('.app__body .input-group-addon, .app__body .app__content, .app__body .post-create__container .post-create-body .btn-file, .app__body .post-create__container .post-create-footer .msg-typing, .app__body .suggestion-list__content .command, .app__body .modal .modal-content, .app__body .dropdown-menu, .app__body .popover, .app__body .mentions__name, .app__body .tip-overlay, .app__body .form-control[disabled], .app__body .form-control[readonly], .app__body fieldset[disabled] .form-control', 'color:' + theme.centerChannelColor, 1);
changeCss('.app__body .post .post__link', 'color:' + changeOpacity(theme.centerChannelColor, 0.65), 1);
@@ -597,6 +597,7 @@ export function applyTheme(theme) {
changeCss('.app__body .post-image__column a, .app__body .post-image__column a:hover, .app__body .post-image__column a:focus', 'color:' + theme.centerChannelColor, 1);
changeCss('@media(min-width: 768px){.app__body .search-bar__container .search__form .search-bar, .app__body .form-control', 'color:' + theme.centerChannelColor, 2);
changeCss('.app__body .input-group-addon, .app__body .search-bar__container .search__form, .app__body .form-control', 'border-color:' + changeOpacity(theme.centerChannelColor, 0.2), 1);
changeCss('@media(min-width: 768px){.app__body .post-list__table .post-list__content .dropdown-menu a:hover', 'background:' + changeOpacity(theme.centerChannelColor, 0.1), 1);
changeCss('.app__body .form-control:focus', 'border-color:' + changeOpacity(theme.centerChannelColor, 0.3), 1);
changeCss('.app__body .attachment .attachment__content', 'border-color:' + changeOpacity(theme.centerChannelColor, 0.3), 1);
changeCss('.app__body .input-group-addon, .app__body .channel-intro .channel-intro__content, .app__body .webhooks__container', 'background:' + changeOpacity(theme.centerChannelColor, 0.05), 1);
@@ -610,7 +611,7 @@ export function applyTheme(theme) {
changeCss('@media(max-width: 1800px){.app__body .inner-wrap.move--left .post.post--comment.same--root', 'border-color:' + changeOpacity(theme.centerChannelColor, 0.07), 2);
changeCss('.app__body .post:hover, .app__body .post.post--hovered, .app__body .more-modal__list .more-modal__row:hover, .app__body .modal .settings-modal .settings-table .settings-content .section-min:hover', 'background:' + changeOpacity(theme.centerChannelColor, 0.08), 1);
changeCss('.app__body .date-separator.hovered--before:after, .app__body .date-separator.hovered--after:before, .app__body .new-separator.hovered--after:before, .app__body .new-separator.hovered--before:after', 'background:' + changeOpacity(theme.centerChannelColor, 0.07), 1);
changeCss('.app__body .suggestion-list__content .command:hover, .app__body .mentions__name:hover, .app__body .suggestion--selected, .app__body .dropdown-menu>li>a:focus, .app__body .dropdown-menu>li>a:hover, .app__body .bot-indicator', 'background:' + changeOpacity(theme.centerChannelColor, 0.15), 1);
changeCss('@media(min-width: 768px){.app__body .suggestion-list__content .command:hover, .app__body .mentions__name:hover, .app__body .suggestion--selected, .app__body .dropdown-menu>li>a:focus, .app__body .dropdown-menu>li>a:hover, .app__body .bot-indicator', 'background:' + changeOpacity(theme.centerChannelColor, 0.15), 1);
changeCss('code, .app__body .form-control[disabled], .app__body .form-control[readonly], .app__body fieldset[disabled] .form-control', 'background:' + changeOpacity(theme.centerChannelColor, 0.1), 1);
changeCss('@media(min-width: 960px){.app__body .post.current--user:hover .post__body ', 'background: none;', 1);
changeCss('.app__body .sidebar--right', 'color:' + theme.centerChannelColor, 2);