diff options
Diffstat (limited to 'webapp/sass')
-rw-r--r-- | webapp/sass/components/_dropdown.scss | 17 | ||||
-rw-r--r-- | webapp/sass/components/_modal.scss | 1 | ||||
-rw-r--r-- | webapp/sass/layout/_sidebar-left.scss | 1 | ||||
-rw-r--r-- | webapp/sass/responsive/_mobile.scss | 89 |
4 files changed, 66 insertions, 42 deletions
diff --git a/webapp/sass/components/_dropdown.scss b/webapp/sass/components/_dropdown.scss index 91d325002..39317358f 100644 --- a/webapp/sass/components/_dropdown.scss +++ b/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; +} diff --git a/webapp/sass/components/_modal.scss b/webapp/sass/components/_modal.scss index 96da54275..0cc20fd2f 100644 --- a/webapp/sass/components/_modal.scss +++ b/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; } diff --git a/webapp/sass/layout/_sidebar-left.scss b/webapp/sass/layout/_sidebar-left.scss index dae34d2fc..6101849d5 100644 --- a/webapp/sass/layout/_sidebar-left.scss +++ b/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; diff --git a/webapp/sass/responsive/_mobile.scss b/webapp/sass/responsive/_mobile.scss index b8d54715a..d862f46c8 100644 --- a/webapp/sass/responsive/_mobile.scss +++ b/webapp/sass/responsive/_mobile.scss @@ -1149,35 +1149,59 @@ } @media screen and (max-width: 640px) { - .post-list__table { - .post-list__content { + .app__body { + .post { + .open { + > .dropdown-menu__content { + display: table; + + > .dropdown-menu { + display: table-cell; + } + } + } + + .dropdown-menu__content { + height: 100%; + left: 0; + position: fixed; + top: 0; + width: 100%; + z-index: 9999; + + &:before { + background: alpha-color($black, .3); + content: ''; + height: 100%; + left: 0; + position: fixed; + top: 0; + width: 100%; + } + } + .dropdown-menu { &.bottom { bottom: auto; - top: 30%; + top: 0; } + background: transparent; + border: none; bottom: auto; - height: auto; + box-shadow: none; + float: none; + height: 100%; left: 0; - margin-left: 25px; - position: fixed; - top: 30%; - width: calc(100% - 50px); + margin: 0; + padding: 0 2em; + position: relative; + top: 0; + vertical-align: middle; + 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; @@ -1185,20 +1209,15 @@ } } - &:before { - background: alpha-color($black, .3); - content: ''; - height: 100%; - left: 0; - position: fixed; - top: 0; - width: 100%; + a { + border-bottom: 1px solid; + line-height: 50px; + position: relative; + text-align: center; } } } - } - .app__body { .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 |