diff options
Diffstat (limited to 'web/sass-files/sass/partials')
-rw-r--r-- | web/sass-files/sass/partials/_base.scss | 4 | ||||
-rw-r--r-- | web/sass-files/sass/partials/_content.scss | 2 | ||||
-rw-r--r-- | web/sass-files/sass/partials/_files.scss | 5 | ||||
-rw-r--r-- | web/sass-files/sass/partials/_modal.scss | 6 | ||||
-rw-r--r-- | web/sass-files/sass/partials/_popover.scss | 5 | ||||
-rw-r--r-- | web/sass-files/sass/partials/_post.scss | 64 | ||||
-rw-r--r-- | web/sass-files/sass/partials/_post_right.scss | 4 | ||||
-rw-r--r-- | web/sass-files/sass/partials/_responsive.scss | 36 | ||||
-rw-r--r-- | web/sass-files/sass/partials/_search.scss | 9 | ||||
-rw-r--r-- | web/sass-files/sass/partials/_settings.scss | 244 | ||||
-rw-r--r-- | web/sass-files/sass/partials/_sidebar--right.scss | 6 | ||||
-rw-r--r-- | web/sass-files/sass/partials/_tutorial.scss | 8 |
12 files changed, 250 insertions, 143 deletions
diff --git a/web/sass-files/sass/partials/_base.scss b/web/sass-files/sass/partials/_base.scss index 4f9e1d5c7..04ba9c51e 100644 --- a/web/sass-files/sass/partials/_base.scss +++ b/web/sass-files/sass/partials/_base.scss @@ -125,10 +125,6 @@ a:focus, a:hover { } } -select { - -moz-appearance:none; -} - .form-control { @include border-radius(2px); &:focus { diff --git a/web/sass-files/sass/partials/_content.scss b/web/sass-files/sass/partials/_content.scss index da75bc61b..b54c97b41 100644 --- a/web/sass-files/sass/partials/_content.scss +++ b/web/sass-files/sass/partials/_content.scss @@ -1,9 +1,7 @@ @charset "UTF-8"; .inner__wrap { - @include single-transition(all, 0.5s, ease); &.move--left { - margin-right: 400px; .search-bar__container { display: none; } diff --git a/web/sass-files/sass/partials/_files.scss b/web/sass-files/sass/partials/_files.scss index 2c341f61e..62e067437 100644 --- a/web/sass-files/sass/partials/_files.scss +++ b/web/sass-files/sass/partials/_files.scss @@ -257,3 +257,8 @@ @include opacity(0); } } + +.view-image__loading { + background: black; + min-height: 100px; +} diff --git a/web/sass-files/sass/partials/_modal.scss b/web/sass-files/sass/partials/_modal.scss index 6f70e502f..7627f6a4c 100644 --- a/web/sass-files/sass/partials/_modal.scss +++ b/web/sass-files/sass/partials/_modal.scss @@ -229,6 +229,12 @@ height: 80%; } + audio, canvas, progress, video { + max-width: 100%; + height: auto; + display: block; + } + .modal-close { background: url("../images/close.png") no-repeat; @include background-size(100% 100%); diff --git a/web/sass-files/sass/partials/_popover.scss b/web/sass-files/sass/partials/_popover.scss index 1ae07fe5b..8a61758f1 100644 --- a/web/sass-files/sass/partials/_popover.scss +++ b/web/sass-files/sass/partials/_popover.scss @@ -85,6 +85,11 @@ background: rgba(black, 0.2); } + .fa { + margin-right: 5px; + @include opacity(0.5); + } + .profile-img { margin-top: -1px; height: 16px; diff --git a/web/sass-files/sass/partials/_post.scss b/web/sass-files/sass/partials/_post.scss index ff430ba8a..937b08084 100644 --- a/web/sass-files/sass/partials/_post.scss +++ b/web/sass-files/sass/partials/_post.scss @@ -211,6 +211,10 @@ body.ios { overflow-y: hidden; height: 100%; + .inactive { + display: none; + } + .post-list-holder-by-time { background: #fff; overflow-y: scroll; @@ -222,21 +226,18 @@ body.ios { &::-webkit-scrollbar { width: 0px !important; } - &.inactive { - display: none; - } &.active { display: inline; } } .more-messages-text { - margin-top: 2px; - margin-bottom: 5px; + margin: 5px 0 10px; display: block; text-align: center; outline: none; border: none; + font-size: 13px; } .beginning-messages-text { margin-top: 2px; @@ -247,6 +248,50 @@ body.ios { } } +.post-list__timestamp { + position: absolute; + top: 8px; + left: 50%; + z-index: 50; + width: 120px; + text-align: center; + background: $primary-color; + color: #fff; + @include border-radius(3px); + font-size: 12px; + line-height: 25px; + margin-left: -60px; + -webkit-font-smoothing: initial; + @include single-transition(all, 0.3s, ease); + @include translateY(-45px); + @include opacity(0); + display: none; + + &.scrolling { + @include single-transition(all, 0.3s, ease); + @include translateY(0); + @include opacity(0.8); + } +} + +.post-list__arrows { + background: url('../images/postArrows.png') center; + @include background-size(28px 28px); + background-repeat: no-repeat; + width: 40px; + height: 40px; + position: absolute; + bottom: 50px; + right: 5px; + z-index: 50; + @include opacity(0); + @include single-transition(all, 0.3s); + + &.scrolling { + @include opacity(1); + } +} + .post-create__container { form { width: 100%; @@ -379,7 +424,7 @@ body.ios { p { - margin: 0 0 1em; + margin: 0; line-height: 1.6em; font-size: 0.97em; white-space: pre-wrap; @@ -631,9 +676,14 @@ body.ios { } ul { + margin-bottom: 0.6em; padding: 5px 0 0 20px; } + ul + p { + margin-top: 1em; + } + ul, ol { p { margin-bottom: 0; @@ -683,7 +733,7 @@ body.ios { } .post__time { - font-size: 13px; + font-size: 0.9em; } .post__time, &.post--system .post__body { diff --git a/web/sass-files/sass/partials/_post_right.scss b/web/sass-files/sass/partials/_post_right.scss index fa52e2972..d820447f5 100644 --- a/web/sass-files/sass/partials/_post_right.scss +++ b/web/sass-files/sass/partials/_post_right.scss @@ -17,7 +17,8 @@ .post { &.post--root { - padding-bottom: 0; + padding-bottom: 1.2em; + border-bottom: 1px solid #ddd; } .post__header { @@ -36,6 +37,7 @@ hr { margin-bottom: 0; + border: none; } .post-create__container { diff --git a/web/sass-files/sass/partials/_responsive.scss b/web/sass-files/sass/partials/_responsive.scss index 2aa130fa9..8491869a6 100644 --- a/web/sass-files/sass/partials/_responsive.scss +++ b/web/sass-files/sass/partials/_responsive.scss @@ -56,6 +56,7 @@ .sidebar--right { z-index: 5; @include translateX(100%); + @include single-transition(all, 0.5s, ease); &.move--left { @include translateX(0); @@ -241,6 +242,9 @@ } } } + .post-list__timestamp { + display: block; + } .signup-team__container { padding: 30px 0; margin-bottom: 30px; @@ -295,15 +299,6 @@ .settings-content { &.minimize-settings { display: block; - .section-edit { - position: absolute; - top: 7px; - right: 0; - width: 50px; - .fa { - display: inline-block; - } - } } .section-min:hover { background: none; @@ -336,12 +331,24 @@ } } .settings-table { - .nav, .nav.absolute { + .nav { + &.position--top { + top: auto; + } position: relative; top: auto; width: 100%; } .settings-content { + .section-edit { + position: absolute; + top: 14px; + right: 0; + padding-right: 0; + .fa { + display: inline-block; + } + } &.minimize-settings { padding: 0; display: none; @@ -349,6 +356,9 @@ padding: 70px 20px 30px; } } + .section-min:hover { + background: none !important; + } } .settings-links { background: #fff; @@ -625,6 +635,7 @@ height: calc(100% - 44px); } .inner__wrap { + @include single-transition(all, 0.5s, ease); &.move--right { @include translate3d(290px, 0, 0); &:before { @@ -728,6 +739,9 @@ } } @media screen and (max-width: 480px) { + .tip-overlay.tip-overlay--sidebar { + min-height: 350px; + } .modal { .modal-body { max-height: 70%; @@ -795,4 +809,4 @@ font-size: 2em; } } -}
\ No newline at end of file +} diff --git a/web/sass-files/sass/partials/_search.scss b/web/sass-files/sass/partials/_search.scss index 0d9d7b50d..cb125bff0 100644 --- a/web/sass-files/sass/partials/_search.scss +++ b/web/sass-files/sass/partials/_search.scss @@ -18,6 +18,12 @@ z-index: 5; cursor: pointer; } + +.search-item-snippet { + @include clearfix; + text-overflow: ellipsis; +} + .sidebar__collapse { cursor: pointer; z-index: 5; @@ -134,7 +140,8 @@ } .search-item-time { - color: #a8adb7; + @include opacity(0.7); + font-size: 0.9em; } .search-results-none { diff --git a/web/sass-files/sass/partials/_settings.scss b/web/sass-files/sass/partials/_settings.scss index 473ffb28d..bd47ca960 100644 --- a/web/sass-files/sass/partials/_settings.scss +++ b/web/sass-files/sass/partials/_settings.scss @@ -82,9 +82,8 @@ .nav { position: fixed; width: 179px; - &.absolute { - position: absolute; - top: 0; + &.position--top { + top: 57px; } } .security-links { @@ -141,144 +140,167 @@ width: 29px; } } - .premade-themes { - margin-bottom: 10px; - .theme-label { - font-weight: 400; - margin-top: 5px; - } - img { - border: 3px solid transparent; + .group--code { + select { + padding-right: 25px; } - .active { - img { - border-color: $primary-color; - } + &:before { + position: absolute; + top: 11px; + right: 50px; + z-index: 5; + content: "\f0d7"; + display: inline-block; + font: normal normal normal 14px/1 FontAwesome; + font-size: inherit; + text-rendering: auto; + -webkit-font-smoothing: antialiased; + -moz-osx-font-smoothing: grayscale; } + select { + -moz-appearance:none; + -webkit-appearance:none; + appearance:none; + } + } + .premade-themes { + margin-bottom: 10px; + .theme-label { + font-weight: 400; + margin-top: 5px; } - .custom-label { - font-weight: normal; - font-size: 13px; - width: 100%; - overflow: hidden; - text-overflow: ellipsis; - margin-bottom: 0; - } - .input-group-addon { - background: transparent; + img { + border: 3px solid transparent; } - .radio { - label { - font-weight: 600; + .active { + img { + border-color: $primary-color; } } } - - .section-title { - margin-bottom: 5px; - font-weight: 600; + .custom-label { + font-weight: normal; + font-size: 13px; + width: 100%; + overflow: hidden; + text-overflow: ellipsis; + margin-bottom: 0; } - - .section-edit { - text-align: right; - margin-bottom: 5px; - .fa { - margin-right: 5px; - font-size: 12px; - @include opacity(0.5); - display: none; + .input-group-addon { + background: transparent; + } + .radio { + label { + font-weight: 600; } } + } - .section-describe { - @include opacity(0.7); - white-space:pre; - } + .section-title { + margin-bottom: 5px; + font-weight: 600; + } - .divider-dark { - border-bottom:1px solid #aaaaaa; + .section-edit { + text-align: right; + margin-bottom: 5px; + .fa { + margin-right: 5px; + font-size: 12px; + @include opacity(0.5); + display: none; } + } - .divider-light { - border-bottom:1px solid lightgrey; - } + .section-describe { + @include opacity(0.7); + white-space:pre; + } - .setting-list { - padding: 0; - list-style-type:none; - } + .divider-dark { + border-bottom:1px solid #aaaaaa; + } - .setting-list__hint { - margin-top: 20px; - } + .divider-light { + border-bottom:1px solid lightgrey; + } - .mentions-input { - margin-top: 10px; - } + .setting-list { + padding: 0; + list-style-type:none; + } - .setting-list-item { - margin-top:7px; - } - .has-error { - color: #a94442; - } + .setting-list__hint { + margin-top: 20px; + } - .file-status { - font-size: 13px; - margin-top: 8px; - color: #555; - } + .mentions-input { + margin-top: 10px; + } - .confirm-import { - padding: 4px 10px; - margin: 10px 0; - } + .setting-list-item { + margin-top:7px; + } + .has-error { + color: #a94442; + } + .file-status { + font-size: 13px; + margin-top: 8px; + color: #555; } + + .confirm-import { + padding: 4px 10px; + margin: 10px 0; + } + } - .nav-pills { - > li { - margin: 0; +} +.nav-pills { + > li { + margin: 0; + a { + border-radius: 0; + color: #777; + } + .glyphicon { + width: 25px; + top: 2px; + } + &:hover { a { - border-radius: 0; - color: #777; + background: #E6F2FA; } - .glyphicon { - width: 25px; - top: 2px; - } - &:hover { - a { - background: #E6F2FA; + } + &.active { + a { + color: #111; + background-color: #E1E1E1; + &:before { + content: ''; + position: absolute; + top: 0; + left: 0; + width: 5px; + height: 100%; + background: #000; } } - &.active { - a { - color: #111; - background-color: #E1E1E1; - &:before { - content: ''; - position: absolute; - top: 0; - left: 0; - width: 5px; - height: 100%; - background: #000; - } - } - a, a:hover, a:focus { - padding-right: 10px; - background-color: rgba(black, 0.1); - border-radius: 0; - font-weight: 400; - position: relative; - } + a, a:hover, a:focus { + padding-right: 10px; + background-color: rgba(black, 0.1); + border-radius: 0; + font-weight: 400; + position: relative; } } } - h3 { - font-size: em(20px); - } +} +h3 { + font-size: em(20px); +} } .channel-settings { diff --git a/web/sass-files/sass/partials/_sidebar--right.scss b/web/sass-files/sass/partials/_sidebar--right.scss index e39f7730b..f40a50b03 100644 --- a/web/sass-files/sass/partials/_sidebar--right.scss +++ b/web/sass-files/sass/partials/_sidebar--right.scss @@ -7,13 +7,7 @@ right: 0px; padding: 0; background: #fff; - @include single-transition(transform, 0.5s, ease); @include translateX(400px); - - &.move--left { - @include translateX(0); - } - .post-body { img { diff --git a/web/sass-files/sass/partials/_tutorial.scss b/web/sass-files/sass/partials/_tutorial.scss index 9e5e1ad7a..20a15441e 100644 --- a/web/sass-files/sass/partials/_tutorial.scss +++ b/web/sass-files/sass/partials/_tutorial.scss @@ -32,6 +32,14 @@ &.tip-overlay--sidebar { max-width: 75%; margin: 50px 0 0 10px; + min-height: 310px; + .tutorial__footer { + position: absolute; + width: 100%; + bottom: 20px; + left: 0; + padding: 0 20px; + } .arrow { top: 80px; left: -10px; |