diff options
author | Christopher Speller <crspeller@gmail.com> | 2016-03-14 08:50:46 -0400 |
---|---|---|
committer | Christopher Speller <crspeller@gmail.com> | 2016-03-16 18:02:55 -0400 |
commit | 12896bd23eeba79884245c1c29fdc568cf21a7fa (patch) | |
tree | 4e7f83d3e2564b9b89d669e9f7905ff11768b11a /web/sass-files/sass/layout | |
parent | 29fe6a3d13c9c7aa490fffebbe5d1b5fdf1e3090 (diff) | |
download | chat-12896bd23eeba79884245c1c29fdc568cf21a7fa.tar.gz chat-12896bd23eeba79884245c1c29fdc568cf21a7fa.tar.bz2 chat-12896bd23eeba79884245c1c29fdc568cf21a7fa.zip |
Converting to Webpack. Stage 1.
Diffstat (limited to 'web/sass-files/sass/layout')
-rw-r--r-- | web/sass-files/sass/layout/_content.scss | 85 | ||||
-rw-r--r-- | web/sass-files/sass/layout/_footer.scss | 30 | ||||
-rw-r--r-- | web/sass-files/sass/layout/_forms.scss | 66 | ||||
-rw-r--r-- | web/sass-files/sass/layout/_headers.scss | 370 | ||||
-rw-r--r-- | web/sass-files/sass/layout/_markdown.scss | 116 | ||||
-rw-r--r-- | web/sass-files/sass/layout/_module.scss | 13 | ||||
-rw-r--r-- | web/sass-files/sass/layout/_navigation.scss | 137 | ||||
-rw-r--r-- | web/sass-files/sass/layout/_post-right.scss | 155 | ||||
-rw-r--r-- | web/sass-files/sass/layout/_post.scss | 997 | ||||
-rw-r--r-- | web/sass-files/sass/layout/_sidebar-left.scss | 197 | ||||
-rw-r--r-- | web/sass-files/sass/layout/_sidebar-menu.scss | 72 | ||||
-rw-r--r-- | web/sass-files/sass/layout/_sidebar-right.scss | 129 | ||||
-rw-r--r-- | web/sass-files/sass/layout/_webhooks.scss | 37 |
13 files changed, 0 insertions, 2404 deletions
diff --git a/web/sass-files/sass/layout/_content.scss b/web/sass-files/sass/layout/_content.scss deleted file mode 100644 index 71bef0d7f..000000000 --- a/web/sass-files/sass/layout/_content.scss +++ /dev/null @@ -1,85 +0,0 @@ -@charset 'UTF-8'; - -.inner-wrap { - &.move--left { - .search-bar__container { - display: none; - } - } - - &.move--right { - .search-bar__container { - display: none; - } - } -} - -.app__content { - height: 100%; - padding-top: 50px; - margin-left: 220px; - position: relative; - background: #fff; - @include display-flex; - @include flex-direction(column); - - .channel__wrap & { - padding-top: 0; - } -} -#post-create { - @include flex(0 0 auto); - background: #fff; - width: 100%; - z-index: 3; -} - -#archive-link-home { - @include flex(0 0 auto); - cursor: pointer; - padding: 10px 20px; - font-size: 13px; - - .fa { - font-size: 11px; - @include opacity(.7); - } - - a { - color: inherit; - } -} - -.post-list { - .new-messages-hr { - margin-top: 5px; - margin-bottom: 0px; - border: 0; - border-top: 1px solid #f80; - } - - .new-messages-text { - margin-top: 2px; - margin-bottom: 5px; - color: #f80; - text-align: center; - } -} - -.new-messages-hr { - margin-top: 5px; - margin-bottom: 0px; - border: 0; - border-top: 1px solid #f80; -} - -.new-messages-text { - margin-top: 2px; - margin-bottom: 5px; - color: #f80; - text-align: center; -} - -.delete-message-text { - margin-top: 10px; -} diff --git a/web/sass-files/sass/layout/_footer.scss b/web/sass-files/sass/layout/_footer.scss deleted file mode 100644 index 5624e6376..000000000 --- a/web/sass-files/sass/layout/_footer.scss +++ /dev/null @@ -1,30 +0,0 @@ -@charset 'UTF-8'; - -.footer-pane { - background: #eee; - padding-bottom: 1em; - - .footer-link { - padding: 0 1.5em; - - &.copyright { - color: #999; - padding-right: 0; - } - } - - .footer-site-name { - padding: 1.5em 0 1em; - font-size: 14px; - font-weight: bold; - text-transform: uppercase; - } -} - -.footer, -.footer-pane, -.footer-push { - height: 89px; -} - - diff --git a/web/sass-files/sass/layout/_forms.scss b/web/sass-files/sass/layout/_forms.scss deleted file mode 100644 index 1f51603cc..000000000 --- a/web/sass-files/sass/layout/_forms.scss +++ /dev/null @@ -1,66 +0,0 @@ -@charset 'UTF-8'; - -.form-horizontal { - .modal-intro { - margin: -10px 0 30px; - } - - .form__label { - text-align: left; - padding-right: 3px; - font-weight: 600; - font-size: 1.1em; - - &.light { - font-weight: normal; - color: #999; - font-size: 1.05em; - font-style: italic; - padding-top: 2px; - } - } - - .input__help { - color: inherit; - margin: 10px 0 0 10px; - word-break: break-word; - @include opacity(.8); - - &.dark { - @include opacity(1); - } - - &.error { - color: #a94442; - } - } - - .form-control { - font-weight: normal; - } - - .form-group { - margin-bottom: 25px; - - &.less { - margin-bottom: 10px; - } - } -} - -.help-block { - font-size: .95em; - margin: 10px 0 0; - color: #999; -} - -.disabled-input { - background-color: #ddd !important; -} - -.form-group { - &.form-group--small { - margin-bottom: 10px; - } -} - diff --git a/web/sass-files/sass/layout/_headers.scss b/web/sass-files/sass/layout/_headers.scss deleted file mode 100644 index 0a6b9f920..000000000 --- a/web/sass-files/sass/layout/_headers.scss +++ /dev/null @@ -1,370 +0,0 @@ -@charset 'UTF-8'; - -#channel-header { - @include flex(0 0 56px); -} - -.row { - &.header { - position: relative; - - .channel__wrap & { - display: none; - } - } -} - -.header-dropdown__icon { - font-size: 11px; - color: inherit; - top: 3px; -} - -.channel-header__info { - display: table; - table-layout: fixed; - width: 100%; - - > div { - display: block; - white-space: nowrap; - word-break: break-word; - - &.dropdown { - max-width: 100%; - padding-right: 1em; - float: left; - - .header-dropdown__icon { - color: #777; - } - - a { - text-decoration: none; - } - - .modal { - white-space: normal; - } - } - - &.description { - overflow: hidden; - text-overflow: ellipsis; - margin-top: 2px; - max-height: 45px; - .markdown-inline-img { - max-height: 45px; - } - } - - &.popover { - white-space: normal; - } - } -} - -.channel-intro { - margin: 0 auto 35px; - padding: 0 1em 5px; - max-width: 1000px; - border-bottom: 1px solid lightgrey; - - .intro-links { - margin: 0 1.5em 10px 0; - display: inline-block; - - .fa { - margin-right: 5px; - } - } - - .channel-intro-profile { - margin-top: 5px; - margin-left: 63px; - } - - .channel-intro-img { - float: left; - img { - @include border-radius(100px); - } - } - - .channel-intro__title { - font-weight: 600; - font-size: 20px; - margin-bottom: 15px; - } - - .channel-intro__content { - background: #f7f7f7; - padding: 10px 15px; - @include border-radius(3px); - } - .channel-intro-text { - margin-top: 35px; - } -} - -// Team Header in Sidebar -.sidebar--left, -.sidebar--menu { - .team__header { - position: relative; - padding: 9px 10px; - @include legacy-pie-clearfix; - - &:before { - @include single-transition(all, .05s, linear); - content: ''; - background: none; - top: 0; - left: 0; - width: 100%; - height: 100%; - position: absolute; - } - - &:hover { - &:before { - background: rgba(black, .1); - } - - .user__name { - color: #fff; - } - - .navbar-right { - .dropdown-toggle { - @include opacity(1); - } - } - } - - .navbar-right { - font-size: .85em; - position: absolute; - top: 10px; - right: 22px; - z-index: 5; - - .dropdown-toggle { - @include single-transition(all, .1s, linear); - padding: 10px; - @include opacity(.8); - } - - .dropdown-menu { - li a { - padding: 3px 20px; - text-overflow: ellipsis; - overflow: hidden; - } - } - - .dropdown__icon { - fill: #fff; - } - } - - .settings__link a:hover, - a:visited, - a:link, - a:active { - text-decoration: none; - } - - .user__picture { - width: 36px; - height: 36px; - float: left; - @include border-radius(36px); - margin-right: 6px; - } - - .header__info { - color: #fff; - @include clearfix; - padding-left: 2px; - z-index: 1; - position: relative; - } - - .team__name, - .user__name { - display: block; - font-weight: 600; - font-size: 16px; - max-width: 85%; - overflow: hidden; - white-space: nowrap; - text-overflow: ellipsis; - text-decoration: none; - } - - .team__name { - line-height: 22px; - margin-top: -2px; - float: left; - } - - .user__name { - @include single-transition(all, .1s, linear); - font-size: 14px; - line-height: 18px; - font-weight: 400; - color: #eee; - color: rgba(#fff, .8); - } - - > .nav { - > li { - > a { - float: right; - background: none !important; - padding: 2px; - - &.dropdown-toggle { - line-height: 1.8; - font-size: 1em; - color: #fff; - } - } - } - } - } - .search__clear { - display: none; - } -} - -#navbar { - .navbar-default { - .navbar-toggle { - &.menu-toggle { - padding: 0 1em; - } - } - } -} - -.channel-header { - width: 100%; - border-left: none; - font-size: 14px; - line-height: 56px; - - #member_popover { - width: 50px; - color: #999; - cursor: pointer; - - .fa { - margin-left: 4px; - font-size: 16px; - } - } - - &.alt { - margin: 0; - th { - font-weight: normal !important; - } - td { - border: none; - } - } - - th { - text-align: center; - &:first-child { - text-align: left !important; - border-left: none; - width: 100%; - padding-left: 1em; - } - &:last-child { - width: 8.9%; - } - } - - td { - padding: 5px 25px 5px !important; - font-size: 13px; - text-align: center !important; - &:first-child { - text-align: left !important; - } - } - - .heading { - margin: 0; - color: #555; - font-size: 1.3em; - font-weight: 600; - overflow: hidden; - text-overflow: ellipsis; - max-width: 100%; - display: inline-block; - vertical-align: middle; - margin-right: 4px; - } - - .caret { - margin-top: 3px; - } - - .more { - color: #81848b; - display: inline-block; - vertical-align: top; - text-transform: capitalize; - font-size: 13px; - } - - .disabled { - color: #999; - } -} - -.channel-header__navbar { - font-size: 16px; - - .heading { - margin-right: 3px; - } - - .header-dropdown__icon { - top: 1px; - } -} - -.channel-header__links { - font-family: 'Open Sans', sans-serif; - height: 30px; - width: 24px; - line-height: 26px; - margin-right: 9px; - font-size: 22px; - - .channel__wrap.move--left & { - position: absolute; - right: -400px; - top: 14px; - } - - > a { - color: inherit; - text-decoration: none; - @include opacity(.6); - @include single-transition(all, .1s, ease-in); - - &:hover { - @include opacity(1); - } - &:focus { - color: inherit; - } - } -} diff --git a/web/sass-files/sass/layout/_markdown.scss b/web/sass-files/sass/layout/_markdown.scss deleted file mode 100644 index 307060ac3..000000000 --- a/web/sass-files/sass/layout/_markdown.scss +++ /dev/null @@ -1,116 +0,0 @@ -@charset 'UTF-8'; - -.markdown__heading { - font-weight: 700; - line-height: 1.5; -} - -.markdown__paragraph-inline { - display: inline; - - + .markdown__paragraph-inline { - margin-left: 4px; - } -} - -#post-list { - .markdown-inline-img { - -moz-force-broken-image-icon: 1; - max-height: 500px; - height: 500px; - } -} - -.post-body--code { - position: relative; - - pre { - margin-bottom: 0; - word-break: normal; - overflow: auto; - word-wrap: normal; - } -} - -.post-body--code__language { - -webkit-transform: translate3d(0,0,0); - position: absolute; - top: 0; - right: 0; - color: #fff; - background: #21586d; - padding: 4px 10px 5px 10px; - font-size: 13px; - opacity: .7; - z-index: 5; -} - -.post__body { - hr { - height: 4px; - padding: 0; - margin: 15px 0 16px; - background-color: #e7e7e7; - border: 0 none; - @include opacity(.2); - } - - code { - white-space: pre; - } - - .codespan__pre-wrap { - code { - white-space: pre-wrap; - } - } -} - -.markdown__table { - background: #fff; - margin: 5px 0 10px; - - th, - td { - padding: 6px 13px; - border: 1px solid #ddd; - } - - tbody tr { - background: #fff; - - &:nth-child(2n) { - background-color: #f8f8f8; - } - } -} -blockquote { - border: none; - position: relative; - font-size: 16px; - padding: 10px 10px 10px 38px; - margin-bottom: 0; - - &:before { - font-family: FontAwesome; - font-weight: normal; - font-style: normal; - display: inline-block; - text-decoration: inherit; - content: '\f10d'; - left: 8px; - top: 5px; - position: absolute; - font-size: 20px; - @include opacity(.6); - } -} -pre { - border: none; - margin: 5px 0; - color: inherit; -} -code { - background: #fff; - color: inherit; -} diff --git a/web/sass-files/sass/layout/_module.scss b/web/sass-files/sass/layout/_module.scss deleted file mode 100644 index 39ab2c6f8..000000000 --- a/web/sass-files/sass/layout/_module.scss +++ /dev/null @@ -1,13 +0,0 @@ -// Only for combining all the files in this folder -@import 'content'; -@import 'footer'; -@import 'forms'; -@import 'headers'; -@import 'markdown'; -@import 'navigation'; -@import 'post'; -@import 'post-right'; -@import 'sidebar-left'; -@import 'sidebar-menu'; -@import 'sidebar-right'; -@import 'webhooks'; diff --git a/web/sass-files/sass/layout/_navigation.scss b/web/sass-files/sass/layout/_navigation.scss deleted file mode 100644 index 65c62cb17..000000000 --- a/web/sass-files/sass/layout/_navigation.scss +++ /dev/null @@ -1,137 +0,0 @@ -@charset 'UTF-8'; - -.nav > li > a:focus, -.nav > li > a:hover { - background: transparent; -} - -#navbar { - input { - margin: 0px 5px 0px 2px; - } - - .navbar-default { - position: absolute; - border: none; - min-height: 45px; - background: $color--primary; - - .navbar-nav { - > li { - > a { - height: 45px; - padding: 0 1.3em; - - i { - line-height: 45px; - } - } - } - } - - .navbar-toggle { - width: 43px; - float: left; - border-color: transparent; - border-radius: 0; - margin: 0; - padding: 0 10px; - line-height: 48px; - height: 44px; - z-index: 5; - fill: #fff; - - .icon-bar { - background: #fff; - width: 21px; - } - - .glyphicon-search { - top: -1px; - } - - .icon--white { - color: #fff; - } - - &:hover, - &:active, - &:focus { - background: inherit; - } - } - - .navbar-brand { - padding: 0 .5em; - height: 45px; - line-height: 45px; - float: none; - font-size: 16px; - - .heading { - margin-right: 3px; - font-weight: 600; - color: #fff; - } - - .header-dropdown__icon { - top: 1px; - } - - .dropdown-toggle { - color: #fff; - } - - .description { - display: inline-block; - margin-right: .5em; - color: #fff; - - &.info-popover { - width: 19px; - height: 19px; - background: url('../images/info__icon.png'); - @include background-size(100% 100%); - vertical-align: middle; - top: -1px; - position: relative; - cursor: pointer; - } - } - } - } - - .sidebar-channel { - white-space: nowrap; - overflow: hidden; - text-overflow: ellipsis; - - span { - white-space: nowrap; - margin-left: 2px; - } - } - - .channel-create-btn { - margin-right: 15px; - } - - .more-channel-table { - width: 100%; - border: 1px solid #dbdbdc; - td { - padding: 7px; - } - button { - width: 110px; - } - } -} - -.badge-notify { - background: red; - position: absolute; - left: 4px; - top: 3px; - z-index: 100; -} diff --git a/web/sass-files/sass/layout/_post-right.scss b/web/sass-files/sass/layout/_post-right.scss deleted file mode 100644 index 595577564..000000000 --- a/web/sass-files/sass/layout/_post-right.scss +++ /dev/null @@ -1,155 +0,0 @@ -@charset 'UTF-8'; - -.post-right__container { - @include display-flex; - @include flex-direction(column); - height: 100%; - - .post-right-root-message { - padding: 1em 1em 0; - } - - .post-right-comments-container { - position: relative; - - .post { - &:first-child { - padding-top: 15px; - } - } - } - - - .help_format_text { - bottom: -63px; - right: auto; - } - - .post { - &.post--root { - padding-bottom: 1.2em; - border-bottom: 1px solid #ddd; - - .post__body { - background: transparent !important; - } - } - - .post__header { - .col__reply { - top: 0; - text-align: right; - } - } - - .post__body { - width: 100%; - } - } - - hr { - margin-bottom: 0; - border: none; - } - - .post-create__container { - width: 100%; - margin-top: 10px; - - .textarea-wrapper { - min-height: 100px; - } - - .btn { - margin-bottom: 10px; - } - - .custom-textarea { - min-height: 100px; - } - - .msg-typing { - @include opacity(.7); - float: left; - margin-top: 3px; - font-size: 13px; - line-height: 20px; - min-width: 1px; - display: block; - height: 20px; - max-width: 230px; - } - - .post-create-footer { - width: 100%; - padding: 5px 0 10px; - } - - .post-right-comments-upload-in-progress { - padding: 6px 0; - color: #a8adb7; - margin-right: 10px; - } - } -} -.post-right-header { - font-size: 1em; - text-transform: uppercase; - color: #999; - font-weight: 400; - color: #888; - height: 39px; - padding: 10px 10px 0 15px; - border-bottom: $border-gray; -} - -.post-right-root-container { - padding: 5px 10px; - border-bottom: $border-gray; -} - -.post-right-root-container { - ul { - padding-left: 0; - margin-bottom: 2px; - } -} - -.post-right-channel__name { - font-weight: 600; - margin: 0 0 10px 0; -} - -.post-right-root-container li { - display: inline; - list-style-type: none; - padding-right: 3px; -} - -.post-right-root-time { - color: #a8adb7; -} - -.post-right-create-comment-container { - padding: 5px; - margin-bottom: 18px; - position: absolute; - bottom: 0; - left: 0; - width: 100%; -} - -.post-right__scroll { - position: relative; - overflow: auto; - -webkit-overflow-scrolling: touch; - @include flex(1 1 auto); - - .file-preview__container { - margin-top: 5px; - } -} - -.post-right-comment-time { - color: #a8adb7; -} diff --git a/web/sass-files/sass/layout/_post.scss b/web/sass-files/sass/layout/_post.scss deleted file mode 100644 index ce055035d..000000000 --- a/web/sass-files/sass/layout/_post.scss +++ /dev/null @@ -1,997 +0,0 @@ -@charset 'UTF-8'; - -.custom-textarea { - white-space: pre-wrap; - word-wrap: break-word; - background: transparent; - border: 1px solid #ccc; - position: absolute; - top: 0px; - height: auto; - resize: none; - line-height: 20px; - min-height: 36px; - overflow-x: hidden; - &:focus { - border-color: #ccc; - box-shadow: none; - } -} - -.bad-connection { - background: #ffffac !important; - color: #d04444 !important; -} - -.textarea-div { - white-space: pre-wrap; - word-wrap: normal; - color: rgba(0,0,0,0); - position: absolute; - top: 0px; - word-break: break-word; - left: 1px; - line-height: 20px; - min-height: 36px; - height: auto; - border: 0; -} - -body.ios { - .textarea-div { - padding: 7px 17px 7px 15px; - -webkit-overflow-scrolling: auto; - } -} - -.textarea-div::-webkit-scrollbar { - display: none; -} - -.textarea-wrapper { - position: relative; - .textbox-preview-area { - position: absolute; - z-index: 2; - top: 0; - left: 0; - box-shadow: none; - white-space: normal; - } - .help__text { - right: 0; - position: absolute; - z-index: 3; - bottom: -23px; - font-size: 13px; - cursor: pointer; - } - .textbox-preview-link { - margin-right: 8px; - } - min-height: 36px; -} - -.help_format_text { - display: none !important; - position: absolute; - bottom: -23px; - left: 0px; - overflow: hidden; - text-overflow: ellipsis; - font-size: .85em; - @include opacity(0); - @include single-transition(all .2s ease); - - b, - i, - code { - margin-right: 3px; - } - .textbox-preview-link { - font-size: 13px; - cursor: pointer; - margin-left: 15px; - } -} - -.date-separator, -.new-separator { - text-align: center; - height: 2em; - margin: 0; - position: relative; - z-index: 0; - &:before, - &:after { - content: ''; - height: 1em; - position: absolute; - left: 0; - width: 100%; - display: none; - } - &:before { - bottom: 0; - } - &:after { - top: 0; - } - &.hovered--after { - &:before { - background: #f5f5f5; - display: block; - } - } - &.hovered--before { - &:after { - background: #f5f5f5; - display: block; - } - } - .separator__hr { - border-color: #ccc; - margin: 0; - position: relative; - z-index: 5; - top: 1em; - } - .separator__text { - line-height: 2em; - color: #555; - background: #fff; - display: inline-block; - padding: 0 1em; - font-weight: 700; - @include border-radius(50px); - position: relative; - z-index: 5; - font-size: 13px; - } -} -.new-separator { - .separator__hr { - border-color: #ffaf53; - } - .separator__text { - color: #f80; - font-weight: normal; - } -} - -.file-overlay { - position: absolute; - top: 0; - left: 0; - width: 100%; - height: 100%; - text-align: center; - color: #fff; - font-size: em(20px); - font-weight: 600; - z-index: 6; - - .overlay__indent { - background-color: rgba(0, 0, 0, .6); - position: relative; - height: 100%; - @include clearfix; - } - - &.center-file-overlay { - .overlay__indent { - margin-left: 220px; - } - } - - &.right-file-overlay { - font-size: em(18px); - .overlay__circle { - width: 300px; - height: 300px; - margin: -150px 0 0 -150px; - } - .overlay__files { - margin: 60px auto 15px; - width: 150px; - } - } - - .overlay__circle { - background: #111; - background: rgba(black, .7); - width: 370px; - height: 370px; - margin: -185px 0 0 -185px; - @include border-radius(500px); - position: absolute; - top: 50%; - left: 50%; - pointer-events: none; - } - - .overlay__files { - display: block; - margin: 75px auto 20px; - } - - .overlay__logo { - position: absolute; - left: 50%; - bottom: 30px; - margin-left: -50px; - @include opacity(.3); - } - - .fa { - display: inline-block; - font-size: 1.1em; - margin-right: 8px; - } -} - -#post-list { - @include flex(1 1 auto); - position: relative; - overflow-y: hidden; - height: 100%; - - .inactive { - display: none; - } - - .post-list-holder-by-time { - background: #fff; - overflow-y: scroll; - width: 100%; - padding: 1em 0 0; - position: absolute; - height: 100%; - -webkit-overflow-scrolling: touch; - &.active { - display: inline; - } - } - - .more-messages-text { - margin: 5px 0 10px; - display: block; - text-align: center; - outline: none; - border: none; - font-size: 13px; - } - .beginning-messages-text { - margin-top: 2px; - margin-bottom: 5px; - display: block; - text-align: center; - color: grey; - } -} - -.post-list__timestamp { - position: absolute; - top: 8px; - left: 50%; - z-index: 50; - width: 120px; - text-align: center; - background: $color--primary; - color: #fff; - @include border-radius(3px); - font-size: 12px; - line-height: 25px; - margin-left: -60px; - -webkit-font-smoothing: initial; - @include single-transition(all, .6s, ease); - @include translateY(-45px); - @include opacity(0); - display: none; - - &.scrolling { - @include translateY(0); - @include opacity(.8); - } -} - -.post-list__arrows { - background-repeat: no-repeat; - width: 40px; - height: 40px; - text-align: center; - fill: #444; - position: absolute; - bottom: 0; - left: 9px; - z-index: 50; - @include opacity(0); - @include single-transition(all, .6s); - display: none; - - svg { - color: inherit; - width: 28px; - height: 28px; - } - - &.scrolling { - display: block; - @include opacity(1); - } -} - -.post-create__container { - form { - width: 100%; - padding: .5em 14px 0; - margin: 0 auto; - max-width: 1028px; - } - .post-create-body { - position: relative; - padding: 0 0 2px; - .post-body__cell { - vertical-align: top; - position: relative; - &.scroll { - .btn-file { - right: 15px; - } - .custom-textarea { - padding-right: 43px; - } - } - } - .send-button { - display: none; - cursor: pointer; - padding-right: 4px; - width: 45px; - height: 37px; - font-size: 18px; - line-height: 37px; - vertical-align: bottom; - text-align: center; - @include single-transition(all, .15s); - &:active { - @include opacity(.75); - } - } - .custom-textarea { - padding-top: 8px; - padding-right: 28px; - max-height: 162px !important; - line-height: 1.5; - } - .textarea-div { - padding-top: 8px; - padding-right: 30px; - max-height: 163px !important; - overflow: auto; - line-height: 1.5; - } - .btn-file { - right: 0; - position: absolute; - top: 1px; - color: #444; - @include opacity(.5); - @include single-transition(all, .15s); - font-size: 16px; - padding: 7px 9px 6px; - &:hover, - &:active { - @include opacity(.9); - box-shadow: none; - } - } - textarea { - box-shadow: none; - } - } - .post-create-footer { - @include clearfix; - padding: 3px 0 0 0; - font-size: 13px; - .control-label { - font-weight: normal; - margin-bottom: 0; - top: -5px; - position: relative; - } - } - .msg-typing { - display: block; - @include opacity(.7); - white-space: nowrap; - margin-bottom: 5px; - overflow: hidden; - font-size: .95em; - text-overflow: ellipsis; - height: 20px; - } -} - -.post-list__table { - display: table; - table-layout: fixed; - width: 100%; - min-height: 100%; - height: 100%; - .post-list__content { - display: table-cell; - vertical-align: bottom; - .dropdown-menu { - &.bottom { - top: auto; - bottom: 25px; - } - } - } -} - -.post { - word-wrap: break-word; - padding: 8px .5em 0 1em; - position: relative; - max-width: 100%; - @include legacy-pie-clearfix; - - &:hover { - .dropdown, - .comment-icon__container, - .post__reply, - .post__remove { - visibility: visible; - } - .permalink-icon { - visibility: visible; - } - } - - &.post--highlight { - background-color: beige; - } - - p { - margin: 0; - line-height: 1.6em; - font-size: .97em; - white-space: pre-wrap; - - &:last-child { - margin-bottom: .5em; - } - } - - span { - p:last-child { - margin-bottom: .5em; - } - } - - &.post--root { - .comment-icon__container { - visibility: visible; - } - } - - &.same--root { - &.same--user { - padding: 0 .5em 0 1em; - - &:hover { - .post__time { - @include opacity(.5); - } - } - - .post__header { - margin: 0; - height: 0; - - .col__name { - display: none; - } - - .col__reply { - top: 6px; - } - } - - .post__time { - top: 24px; - } - - .post__time { - font: normal normal normal FontAwesome; - text-rendering: auto; - -webkit-font-smoothing: antialiased; - -moz-osx-font-smoothing: grayscale; - position: absolute; - top: -2px; - left: -7px; - font-size: 11px; - line-height: 37px; - @include opacity(0); - } - } - - &.post--comment { - .post__link { - display: none; - } - - .post__img { - img { - display: none; - } - } - } - - &.post--comment { - .post__body { - border-left: 4px solid #ddd; - } - } - } - - &.other--root { - .comment-icon__container { - &.icon--show { - visibility: visible; - } - } - - &.post--comment { - .popover { - margin-top: 84px; - - > .arrow { - top: 21px !important; - } - } - - .post__header { - .col__reply { - top: 53px; - } - } - } - } - - .post__content { - margin: 0 auto; - position: relative; - max-width: 1000px; - display: table; - width: 100%; - table-layout: fixed; - - > div { - display: table-cell; - vertical-align: top; - } - } - - .post__header { - padding: 0; - list-style: none; - margin-bottom: 2px; - - li { - display: inline-block; - vertical-align: top; - } - - .col__name { - margin-right: 7px; - font-weight: 600; - - .user-popover { - max-width: 200px; - @include clearfix; - text-overflow: ellipsis; - white-space: nowrap; - } - } - - .col__reply { - position: absolute; - right: 0; - top: 30px; - width: 65px; - white-space: nowrap; - } - - .permalink-popover { - min-width: 0; - - .popover-content { - padding: 5px; - } - - .form-control, - .btn { - font-size: 13px; - height: 30px; - padding: 0 8px; - line-height: 30px; - } - } - } - - .post__img { - width: 46px; - img { - width: 36px; - height: 36px; - vertical-align: inherit; - @include border-radius(50px); - } - } - - .post__embed-container { - display: block; - max-height: 1000px; - transition: max-height .5s ease; - overflow: hidden; - &[hidden] { - max-height: 0; - } - } - - .dropdown { - display: inline-block; - visibility: hidden; - margin-right: 5px; - top: -1px; - - .dropdown-menu { - right: 0; - left: auto; - min-width: 130px; - padding: 2px 0; - - li { - display: block; - } - - a { - padding: 5px 15px; - } - } - } - - .post__dropdown { - &:after { - content: '[...]'; - top: -1px; - position: relative; - } - } - - .post__remove { - font-family: 'Open Sans', sans-serif; - position: relative; - display: inline-block; - vertical-align: top; - right: 15px; - top: -5px; - font-size: 20px; - width: 20px; - height: 20px; - line-height: 20px; - font-weight: 600; - visibility: hidden; - color: inherit; - @include opacity(.5); - text-decoration: none; - - &:hover { - @include opacity(.8); - } - } - - .post__body { - word-wrap: break-word; - padding: .2em .5em; - @include legacy-pie-clearfix; - width: calc(100% - 75px); - - p { - margin: 0 0 .4em; - } - - p + p { - margin-top: 1.4em; - } - - li { - > p { - margin-top: 10px; - } - } - - img { - max-height: 400px; - } - - ul, - ol { - margin-bottom: .4em; - - p { - margin-bottom: 0; - } - li ul, - li ol { - padding: 0 0 0 20px; - } - - li.list-item--task-list ul, - li.list-item--task-list ol { - margin-left: 20px; - } - - li.list-item--task-list ul { - padding-left: 0; - } - - li:not(.list-item--task-list) li.list-item--task-list, - li:not(.list-item--task-list) li.list-item--task-list ~ li { - margin-left: -20px; - } - - li input[type='checkbox']:disabled { - vertical-align: top; - cursor: default; - } - } - - ul li.list-item--task-list, - ul li.list-item--task-list ~ li { - list-style-type: none; - } - - ul li.list-item--task-list ~ li:not(.list-item--task-list) { - text-indent: 3px; - - &:before { - content: '⦁'; - margin-right: 8px; - } - } - } - - .post__link { - margin: 2px 0 5px; - font-size: 13px; - text-overflow: ellipsis; - overflow: hidden; - white-space: nowrap; - } - - .post__embed-visibility { - cursor: pointer; - font: normal normal normal 14px/1 FontAwesome; - text-rendering: auto; - -webkit-font-smoothing: antialiased; - -moz-osx-font-smoothing: grayscale; - margin: 5px 0 10px; - display: inline-block; - - &:hover { - text-decoration: none; - } - - &:before { - content: '\f065'; - font-size: 14px; - } - - &[data-expanded='true']:before { - content: '\f066'; - } - } - - .post__time { - font-size: .9em; - } - - .post__time, - &.post--system .post__body { - @include opacity(.6); - } - - .post-loading-gif { - height: 10px; - width: 10px; - margin-top: 6px; - } - - .post-fail { - color: #d58a8a; - } - - .post-waiting { - color: #999; - } - - .permalink-icon { - display: inline-block; - color: $color--primary; - visibility: hidden; - } - - .post__reply { - display: inline-block; - margin-right: 6px; - visibility: hidden; - svg { - width: 18px; - top: 3px; - fill: inherit; - position: relative; - } - } - - .comment-icon__container { - fill: $color--primary; - display: inline-block; - visibility: hidden; - - &:focus { - outline: none; - } - - &.icon--visible { - visibility: visible; - } - - svg { - height: 17px; - width: 17px; - } - - .comment-icon { - display: inline-block; - top: 2px; - position: relative; - margin-right: 3px; - fill: inherit; - } - - path { - fill: inherit; - } - } - - .web-embed-data { - padding: 2px 0 0 10px; - background: #f9f9f9; - background: rgba(0, 0, 0, .05); - @include border-radius(2px); - height: 50px; - overflow: hidden; - text-overflow: ellipsis; - .embed-title { - margin: 3px 0 1px; - color: #555; - font-weight: 600; - white-space: nowrap; - text-overflow: ellipsis; - overflow: hidden; - } - .embed-description { - margin: 0; - white-space: nowrap; - text-overflow: ellipsis; - overflow: hidden; - color: #888; - } - .embed-link { - display: none; - } - } -} - -.bot-indicator { - font-family: inherit; - font-size: 11px; - padding: 2px 4px; - border-radius: 2px; - font-weight: 600; - margin: 0 0 0 -4px; -} - -.attachment { - .attachment__content { - border-width: 1px; - border-style: solid; - border-radius: 4px; - padding: 2px 5px; - margin: 0 0 5px 0; - } - .attachment__thumb-pretext { - border: 0 none; - background: transparent; - } - .attachment__container { - border-left-width: 4px; - border-left-style: solid; - padding: 2px 0 2px 10px; - &.attachment__container--good { - border-left-color: #00c100; - } - &.attachment__container--warning { - border-left-color: #dede01; - } - &.attachment__container--danger { - border-left-color: #e40303; - } - } - .attachment__body { - float: left; - width: 80%; - padding-right: 5px; - overflow-x: auto; - overflow-y: hidden; - &.attachment__body--no_thumb { - width: 100%; - } - } - .attachment__text p:last-of-type { - display: inline-block; - } - .attachment__thumb-pretext { - margin-left: 5px; - } - .attachment__title { - margin: 5px 0; - padding: 0; - line-height: 16px; - height: 22px; - font-size: 16px; - a { - font-size: 16px; - } - } - .attachment__author-icon { - @include border-radius(50px); - margin-right: 5px; - width: 14px; - height: 14px; - } - .attachment__image { - max-width: 100%; - margin-bottom: 1em; - } - .attachment__thumb-container { - width: 20%; - float: right; - img { - max-height: 75px; - max-width: 100%; - } - } - .attachment___fields { - width: 100%; - .attachment___field-caption { - font-weight: 700; - } - .attachment___field p { - margin: 0; - } - } -} - -.permalink-text { - overflow: hidden; -} - -.permalink-popover { - min-width: 320px; - margin-left: 50px !important; -} diff --git a/web/sass-files/sass/layout/_sidebar-left.scss b/web/sass-files/sass/layout/_sidebar-left.scss deleted file mode 100644 index ece054a15..000000000 --- a/web/sass-files/sass/layout/_sidebar-left.scss +++ /dev/null @@ -1,197 +0,0 @@ -@charset 'UTF-8'; - -.sidebar--left { - position: absolute; - width: 220px; - left: 0; - height: 100%; - border-right: $border-gray; - background: #fafafa; - z-index: 5; - - &.sidebar--padded { - padding-top: 44px; - } - .dropdown-menu { - max-height: 400px; - overflow-x: hidden; - overflow-y: auto; - max-width: 200px; - width: 200px; - } - .search__form { - margin: 0; - padding: 1em 1em 0; - display: none; - } - .badge { - background-color: $color--primary; - position: absolute; - right: 10px; - top: 5px; - } - .status { - position: relative; - top: 1px; - margin-right: 6px; - width: 12px; - display: inline-block; - svg { - max-height: 14px; - } - i, - path, - ellipse { - @include opacity(.5); - &.online--icon, - &.away--icon { - @include opacity(1); - } - } - .fa-lock { - margin-left: 1px; - } - .fa-globe { - top: -1px; - position: relative; - } - } - .nav-pills__container { - height: calc(100% - 80px); - position: relative; - overflow: auto; - -webkit-overflow-scrolling: touch; - } - - .nav-pills__unread-indicator { - position: absolute; - left: 0; - right: 0; - width: 72%; - color: #fff; - background: #2389d7; - @include border-radius(50px); - margin: 0 auto; - padding: 3px 0 4px; - font-size: 13.5px; - text-align: center; - z-index: 1; - } - - .nav-pills__unread-indicator-top { - top: 66px; - } - .nav-pills__unread-indicator-bottom { - bottom: 20px; - } - - .nav { - &.nav-stacked { - > li + li { - margin: 0; - } - } - li { - > h4 { - font-size: 1em; - text-transform: uppercase; - margin: 1.1em 0 .5em; - font-weight: 400; - color: #aaa; - letter-spacing: -.3px; - padding: 0 10px 0 15px; - } - > a { - padding: 3px 10px 3px 25px; - line-height: 1.5; - border-radius: 0; - white-space: nowrap; - overflow: hidden; - text-overflow: ellipsis; - &.has-badge { - padding-right: 30px; - } - &.has-close { - padding-right: 30px; - &:hover { - .btn-close { - display: block; - @include opacity(.8); - } - } - .btn-close { - font-family: 'Open Sans', sans-serif; - position: absolute; - right: 15px; - top: -1px; - font-size: 20px; - font-weight: 600; - @include opacity(0); - display: none; - &:hover { - @include opacity(1); - } - } - } - &.nav-more { - text-decoration: underline; - } - &.unread-title { - font-weight: 600; - } - } - &.active { - a { - &:before { - content: ''; - position: absolute; - top: 0; - left: 0; - width: 5px; - height: 100%; - background: #000; - } - } - a, - a:hover, - a:focus { - background-color: rgba(black, .1); - border-radius: 0; - font-weight: 400; - position: relative; - } - } - } - } - .modal-title { - line-height: 2em; - } - - .add-channel-btn { - float: right; - outline: none; - margin: -2px 0 0 0; - color: #aaa; - padding: 0 5px; - text-decoration: none; - font-size: 22px; - line-height: 18px; - font-weight: 700; - &:hover { - color: #666; - } - } -} - -.channel-loading-gif { - height: 15px; - width: 15px; - margin-top: 2px; -} - -.join-channel-loading-gif { - margin-top: 5px; - margin-left: 10px; - height: 25px; - width: 25px; -} diff --git a/web/sass-files/sass/layout/_sidebar-menu.scss b/web/sass-files/sass/layout/_sidebar-menu.scss deleted file mode 100644 index 167b24ba0..000000000 --- a/web/sass-files/sass/layout/_sidebar-menu.scss +++ /dev/null @@ -1,72 +0,0 @@ -@charset 'UTF-8'; - -.sidebar--menu { - position: absolute; - width: 220px; - right: 0; - height: 100%; - border-right: $border-gray; - padding: 0 0 2em 0; - background: #fafafa; - display: none; - .nav-pills__container { - padding-top: 5px; - } - .team__header { - display: none; - padding: 0 15px; - @include legacy-pie-clearfix; - a { - color: #fff; - } - .navbar-right { - font-size: .85em; - margin: 16px -5px 0; - .dropdown-toggle { - padding: 0 10px; - } - .dropdown-menu { - li a { - padding: 3 20px; - color: #555; - } - } - .dropdown__icon { - background: url('../images/dropdown-icon.png'); - width: 4px; - height: 16px; - @include background-size(100% 100%); - display: inline-block; - } - } - .team__name { - float: left; - line-height: 50px; - font-weight: 600; - font-size: 1.2em; - max-width: 80%; - overflow: hidden; - white-space: nowrap; - text-overflow: ellipsis; - text-decoration: none; - } - } - .nav { - > li { - > a { - font-size: 15px; - background: none !important; - color: inherit; - line-height: 40px; - padding: 0 15px; - .fa, - .glyphicon { - width: 25px; - text-align: center; - left: -5px; - position: relative; - } - } - } - } -} diff --git a/web/sass-files/sass/layout/_sidebar-right.scss b/web/sass-files/sass/layout/_sidebar-right.scss deleted file mode 100644 index e1a7d7641..000000000 --- a/web/sass-files/sass/layout/_sidebar-right.scss +++ /dev/null @@ -1,129 +0,0 @@ -@charset 'UTF-8'; - -.sidebar--right { - position: fixed; - width: 400px; - height: 100%; - right: 0px; - padding: 0; - background: #fff; - @include translateX(400px); - - .post-body { - img { - max-height: 200px; - } - } - - .post { - .post__header { - .col__name { - .user-popover { - max-width: 130px; - } - } - } - } - - .sidebar--right__content { - height: 100%; - @include display-flex; - @include flex-direction(column); - } - - .sidebar--right__back { - color: inherit; - @include opacity(.8); - width: 30px; - text-align: center; - margin: 0 0 0 -14px; - font-size: 13px; - display: inline-block; - } - - .sidebar-right__body { - @include flex(1 1 auto); - border-left: $border-gray; - border-top: $border-gray; - @include display-flex; - @include flex-direction(column); - height: calc(100% - 56px); - @include border-radius(2px 0 0 0); - } - - .sidebar__overlay { - width: 100%; - height: 100%; - background-color: yellow; - @include opacity(.1); - position: absolute; - z-index: 5; - pointer-events: none; - } - - .input-group { - word-break: break-word; - } - - .sidebar--right__close { - margin: 11px 0 0 0; - width: 22px; - height: 22px; - opacity: .5; - font-size: 22px; - line-height: 0; - background: none; - float: right; - outline: none; - border: none; - @include single-transition(all, .2s, ease-in); - - &:hover, - &:active { - opacity: .8; - } - - i { - position: relative; - top: -2px; - } - } - - .sidebar--right__header { - font-size: 1em; - text-transform: uppercase; - color: inherit; - height: 44px; - padding: 0 1em; - line-height: 44px; - @include flex(0 0 44px); - border-bottom: $border-gray; - } - - .sidebar--right__subheader { - font-size: 1em; - padding: 1em 1em 0; - - h4 { - font-size: 1em; - } - - ul { - @include opacity(.7); - padding: 10px 0 0 30px; - } - - li { - font-size: .95em; - padding-bottom: 10px; - } - } - - .suggestion-list__content { - max-height: 120px; - } -} - -.sidebar-right-container { - height: 100%; -} diff --git a/web/sass-files/sass/layout/_webhooks.scss b/web/sass-files/sass/layout/_webhooks.scss deleted file mode 100644 index d6e367218..000000000 --- a/web/sass-files/sass/layout/_webhooks.scss +++ /dev/null @@ -1,37 +0,0 @@ -@charset 'UTF-8'; - -.webhooks__container { - background: rgba(black, .1); - border: 1px solid; - @include border-radius(3px); - padding: 0 13px 15px; - margin-top: 10px; -} - -.webhook__item { - font-size: 13px; - position: relative; - - &:last-child { - .divider-light:last-child { - display: none; - } - } - - .webhook__remove { - position: absolute; - right: -7px; - top: 8px; - width: 30px; - height: 30px; - font-size: 22px; - font-weight: bold; - text-align: center; - text-decoration: none; - color: #e05f5d; - } - - .webhook__url { - padding-right: 20px; - } -} |