diff options
author | Asaad Mahmood <asaadmahmood@users.noreply.github.com> | 2016-10-25 01:04:29 +0500 |
---|---|---|
committer | Christopher Speller <crspeller@gmail.com> | 2016-10-24 16:04:29 -0400 |
commit | 510291e2e70f5fecd460afe95e33d310c2f98e3f (patch) | |
tree | ee85387833326d15d18c0c75c384b9cffa5ae96b /webapp/sass/responsive/_mobile.scss | |
parent | 3a0b0fe63fe3732a819155a97e1cc088cd22d546 (diff) | |
download | chat-510291e2e70f5fecd460afe95e33d310c2f98e3f.tar.gz chat-510291e2e70f5fecd460afe95e33d310c2f98e3f.tar.bz2 chat-510291e2e70f5fecd460afe95e33d310c2f98e3f.zip |
Updating shift UI changes (#4317)
Diffstat (limited to 'webapp/sass/responsive/_mobile.scss')
-rw-r--r-- | webapp/sass/responsive/_mobile.scss | 136 |
1 files changed, 135 insertions, 1 deletions
diff --git a/webapp/sass/responsive/_mobile.scss b/webapp/sass/responsive/_mobile.scss index a3e7ab5f5..87ee837d1 100644 --- a/webapp/sass/responsive/_mobile.scss +++ b/webapp/sass/responsive/_mobile.scss @@ -730,6 +730,51 @@ white-space: nowrap; } + .dropdown-menu { + background: alpha-color($black, .9); + height: 100%; + left: 0; + overflow: auto; + padding-bottom: 140px; + position: fixed; + top: 42px; + width: 100%; + + &:after { + @include border-radius(50%); + background: alpha-color($black, .8); + border-bottom: 1px solid alpha-color($white, .3); + bottom: 25px; + color: $white; + content: '×'; + display: block; + font-size: 30px; + height: 50px; + left: 50%; + line-height: 50px; + margin-left: -25px; + position: fixed; + text-align: center; + width: 50px; + } + + > li { + > a { + border-bottom: 1px solid alpha-color($white, .3); + color: $white; + font-weight: 600; + line-height: 50px; + margin: 0 auto; + text-align: center; + width: 90%; + + &:hover { + background: transparent; + } + } + } + } + .status { margin: 0 5px 0 3px; top: 2px; @@ -1056,8 +1101,76 @@ } @media screen and (max-width: 640px) { + .post-list__table { + .post-list__content { + .dropdown-menu { + &.bottom { + bottom: auto; + top: 30%; + } + + bottom: auto; + height: auto; + left: 0; + margin-left: 25px; + position: fixed; + top: 30%; + width: calc(100% - 50px); + 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: ''; + height: 100%; + left: 0; + position: fixed; + top: 0; + width: 100%; + } + } + } + } + .app__body { .modal { + overflow: hidden; + padding: 0 !important; + + .modal-dialog { + height: 100%; + margin: 0; + max-width: 100%; + + .modal-content { + height: 100%; + } + } + + .modal-footer { + bottom: 0; + position: fixed; + width: 100%; + } + .about-modal { .about-modal__content { display: block; @@ -1231,15 +1344,36 @@ } } } + .tip-overlay { &.tip-overlay--sidebar { 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 // http://stackoverflow.com/a/34810294/6325807 label span { pointer-events: none; -}
\ No newline at end of file +} + +@media screen and (-webkit-min-device-pixel-ratio:0) { + select, + textarea, + input { + font-size: 16px; + } +} |