From f6b4a611d0ef28d5f08959a51c31ad480df1883a Mon Sep 17 00:00:00 2001 From: Asaad Mahmood Date: Tue, 14 Jun 2016 22:53:47 +0500 Subject: Multiple UI improvements (#3317) Removing break all Replacing jquery selectors and some other UI improvements Removing jquery selector --- webapp/sass/layout/_headers.scss | 165 +++++++++++++++++----------------- webapp/sass/layout/_post.scss | 17 ++-- webapp/sass/layout/_sidebar-menu.scss | 9 +- 3 files changed, 100 insertions(+), 91 deletions(-) (limited to 'webapp/sass/layout') diff --git a/webapp/sass/layout/_headers.scss b/webapp/sass/layout/_headers.scss index db2ba48bd..d0ccfbe23 100644 --- a/webapp/sass/layout/_headers.scss +++ b/webapp/sass/layout/_headers.scss @@ -2,6 +2,87 @@ .channel-header { @include flex(0 0 56px); + border-left: none; + font-size: 14px; + line-height: 56px; + width: 100%; + + .member-popover__trigger { + cursor: pointer; + padding-right: 10px; + text-align: right; + width: 60px; + + .fa { + font-size: 16px; + margin-left: 4px; + } + } + + &.alt { + margin: 0; + + th { + font-weight: normal !important; + } + + td { + border: none; + } + } + + th { + text-align: center; + + &:first-child { + border-left: none; + padding-left: 15px; + padding-right: 1em; + text-align: left !important; + width: 100%; + } + + &:last-child { + width: 8.9%; + } + } + + td { + font-size: 13px; + padding: 5px 25px 5px !important; + text-align: center !important; + + &:first-child { + text-align: left !important; + } + } + + .heading { + display: inline-block; + font-size: 1.3em; + font-weight: 600; + margin: 0 4px 0 0; + max-width: 100%; + overflow: hidden; + text-overflow: ellipsis; + vertical-align: middle; + } + + .caret { + margin-top: 3px; + } + + .more { + color: #81848b; + display: inline-block; + font-size: 13px; + text-transform: capitalize; + vertical-align: top; + } + + .disabled { + color: #999999; + } } .row { @@ -256,90 +337,6 @@ } } -.channel-header { - border-left: none; - font-size: 14px; - line-height: 56px; - width: 100%; - - #member_popover { - color: #999999; - cursor: pointer; - width: 50px; - - .fa { - font-size: 16px; - margin-left: 4px; - } - } - - &.alt { - margin: 0; - - th { - font-weight: normal !important; - } - - td { - border: none; - } - } - - th { - text-align: center; - - &:first-child { - border-left: none; - padding-left: 15px; - padding-right: 1em; - text-align: left !important; - width: 100%; - } - - &:last-child { - width: 8.9%; - } - } - - td { - font-size: 13px; - padding: 5px 25px 5px !important; - text-align: center !important; - - &:first-child { - text-align: left !important; - } - } - - .heading { - color: #555555; - display: inline-block; - font-size: 1.3em; - font-weight: 600; - margin: 0 4px 0 0; - max-width: 100%; - overflow: hidden; - text-overflow: ellipsis; - vertical-align: middle; - } - - .caret { - margin-top: 3px; - } - - .more { - color: #81848b; - display: inline-block; - font-size: 13px; - text-transform: capitalize; - vertical-align: top; - } - - .disabled { - color: #999999; - } -} - .channel-header__navbar { font-size: 16px; diff --git a/webapp/sass/layout/_post.scss b/webapp/sass/layout/_post.scss index db64d739e..228efe26f 100644 --- a/webapp/sass/layout/_post.scss +++ b/webapp/sass/layout/_post.scss @@ -486,7 +486,6 @@ body.ios { &.post--compact { &.post--thread { .post__header { - height: 22px; padding-top: 3px; } } @@ -510,6 +509,10 @@ body.ios { margin: 0 0 7px; } + .post__header { + height: 22px; + } + .post__body { background: transparent !important; line-height: 1.6; @@ -537,10 +540,6 @@ body.ios { } } - .post-image__columns { - clear: both; - } - .post-image__column { @include border-radius(2px); font-size: .9em; @@ -765,8 +764,15 @@ body.ios { @include clearfix; max-width: 200px; text-overflow: ellipsis; + vertical-align: top; white-space: nowrap; } + + strong { + display: none; + font-weight: 900; + margin-left: 2px; + } } .col__reply { @@ -1036,6 +1042,7 @@ body.ios { display: inline-block; margin-right: 6px; visibility: hidden; + svg { fill: inherit; position: relative; diff --git a/webapp/sass/layout/_sidebar-menu.scss b/webapp/sass/layout/_sidebar-menu.scss index 0cf60f328..97ab487c0 100644 --- a/webapp/sass/layout/_sidebar-menu.scss +++ b/webapp/sass/layout/_sidebar-menu.scss @@ -68,13 +68,18 @@ line-height: 40px; padding: 0 15px; - .fa, - .glyphicon { + .icon { + display: inline-block; left: -5px; position: relative; text-align: center; width: 25px; } + + .mentions { + font-size: 17px; + font-weight: bold; + } } } } -- cgit v1.2.3-1-g7c22