From 80c4e0233529954ccc5fd2a85c8458982b6ca833 Mon Sep 17 00:00:00 2001 From: Kris Aubuchon Date: Thu, 5 Sep 2013 12:09:40 -0400 Subject: [PATCH] new mobile styles, some structure changes --- app/assets/stylesheets/common.css.erb | 4 +- .../stylesheets/common/activation.css.scss | 13 - app/assets/stylesheets/common/bbcode.css.scss | 128 --- .../common/code_highlighting.css.scss | 91 -- .../stylesheets/common/colorpicker.css.scss | 34 - .../stylesheets/common/combobox.css.scss | 17 - .../common/components/buttons.css.scss | 3 - .../stylesheets/common/compose.css.scss | 535 ------------ .../stylesheets/common/discourse.css.scss | 300 ------- app/assets/stylesheets/common/faqs.css.scss | 61 -- app/assets/stylesheets/common/header.css.scss | 243 ------ .../stylesheets/common/history.css.scss | 38 - .../common/hotness_control.css.scss | 29 - .../stylesheets/common/input_tip.css.scss | 29 - .../stylesheets/common/lightbox.css.scss | 58 -- app/assets/stylesheets/common/login.css.scss | 26 - .../common/magnific-popup.css.scss | 618 ------------- app/assets/stylesheets/common/mobile.scss | 23 - app/assets/stylesheets/common/modal.css.scss | 349 -------- app/assets/stylesheets/common/onebox.scss | 85 -- .../stylesheets/common/pagedown.css.scss | 149 ---- .../common/request_access.css.scss | 13 - .../stylesheets/common/share_link.css.scss | 39 - .../common/topic-admin-menu.css.scss | 32 - .../stylesheets/common/topic-list.css.scss | 339 -------- .../stylesheets/common/topic-post.css.scss | 823 ------------------ app/assets/stylesheets/common/topic.css.scss | 514 ----------- app/assets/stylesheets/common/upload.css.scss | 26 - app/assets/stylesheets/common/user.css.scss | 340 -------- .../stylesheets/common/username_tagsinput.css | 31 - app/assets/stylesheets/desktop.css.erb | 2 + .../stylesheets/vendor/bootstrap.css.scss | 739 ---------------- 32 files changed, 4 insertions(+), 5727 deletions(-) delete mode 100644 app/assets/stylesheets/common/activation.css.scss delete mode 100644 app/assets/stylesheets/common/bbcode.css.scss delete mode 100644 app/assets/stylesheets/common/code_highlighting.css.scss delete mode 100644 app/assets/stylesheets/common/colorpicker.css.scss delete mode 100644 app/assets/stylesheets/common/combobox.css.scss delete mode 100644 app/assets/stylesheets/common/compose.css.scss delete mode 100644 app/assets/stylesheets/common/discourse.css.scss delete mode 100644 app/assets/stylesheets/common/faqs.css.scss delete mode 100644 app/assets/stylesheets/common/header.css.scss delete mode 100644 app/assets/stylesheets/common/history.css.scss delete mode 100644 app/assets/stylesheets/common/hotness_control.css.scss delete mode 100644 app/assets/stylesheets/common/input_tip.css.scss delete mode 100644 app/assets/stylesheets/common/lightbox.css.scss delete mode 100644 app/assets/stylesheets/common/login.css.scss delete mode 100644 app/assets/stylesheets/common/magnific-popup.css.scss delete mode 100644 app/assets/stylesheets/common/mobile.scss delete mode 100644 app/assets/stylesheets/common/modal.css.scss delete mode 100644 app/assets/stylesheets/common/onebox.scss delete mode 100644 app/assets/stylesheets/common/pagedown.css.scss delete mode 100644 app/assets/stylesheets/common/request_access.css.scss delete mode 100644 app/assets/stylesheets/common/share_link.css.scss delete mode 100644 app/assets/stylesheets/common/topic-admin-menu.css.scss delete mode 100644 app/assets/stylesheets/common/topic-list.css.scss delete mode 100644 app/assets/stylesheets/common/topic-post.css.scss delete mode 100644 app/assets/stylesheets/common/topic.css.scss delete mode 100644 app/assets/stylesheets/common/upload.css.scss delete mode 100644 app/assets/stylesheets/common/user.css.scss delete mode 100644 app/assets/stylesheets/common/username_tagsinput.css delete mode 100644 app/assets/stylesheets/vendor/bootstrap.css.scss diff --git a/app/assets/stylesheets/common.css.erb b/app/assets/stylesheets/common.css.erb index 555a23c89..9703a778b 100644 --- a/app/assets/stylesheets/common.css.erb +++ b/app/assets/stylesheets/common.css.erb @@ -1,7 +1,7 @@ // Manifest // + //= require ./vendor/normalize -//= require ./vendor/bootstrap //= require ./common/foundation/base //= require ./vendor/font_awesome/font-awesome //= require ./vendor/chosen @@ -14,4 +14,4 @@ DiscoursePluginRegistry.stylesheets.each do |css| require_asset(css) end -%> +%> \ No newline at end of file diff --git a/app/assets/stylesheets/common/activation.css.scss b/app/assets/stylesheets/common/activation.css.scss deleted file mode 100644 index 19fe4c9ee..000000000 --- a/app/assets/stylesheets/common/activation.css.scss +++ /dev/null @@ -1,13 +0,0 @@ -// Styles used before the user is logged into discourse. For example, activating their -// account or changing their email. - -@import "common/foundation/variables"; -@import "common/foundation/mixins"; - -#simple-container { - @include border-radius-all(10px); - background-color: white; - padding: 20px; - width: 550px; - margin: 0 auto; -} diff --git a/app/assets/stylesheets/common/bbcode.css.scss b/app/assets/stylesheets/common/bbcode.css.scss deleted file mode 100644 index 2d7de236c..000000000 --- a/app/assets/stylesheets/common/bbcode.css.scss +++ /dev/null @@ -1,128 +0,0 @@ -// Support for BBCode styles like colors and font sizes - -span { - &.bbcode-b { - font-weight: bold; - } - &.bbcode-i { - font-style: italic; - } - &.bbcode-u { - text-decoration: underline; - } - &.bbcode-s { - text-decoration: line-through; - } - // Font sizes - &.bbcode-size-4 { - font-size: 4px; - } - &.bbcode-size-5 { - font-size: 5px; - } - &.bbcode-size-6 { - font-size: 6px; - } - &.bbcode-size-7 { - font-size: 7px; - } - &.bbcode-size-8 { - font-size: 8px; - } - &.bbcode-size-9 { - font-size: 9px; - } - &.bbcode-size-10 { - font-size: 10px; - } - &.bbcode-size-11 { - font-size: 11px; - } - &.bbcode-size-12 { - font-size: 12px; - } - &.bbcode-size-13 { - font-size: 13px; - } - &.bbcode-size-14 { - font-size: 14px; - } - &.bbcode-size-15 { - font-size: 15px; - } - &.bbcode-size-16 { - font-size: 16px; - } - &.bbcode-size-17 { - font-size: 17px; - } - &.bbcode-size-18 { - font-size: 18px; - } - &.bbcode-size-19 { - font-size: 19px; - } - &.bbcode-size-20 { - font-size: 20px; - } - &.bbcode-size-21 { - font-size: 21px; - } - &.bbcode-size-22 { - font-size: 22px; - } - &.bbcode-size-23 { - font-size: 23px; - } - &.bbcode-size-24 { - font-size: 24px; - } - &.bbcode-size-25 { - font-size: 25px; - } - &.bbcode-size-26 { - font-size: 26px; - } - &.bbcode-size-27 { - font-size: 27px; - } - &.bbcode-size-28 { - font-size: 28px; - } - &.bbcode-size-29 { - font-size: 29px; - } - &.bbcode-size-30 { - font-size: 30px; - } - &.bbcode-size-31 { - font-size: 31px; - } - &.bbcode-size-32 { - font-size: 32px; - } - &.bbcode-size-33 { - font-size: 33px; - } - &.bbcode-size-34 { - font-size: 34px; - } - &.bbcode-size-35 { - font-size: 35px; - } - &.bbcode-size-36 { - font-size: 36px; - } - &.bbcode-size-37 { - font-size: 37px; - } - &.bbcode-size-38 { - font-size: 38px; - } - &.bbcode-size-39 { - font-size: 39px; - } - &.bbcode-size-40 { - font-size: 40px; - } -} diff --git a/app/assets/stylesheets/common/code_highlighting.css.scss b/app/assets/stylesheets/common/code_highlighting.css.scss deleted file mode 100644 index ed45ef7fc..000000000 --- a/app/assets/stylesheets/common/code_highlighting.css.scss +++ /dev/null @@ -1,91 +0,0 @@ -// github.com style (c) Vasily Polovnyov - -pre { - code { - display: block; - padding: 5px 10px; - color: #333333; - background: #f1f1ff; - font-size: 14px; - font-family: Consolas, Menlo, Monaco, Lucida Console, Liberation Mono, DejaVu Sans Mono, Bitstream Vera Sans Mono, Courier New, monospace, serif; - } - .comment, .template_comment, .diff .header, .javadoc { - color: #999988; - font-style: italic; - } - .keyword, .css .keyword, .winutils, .javascript .title, .nginx .title, .subst, .request, .status { - color: #333333; - font-weight: bold; - } - .number, .hexcolor, .ruby .constant { - color: #009999; - } - .string, .tag .value, .phpdoc, .tex .formula { - color: #dd1144; - } - .title, .id { - color: #990000; - font-weight: bold; - } - .javascript .title, .lisp .title, .clojure .title, .subst { - font-weight: normal; - } - .class .title, .haskell .type, .vhdl .literal, .tex .command { - color: #445588; - font-weight: bold; - } - .tag { - color: navy; - font-weight: normal; - .title { - color: navy; - font-weight: normal; - } - } - .rules .property, .django .keyword { - color: navy; - font-weight: normal; - } - .attribute, .variable, .lisp .body { - color: teal; - } - .regexp { - color: #009926; - } - .class { - color: #445588; - font-weight: bold; - } - .symbol, .ruby .string, .lisp .keyword, .tex .special, .input_number { - color: #990073; - } - .built_in, .lisp .title, .clojure .built_in { - color: #0086b3; - } - .preprocessor, .pi, .doctype, .shebang, .cdata { - color: #999999; - font-weight: bold; - } - .deletion { - background: #ffdddd; - } - .addition { - background: #ddffdd; - } - .diff .change { - background: #0086b3; - } - .chunk { - color: #aaaaaa; - } - .tex .formula { - opacity: 0.5; - } -} - -p > code { - margin: 0px 2px; - padding: 2px 5px; - background-color: #f1f1ff; - border-radius: 3px 3px 3px 3px; -} \ No newline at end of file diff --git a/app/assets/stylesheets/common/colorpicker.css.scss b/app/assets/stylesheets/common/colorpicker.css.scss deleted file mode 100644 index a74794fbc..000000000 --- a/app/assets/stylesheets/common/colorpicker.css.scss +++ /dev/null @@ -1,34 +0,0 @@ -// styles for the category badge color picker - -@import "common/foundation/variables"; -@import "common/foundation/mixins"; - -.category-color-editor { - input { - width: 70px; - } - - .color-title { - display: inline-block; - width: 130px; - } - - .colors-container { - display: inline-block; - vertical-align: middle; - padding-top: 4px; - padding-left: 15px; - max-width: 300px; - - .colorpicker { - border: 1px solid $darkish_gray; - margin-right: 2px; - width: 16px; - height: 16px; - font-size: 4px; - &.used-color { - background: image-url("chosen-sprite.png") -19px 13px; - } - } - } -} diff --git a/app/assets/stylesheets/common/combobox.css.scss b/app/assets/stylesheets/common/combobox.css.scss deleted file mode 100644 index 6acb3d1df..000000000 --- a/app/assets/stylesheets/common/combobox.css.scss +++ /dev/null @@ -1,17 +0,0 @@ -.category-combobox { - .badge-category { - display: inline-block; - } - .topic-count { - font-size: 11px; - color: #666; - display: inline-block; - } - .highlighted .topic-count { - color: white; - } - .category-desc { - margin: 6px 0px 0px 3px; - font-size: 12px; - } -} \ No newline at end of file diff --git a/app/assets/stylesheets/common/components/buttons.css.scss b/app/assets/stylesheets/common/components/buttons.css.scss index 0ac864dd7..34f64b6c1 100644 --- a/app/assets/stylesheets/common/components/buttons.css.scss +++ b/app/assets/stylesheets/common/components/buttons.css.scss @@ -43,9 +43,7 @@ .btn { border: 1px solid rgba($black, 0.3); color: $btn-default-color; - text-shadow: 0 1px 0 $white; @include linear-gradient($white, $btn-default-background-color); - @include box-shadow(inset 0 -1px 2px rgba($black, 0.2)); &[href] { color: $btn-default-color; } @@ -59,7 +57,6 @@ @include box-shadow(inset 0 1px 3px rgba($black, 0.2)); } &[disabled] { - text-shadow: 0 1px 0 $white; @include linear-gradient($white, $btn-default-background-color); @include box-shadow(inset 0 -1px 2px rgba($black, 0.2)); } diff --git a/app/assets/stylesheets/common/compose.css.scss b/app/assets/stylesheets/common/compose.css.scss deleted file mode 100644 index 620a2abb7..000000000 --- a/app/assets/stylesheets/common/compose.css.scss +++ /dev/null @@ -1,535 +0,0 @@ -// styles that apply to the reply pane that slides up to compose replies - -@import "common/foundation/variables"; -@import "common/foundation/mixins"; - -// hack, this needs to be done cleaner -.private-message input.span8 { - width: 47%; -} - -.composer-popup-container { - max-width: 1500px; - margin-left: auto; - margin-right: auto; -} - -.composer-popup { - - @include box-shadow(3px 3px 3px rgba($black, 0.14)); - - p { - margin: 0 0 10px 0; - } - - a.close { - float: right; - color: $black; - opacity: 0.5; - font-size: 15px; - } - - a.close:hover { - opacity: 1.0; - } - - background-color: lighten($yellow, 40%); - border: 1px solid darken($yellow, 10%); - padding: 10px; - width: 600px; - position: absolute; - - ul.topics { - list-style: none; - margin: 0; - padding: 0; - - li { - font-weight: normal; - margin-top: 3px; - } - } -} - -#similar-topics { - background-color: #b5e8fd; - border: 1px solid darken(#b5e8fd, 10%); - - a[href] { - color: #000; - } - - .posts-count { - color: darken(#b5e8fd, 50%); - font-size: 12px; - } -} - -.composer-popup:nth-of-type(2) { - margin-left: 10px; -} - - -.autocomplete { - z-index: 999999; - position: absolute; - width: 240px; - background-color: $white; - border: 1px solid $gray; - ul { - list-style: none; - padding: 0; - margin: 0; - li { - border-bottom: 1px solid $light_gray; - a[href] { - padding: 5px; - display: block; - span.username { - color: lighten($black, 20); - } - span.name { - font-size: 11px; - } - &.selected { - background-color: $light_gray; - } - @include hover { - background-color: $light_gray; - text-decoration: none; - } - } - } - } -} - -#reply-control { - .toggle-preview, #draft-status, #file-uploading { - position: absolute; - bottom: -31px; - margin-top: 0px; - } - .toggle-preview { - right: 5px; - text-decoration: underline; - } - #file-uploading { - left: 51%; - font-size: 12px; - color: darken($gray, 40); - } - #draft-status { - right: 51%; - color: lighten($black, 60); - &.flash { - color: lighten($red, 20); - } - } - @include transition(height 0.4s ease); - width: 100%; - z-index: 1039; - height: 0px; - background-color: rgba($composer_background, 0.96); - bottom: 0px; - font-size: 14px; - position: fixed; - .toggler { - display: block; - width: 13px; - height: 13px; - right: 13px; - position: absolute; - font-size: 15px; - color: $darkish_gray; - text-decoration: none; - &:before { - font-family: "FontAwesome"; - content: "\f078"; - } - } - a.cancel { - text-decoration: underline; - padding-left: 7px; - } - .control-row { - margin: 0 0 0 5px; - } - .saving-text { - display: none; - } - .draft-text { - display: none; - } - .grippie { - display: none; - } - // The various states - &.open { - height: 300px; - .grippie { - display: block; - } - } - &.closed { - height: 0px !important; - } - &.draft { - height: 40px !important; - cursor: pointer; - border-top: 1px solid $gray; - .draft-text { - display: block; - } - .toggler { - &:before { - font-family: "FontAwesome"; - content: "\f077"; - } - } - } - &.saving { - height: 40px !important; - border-top: 1px solid $gray; - .saving-text { - display: block; - } - .toggler { - &:before { - font-family: "FontAwesome"; - content: "\f00d"; - } - } - } - .spinner { - position: absolute; - @include fades-in(0.25s); - @include border-radius-all(10px); - left: 250px; - top: 95px; - height: 100px; - width: 70px; - height: 70px; - text-indent: -9999em; - background: { - color: $black; - image: image-url("spinner_96_w.gif"); - repeat: no-repeat; - size: 35px; - position: 17px 17px; - }; - } - &.loading { - .spinner { - z-index: 1000; - @include visible; - } - } - .reply-area { - max-width: 1500px; - margin-left: auto; - margin-right: auto; - float: none; - } - - // When the post is new (new topic) the sizings are different - &.edit-title { - &.open { - height: 400px; - } - .contents { - input#reply-title { - padding: 7px 10px; - margin: 6px 10px 3px 0; - } - .wmd-controls { - @include transition(top 0.3s ease); - top: 100px; - } - } - } - .contents { - padding: 10px; - min-width: 1280px; - .form-element { - .chzn-container { - width: 400px; - margin-top: 6px; - a { - padding-top: 4px; - height: 28px; - } - b { - margin-top: 4px; - } - } - .category-combobox { - width: 430px; - @include medium-width { width: 285px; } - @include small-width { width: 220px; } - - .chzn-drop { - left: -9000px; - width: 428px; - @include medium-width { width: 283px; } - @include small-width { width: 218px; } - } - .chzn-search input { - width: 378px; - @include medium-width { width: 233px; } - @include small-width { width: 168px; } - } - } - } - #reply-title { - margin-right: 10px; - float: left; - &:disabled { - background-color: $light_gray; - } - } - #wmd-input:disabled { - background-color: $light_gray; - } - #wmd-input, #wmd-preview { - color: $black; - img { - max-width: 100%; - } - - video { - max-width: 100%; - height: auto; - } - - audio { - max-width: 100%; - } - } - #wmd-preview { - border: 1px dashed $gray; - overflow: auto; - visibility: visible; - p { - margin-top: 0; - } - &.hidden { - width: 0; - visibility: hidden; - } - } - #wmd-input { - bottom: 35px; - } - .submit-panel { - position: absolute; - display: block; - bottom: 8px; - } - } - .title-input, .category-input { - position: relative; - display: inline; - } - .title-input .popup-tip { - width: 300px; - left: -8px; - margin-top: 8px; - } - .category-input .popup-tip { - width: 240px; - left: 432px; - top: -7px; - } -} - -.reply-to { - margin-bottom: 10px; -} - -div.ac-wrap.disabled { - input { - display:none; - } - .item a { - display:none; - } -} - -div.ac-wrap { - background-color: $white; - border: 1px solid #cccccc; - padding: 5px 10px; - @include border-radius-all(3px); - div.item { - float: left; - margin-right: 10px; - margin-bottom: 5px; - span { - padding-left: 5px; - height: 22px; - display: inline-block; - line-height: 22px; - vertical-align: bottom; - } - a { - margin-left: 4px; - font-size: 10px; - line-height: 10px; - padding: 2px 1px 1px 3px; - border-radius: 10px; - width: 10px; - display: inline-block; - border: 1px solid rgba(255, 255, 255, 0); - &:hover { - background-color: lighten($red, 45); - border: 1px solid lighten($red, 20); - text-decoration: none; - color: $white; - } - } - } - input[type="text"] { - float: left; - margin-top: 5px; - border: 0; - padding: 0; - margin: 4px 0 0; - box-shadow: none; - } -} - - -#reply-control.edit-title.private-message { - .wmd-controls { - @include transition(top 0.3s ease); - top: 140px; - } -} - -#reply-control { - &.hide-preview { - .wmd-controls { - #wmd-input { - width: 100%; - } - .preview-wrapper { - display: none; - } - .textarea-wrapper { - width: 100%; - } - } - } - .wmd-controls { - left: 30px; - right: 30px; - position: absolute; - top: 50px; - bottom: 48px; - - // this removes the topmost margin; - // if we don't have this, all posts would have extra space at the top - #wmd-preview > *:first-child { - margin-top: 0px !important; - } - - #wmd-input, #wmd-preview { - box-sizing: border-box; - -moz-box-sizing: border-box; - width: 100%; - height: 100%; - min-height: 100%; - padding: 7px; - margin: 0; - background-color: $white; - word-wrap: break-word; - - // set up proper header margins in post preview - h1, h2, h3, h4, h5, h6 { - margin: 20px 0 10px; - } - } - #wmd-input { - position: absolute; - left: 0; - top: 0; - height: 100%; - min-height: 100%; - box-sizing: border-box; - border: 0; - border-top: 36px solid transparent; - @include border-radius-all(0); - transition: none; - } - .textarea-wrapper, .preview-wrapper { - position: relative; - box-sizing: border-box; - -moz-box-sizing: border-box; - height: 100%; - min-height: 100%; - margin: 0; - padding: 0; - width: 50%; - } - .textarea-wrapper { - padding-right: 5px; - float: left; - .popup-tip { - margin-top: 3px; - right: 4px; - } - } - .preview-wrapper { - padding-left: 5px; - float: right; - } - } - #wmd-button-bar { - top: 0; - position: absolute; - border-bottom: 1px solid $inner_line; - background-color: $white; - z-index: 100; - } -} - -.control-row.reply-area { - padding-left: 20px; - padding-right: 20px; -} - -@media screen and (min-width: 1550px) { - #reply-control { - .wmd-controls { - width: 1450px; - left: auto; - right: auto; - } - } -} - -.admin-options-form { - margin-top: 8px; - display: none; -} - -.auto-close-fields { - input { - width: 50px; - } -} - -.edit-auto-close-modal { - form { - margin: 0; - } - .auto-close-fields { - i.icon-time { - font-size: 16px; - line-height: 8px; - } - input { - margin: 0; - } - } -} diff --git a/app/assets/stylesheets/common/discourse.css.scss b/app/assets/stylesheets/common/discourse.css.scss deleted file mode 100644 index d8a472828..000000000 --- a/app/assets/stylesheets/common/discourse.css.scss +++ /dev/null @@ -1,300 +0,0 @@ -// global styles that apply to the Discourse application specifically -// BEWARE: changing these styles implies they take effect anywhere they are seen -// throughout the Discourse application - -@import "common/foundation/variables"; -@import "common/foundation/mixins"; -@import "common/foundation/helpers"; - -body { - min-width: $large-width; -} - -.container { - @extend .clearfix; - width: $large-width; - margin-right: auto; - margin-left: auto; -} - -.full-width { - width: $large-width; - margin-left: 12px; -} - -@include medium-width { - body { - min-width: $medium-width; - } - .container, - .full-width { - width: $medium-width; - } -} - -@include small-width { - body { - min-width: $small-width; - } - .container, - .full-width { - width: $small-width; - } -} - -a.no-href { - cursor: pointer; -} - -header { - margin-bottom: 15px; -} - -body { - - button.ok { - @include linear-gradient(lighten($green, 5%), $green); - color: $white; - @include hover { - @include linear-gradient(lighten($green, 10%), $green); - color: $white; - } - } - button.cancel { - @include linear-gradient(lighten($red, 5%), $red); - color: $white; - @include hover { - @include linear-gradient(lighten($red, 10%), $red); - color: $white; - } - } - .coldmap-high { - color: lighten($blue, 20%) !important; - } - .coldmap-med { - color: lighten($blue, 10%) !important; - } - .coldmap-low { - color: $blue !important; - } - .heatmap-high { - color: lighten($red, 50%) !important; - } - .heatmap-med { - color: lighten($red, 10%) !important; - } - .heatmap-low { - color: $red !important; - } - #loading-message { - position: absolute; - font-size: 30px; - text-align: center; - top: 120px; - left: 500px; - color: $darkish_gray; - } - .top-space { - margin-top: 10px; - } - ul.breadcrumb { - margin: 0 10px 0px 10px; - } - .boxed { - height: 100%; - @include border-radius-all(5px); - .contents { - padding: 10px 20px 20px 20px; - } - &.white { - background-color: $white; - } - } - #main { - .icon-star.starred { - color: #fe1; - } - a.star { - display: inline-block; - font-size: 15px; - line-height: 1; - color: #cacaca; - &:before { - font-family: "FontAwesome"; - content: "\f005"; - } - &.starred { - color: #fe1; - text-shadow: 0px 0px 3px rgba(0, 0, 0, 0.5); - @include hover { - opacity: 1; - &:before { - content: "\f005"; - } - } - } - @include hover { - opacity: 0.6; - } - - &:active { - opacity: 1; - } - } - img.avatar { - &.header { - width: 45px; - height: 45px; - } - &.medium { - width: 32px; - height: 32px; - } - &.small { - width: 25px; - height: 25px; - } - &.tiny { - width: 20px; - height: 20px; - } - } - .user-list { - .user { - padding-bottom: 5px; - } - } - } - .message { - @include border-radius-all(8px); - background-color: $white; - padding: 14px; - h2 { - margin-bottom: 20px; - } - p { - font-size: 20px; - } - } - #footer { - background-color: $eggplant; - .container { - height: 50px; - .contents { - padding-top: 10px; - a[href] { - color: $white; - } - } - } - } - .clear-transitions { - @include transition(none !important); - } - .grippie { - width: 100%; - border: 1px solid #dddddd; - border-width: 1px 0px; - cursor: row-resize; - height: 11px; - overflow: hidden; - background-color: #eeeeee; - display:block {} - background: image-url("grippie.png") #eeeeee no-repeat center 3px; - } -} - -form { - .tip { - display: inline-block; - &.good { - color: $green; - } - &.bad { - color: $red; - } - } -} - -blockquote { - /* 13px left is intentional here to properly align with post quotes */ - padding: 10px 8px 1px 13px; - background-color: $quote-background; - border-left: 5px solid darken($quote-background, 20%); - p { - margin: 0 0 10px 0; - } -} - -.topic-statuses { - display: inline-block; - margin: 0; - padding: 0; - .topic-status { - padding: 5px 2px 0 0; - margin: 0; - display: inline-block; - i { - font-size: 15px; - color: darken($white, 60%); - } - } -} - -#wmd-input { - resize: none; -} - -#pagedown-editor { - width: 540px; - background-color: $white; - padding: 0 10px 13px 10px; - border: 1px solid $gray; - .preview { - margin-top: 8px; - border: 1px dashed $gray; - padding: 8px 8px 0 8px; - p { - margin: 0 0 10px 0; - } - } - .preview.hidden { - display: none; - } -} - -.spinner { - width: 100px; - margin: 0 auto 30px auto; - background-color: $black; - @include border-radius-all(10px); - padding: 10px 10px 10px 30px; - font-size: 15px; - line-height: 23px; - text-align: center; - color: $white; - background: { - image: image-url("spinner_96_w.gif"); - repeat: no-repeat; - position: 10px 8px; - size: 25px; - }; -} - -.avatar { - @include border-radius-all(2px); -} - -.avatar-wrapper { - background-color: white; - display: inline-block; - border: 1px solid #82786b; - @include border-radius-all(5px); - img { - @include border-radius-all(4px); - } -} - -.profiler-results.profiler-left { - top: 60px !important; -} diff --git a/app/assets/stylesheets/common/faqs.css.scss b/app/assets/stylesheets/common/faqs.css.scss deleted file mode 100644 index 3309f2f60..000000000 --- a/app/assets/stylesheets/common/faqs.css.scss +++ /dev/null @@ -1,61 +0,0 @@ -@import "common/foundation/variables"; -@import "common/foundation/mixins"; -@import "common/foundation/helpers"; - -// -------------------------------------------------- -// FAQs -// -------------------------------------------------- - -// Base -// -------------------------------------------------- - -.body-page { - - font-family: "Helvetica Neue", Helvetica, Arial, sans-serif; - font-size: 16px; - line-height: 22px; - - // Consistent vertical spacing - blockquote, - h1, - h2, - h3, - hr, - p, - pre, - ul, - ol, - li, - table { - margin: 0 0 20px; - font-size: 16px; - line-height: 22px; - } - - li { - margin-bottom: 8px; - } - - ul, - ol { - margin-left: 40px; - } - -} - -.body-page { - - .container { - @extend .clearfix; - width: 960px; - margin: 0 auto; - padding: 20px 10px; - margin-top: -60px; - } - -} - -.nav-pills { - margin-left:0px !important; - font: 13px/18px "Helvetica Neue",Helvetica,Arial,sans-serif; -} \ No newline at end of file diff --git a/app/assets/stylesheets/common/header.css.scss b/app/assets/stylesheets/common/header.css.scss deleted file mode 100644 index 572798857..000000000 --- a/app/assets/stylesheets/common/header.css.scss +++ /dev/null @@ -1,243 +0,0 @@ -@import "common/foundation/variables"; -@import "common/foundation/mixins"; - -// -------------------------------------------------- -// Discourse header -// -------------------------------------------------- - -.d-header { - min-width: 100%; - position: absolute; - top: 0; - left: 0; - z-index: 1000; - border-bottom: 1px solid #9baab2; - background-color: $white; - @include box-shadow((0 1px 3px rgba($black, 0.12), inset 0 -4px 4px -4px rgba($black, 0.3))); - .docked & { - position: fixed; - } - .contents { - margin: 10px 0; - } - .title { - display: table; - float: left; - height: 40px; - > a { - display: table-cell; - vertical-align: middle; - } - } - #site-logo { - width: 122px; - } - .icon-home { - font-size: 20px; - line-height: 40px; - } - .panel { - float: right; - position: relative; - } - .current-username { - float: left; - a { - color: $black; - font-size: 14px; - line-height: 40px; - } - button { - margin-top: 8px; - } - } - .icons { - float: left; - text-align: center; - margin: 0 0 0 15px; - list-style: none; - > li { - float: left; - &:first-child .icon { - @include border-radius-all(4px 0 0 4px); - } - &:first-child.active .icon { - @include border-radius-all(4px 0 0 0); - } - &:last-child .icon { - border-right: 1px solid #ccc; - @include border-radius-all(0 4px 4px 0); - } - } - .icon { - display: block; - border-top: 1px solid #ccc; - border-bottom: 1px solid #ccc; - border-left: 1px solid #d6d6d6; - padding: 3px; - color: $nav-button-color; - text-decoration: none; - cursor: pointer; - @include box-shadow(inset 0 -4px 4px -4px rgba($black, 0.14)); - &:hover { - color: $nav-button-color-hover; - background-color: $nav-button-background-color-hover; - } - &:active { - color: $nav-button-color-active; - background-color: $nav-button-background-color-active; - } - } - .active .icon { - position: relative; - color: #7b7b7b; - background-color: $white; - cursor: default; - @include box-shadow((6px 0 6px -6px rgba($black, 0.2), -6px 0 6px -6px rgba($black, 0.2), inset 0 13px 13px -13px rgba($black, 0.1))); - &:after { - display: block; - position: absolute; - top: 100%; - left: 0; - z-index: 1101; - width: 100%; - height: 0; - content: ""; - border-top: 1px solid $white; - } - } - [class^="icon-"] { - width: 32px; - height: 32px; - font-size: 20px; - line-height: 32px; - display: inline-block; - } - .notifications { - position: relative; - } - .badge-notification { - position: absolute; - top: -9px; - z-index: 1; - margin-left: 0; - } - .unread-notifications { - right: -4px; - background-color: #0088CC; - } - .unread-private-messages { - left: -4px; - background-color: #00953A; - } - } - .flagged-posts { - background-color: #E53B2E; - } -} - -#main { - position: relative; -} - -#main-outlet { - padding-top: 75px; -} - -// Dropdowns -// -------------------------------------------------- - -.d-dropdown { - display: none; - overflow: hidden; - width: 320px; - position: absolute; - top: 100%; - right: 0; - z-index: 1100; - margin-top: -1px; - border: 1px solid #ccc; - background-color: $white; - @include border-radius-all(4px); - @include box-shadow(0 3px 3px rgba($black, 0.2)); - - // Common - - ul { - margin: 0; - list-style: none; - } - li { - padding: 5px; - font-size: 13px; - line-height: 16px; - .icon { - margin-right: 3px; - } - } - .heading { - border-top: 1px solid #c5c5c5; - border-bottom: 1px solid #c5c5c5; - color: #2d3234; - font-weight: bold; - font-size: 12px; - line-height: 15px; - text-shadow: 0 1px 0 $white; - background-color: #f5f6f7; - @include box-shadow(inset 0 1px 0 rgba($white, 0.8)); - } - .selected { - background-color: $header-item-highlight; - } - - // Notifications - - &#notifications-dropdown { - .icon { - color: #777; - } - li { - background-color: $header-item-highlight; - } - .read { - background-color: $white; - } - .none { - padding: 5px; - } - } - - // Search - - input[type='text'] { - width: 298px; - height: 22px; - margin: 5px; - padding: 5px; - &:focus { - @include box-shadow((inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 4px rgba(82, 168, 236, 0.6))); - } - } - .searching { - display: block; - position: absolute; - top: 13px; - right: 13px; - color: #777; - font-size: 18px; - } - .no-results { - padding: 0 5px 5px; - } - .filter { - float: right; - } - - // Categories - - .category { - float: left; - background-color: transparent; - line-height: 20px; - } -} diff --git a/app/assets/stylesheets/common/history.css.scss b/app/assets/stylesheets/common/history.css.scss deleted file mode 100644 index c8d61556b..000000000 --- a/app/assets/stylesheets/common/history.css.scss +++ /dev/null @@ -1,38 +0,0 @@ -// styles that apply to the popup that appears when you show the edit history -// of a post - -@import "common/foundation/variables"; -@import "common/foundation/mixins"; - -.modal.history-modal { - .modal-inner-container { - min-width: 960px; - min-height: 500px; - } - - ins { - background: #e6ffe6; - } - del { - background: #ffe6e6; - } - .modal-header { - height: 42px; - } - .history-loading { - margin: 25px 0; - width: 120px; - font-size: 20px; - padding: 8px 0 30px 30px; - background: { - image: image-url("spinner_96.gif"); - repeat: no-repeat; - size: 25px 25px; - position: 0 4px; - }; - } - select { - height: auto; - width: auto; - } -} diff --git a/app/assets/stylesheets/common/hotness_control.css.scss b/app/assets/stylesheets/common/hotness_control.css.scss deleted file mode 100644 index 462fedc17..000000000 --- a/app/assets/stylesheets/common/hotness_control.css.scss +++ /dev/null @@ -1,29 +0,0 @@ -// styles for the 'hotness control' - -@import "common/foundation/variables"; -@import "common/foundation/mixins"; - -.hotness-control { - margin-bottom: 5px; - - button { - @include border-radius-all(5px); - margin-right: 3px; - background-color: lighten($gray, 10%); - border: 0; - width: 25px; - text-align: center; - - &:hover { - background-color: $gray; - } - } - - button.selected { - background-color: lighten($red, 25%); - color: $white; - font-weight: bold; - } - - -} \ No newline at end of file diff --git a/app/assets/stylesheets/common/input_tip.css.scss b/app/assets/stylesheets/common/input_tip.css.scss deleted file mode 100644 index e87ff9d49..000000000 --- a/app/assets/stylesheets/common/input_tip.css.scss +++ /dev/null @@ -1,29 +0,0 @@ -@import "common/foundation/variables"; -@import "common/foundation/mixins"; - -.popup-tip { - position: absolute; - display: block; - padding: 5px 10px; - z-index: 101; - @include border-radius-all(2px); - border: solid 1px #955; - &.bad { - background-color: #b66; - color: white; - box-shadow: 1px 1px 5px #777, inset 0 0 9px #b55; - } - &.hide, &.good { - display: none; - } - a.close { - float: right; - color: $black; - opacity: 0.5; - font-size: 15px; - margin-left: 4px; - } - a.close:hover { - opacity: 1.0; - } -} \ No newline at end of file diff --git a/app/assets/stylesheets/common/lightbox.css.scss b/app/assets/stylesheets/common/lightbox.css.scss deleted file mode 100644 index 06c9443fa..000000000 --- a/app/assets/stylesheets/common/lightbox.css.scss +++ /dev/null @@ -1,58 +0,0 @@ -@import "common/foundation/variables"; -@import "common/foundation/mixins"; - -.lightbox { - position: relative; - display: inline-block; - - &:hover .meta { - background: rgba(0, 0, 0, .5); - opacity: 1; - @include transition(opacity .5s); - } -} - -.meta { - position: absolute; - bottom: 0; - width: 100%; - color: white; - background: black; - opacity: 0; - @include transition(opacity .2s); - - span { - float: left; - } - - .filename { - margin: 5px; - &:before { - font-family: "FontAwesome"; - content: "\F03E"; - margin-right: 5px; - } - } - - .informations { - margin: 6px; - padding-right: 20px; - color: $dark_gray; - font-size: 14px; - } - - .expand { - position: absolute; - bottom: 4px; - right: 7px; - &:before { - font-family: "FontAwesome"; - content: "\F065"; - } - } -} - -// this should be removed once all the posts have been rebaked with the new lightboxes overlays -.lightbox > span { - display: none; -} diff --git a/app/assets/stylesheets/common/login.css.scss b/app/assets/stylesheets/common/login.css.scss deleted file mode 100644 index 71923e103..000000000 --- a/app/assets/stylesheets/common/login.css.scss +++ /dev/null @@ -1,26 +0,0 @@ -// style that apply to the login popup - -@import "common/foundation/variables"; -@import "common/foundation/mixins"; - -#login-buttons { - button { - margin: 0 5px 5px 0; - min-width: 180px; - } - margin-top: 10px; - margin-bottom: 20px; -} - -#login-form { - a { - color: $dark_gray; - cursor: pointer; - } -} - -// Create account - -#new-account-link { - cursor: pointer; -} \ No newline at end of file diff --git a/app/assets/stylesheets/common/magnific-popup.css.scss b/app/assets/stylesheets/common/magnific-popup.css.scss deleted file mode 100644 index 872ae8f2b..000000000 --- a/app/assets/stylesheets/common/magnific-popup.css.scss +++ /dev/null @@ -1,618 +0,0 @@ -/* Magnific Popup CSS */ - -//////////////////////// -// Settings // -//////////////////////// - -// overlay -$overlay-color: #0b0b0b; // Color of overlay screen -$overlay-opacity: 0.8; // Opacity of overlay screen -$shadow: 0 0 8px rgba(0, 0, 0, 0.6); // Shadow on image or iframe - -// spacing -$popup-padding-left: 8px; // Padding from left and from right side -$popup-padding-left-mobile: 6px; // Same as above, but is applied when width of window is less than 800px - -$z-index-base: 1050; // Base z-index of popup - -// controls -$include-arrows: true; // Include styles for nav arrows -$controls-opacity: 0.65; // Opacity of controls -$controls-color: #FFF; // Color of controls -$inner-close-icon-color: #333; // Color of close button when inside -$controls-text-color: #CCC; // Color of preloader and "1 of X" indicator -$controls-text-color-hover: #FFF; // Hover color of preloader and "1 of X" indicator -$IE7support: false; // Very basic IE7 support - -// Iframe-type options -$include-iframe-type: false; // Enable Iframe-type popups -$iframe-padding-top: 40px; // Iframe padding top -$iframe-background: #000; // Background color of iframes -$iframe-max-width: 900px; // Maximum width of iframes -$iframe-ratio: 9/16; // Ratio of iframe (9/16 = widescreen, 3/4 = standard, etc.) - -// Image-type options -$include-image-type: true; // Enable Image-type popups -$image-padding-top: 40px; // Image padding top -$image-padding-bottom: 40px; // Image padding bottom -$include-mobile-layout-for-image: true; // Removes paddings from top and bottom - -// Image caption options -$caption-title-color: #F3F3F3; // Caption title color -$caption-subtitle-color: #BDBDBD; // Caption subtitle color - -//////////////////////// -// -// Contents: -// -// 1. Default Settings -// 2. General styles -// - Transluscent overlay -// - Containers, wrappers -// - Cursors -// - Helper classes -// 3. Appearance -// - Preloader & text that displays error messages -// - CSS reset for buttons -// - Close icon -// - "1 of X" counter -// - Navigation (left/right) arrows -// - Iframe content type styles -// - Image content type styles -// - Media query where size of arrows is reduced -// - IE7 support -// -//////////////////////// - - - -//////////////////////// -// 1. Default Settings -//////////////////////// - -$overlay-color: #0b0b0b !default; -$overlay-opacity: 0.8 !default; -$shadow: 0 0 8px rgba(0, 0, 0, 0.6) !default; // shadow on image or iframe -$popup-padding-left: 8px !default; // Padding from left and from right side -$popup-padding-left-mobile: 6px !default; // Same as above, but is applied when width of window is less than 800px - -$z-index-base: 500 !default; // Base z-index of popup -$include-arrows: true !default; // include styles for nav arrows -$controls-opacity: 0.65 !default; -$controls-color: #FFF !default; -$inner-close-icon-color: #333 !default; -$controls-text-color: #CCC !default; // Color of preloader and "1 of X" indicator -$controls-text-color-hover: #FFF !default; -$IE7support: true !default; // Very basic IE7 support - -// Iframe-type options -$include-iframe-type: true !default; -$iframe-padding-top: 40px !default; -$iframe-background: #000 !default; -$iframe-max-width: 900px !default; -$iframe-ratio: 9/16 !default; - -// Image-type options -$include-image-type: true !default; -$image-padding-top: 40px !default; -$image-padding-bottom: 40px !default; -$include-mobile-layout-for-image: true !default; // Removes paddings from top and bottom - -// Image caption options -$caption-title-color: #F3F3F3 !default; -$caption-subtitle-color: #BDBDBD !default; - - - -//////////////////////// -// 2. General styles -//////////////////////// - -// Transluscent overlay -.mfp-bg { - top: 0; - left: 0; - width: 100%; - height: 100%; - z-index: $z-index-base + 2; - overflow: hidden; - position: fixed; - - background: $overlay-color; - opacity: $overlay-opacity; - @if $IE7support { - filter: alpha(opacity=$overlay-opacity*100); - } -} - -// Wrapper for popup -.mfp-wrap { - top: 0; - left: 0; - width: 100%; - height: 100%; - z-index: $z-index-base + 3; - position: fixed; - outline: none !important; - -webkit-backface-visibility: hidden; // fixes webkit bug that can cause "false" scrollbar -} - -// Root container -.mfp-container { - height: 100%; - text-align: center; - position: absolute; - width: 100%; - height: 100%; - left: 0; - top: 0; - padding: 0 $popup-padding-left; - -webkit-box-sizing: border-box; - -moz-box-sizing: border-box; - box-sizing: border-box; -} - -// Vertical centerer helper -.mfp-container:before { - content: ''; - display: inline-block; - height: 100%; - vertical-align: middle; -} - -// Remove vertical centering when popup has class `mfp-align-top` -.mfp-align-top .mfp-container:before { - display: none; -} - -// Popup content holder -.mfp-content { - position: relative; - display: inline-block; - vertical-align: middle; - margin: 0 auto; - text-align: left; - z-index: $z-index-base + 5; -} -.mfp-inline-holder .mfp-content, -.mfp-ajax-holder .mfp-content { - width: 100%; - cursor: auto; -} - -// Cursors -.mfp-ajax-cur { - cursor: progress; -} -.mfp-zoom-out-cur, -.mfp-zoom-out-cur .mfp-image-holder .mfp-close { - cursor: -moz-zoom-out; - cursor: -webkit-zoom-out; - cursor: zoom-out; -} -.mfp-zoom { - cursor: pointer; - cursor: -webkit-zoom-in; - cursor: -moz-zoom-in; - cursor: zoom-in; -} -.mfp-auto-cursor .mfp-content { - cursor: auto; -} - -.mfp-close, -.mfp-arrow, -.mfp-preloader, -.mfp-counter { - -webkit-user-select:none; - -moz-user-select: none; - user-select: none; -} - -// Hide the image during the loading -.mfp-loading.mfp-figure { - display: none; -} - -// Helper class that hides stuff -.mfp-hide { - display: none !important; -} - - - -//////////////////////// -// 3. Appearance -//////////////////////// - -// Preloader and text that displays error messages -.mfp-preloader { - color: $controls-text-color; - position: absolute; - top: 50%; - width: auto; - text-align: center; - margin-top: -0.8em; - left: 8px; - right: 8px; - z-index: $z-index-base + 4; -} -.mfp-preloader a { - color: $controls-text-color; -} -.mfp-preloader a:hover { - color: $controls-text-color-hover; -} - -// Hide preloader when content successfully loaded -.mfp-s-ready .mfp-preloader { - display: none; -} - -// Hide content when it was not loaded -.mfp-s-error .mfp-content { - display: none; -} - - -// CSS-reset for buttons -button.mfp-close, -button.mfp-arrow { - overflow: visible; - cursor: pointer; - background: transparent; - border: 0; - -webkit-appearance: none; - display: block; - padding: 0; - z-index: $z-index-base + 6; -} -button::-moz-focus-inner { - padding: 0; - border: 0 -} - - -// Close icon -.mfp-close { - width: 44px; - height:44px; - line-height: 44px; - - position: absolute; - right: 0; - top: 0; - text-decoration: none; - text-align: center; - opacity: $controls-opacity; - padding: 0 0 18px 10px; - color: $controls-color; - - font-style: normal; - font-size: 28px; - font-family: Arial, Baskerville, monospace; - - &:hover, - &:focus { - opacity: 1; - } - - &:active { - top: 1px; - } -} -.mfp-close-btn-in .mfp-close { - color: $inner-close-icon-color; -} -.mfp-image-holder .mfp-close, -.mfp-iframe-holder .mfp-close { - color: $controls-color; - right: -6px; - text-align: right; - padding-right: 6px; - width: 100%; -} - -// "1 of X" counter -.mfp-counter { - position: absolute; - top:0; - right: 0; - color: $controls-text-color; - font-size: 12px; - line-height: 18px; -} - -// Navigation arrows -@if $include-arrows { - .mfp-arrow { - position: absolute; - top: 0; - opacity: $controls-opacity; - margin: 0; - top: 50%; - margin-top: -55px; - padding: 0; - width: 90px; - height: 110px; - -webkit-tap-highlight-color: rgba(0,0,0,0); - } - .mfp-arrow:active { - margin-top: -54px; - } - .mfp-arrow:hover, - .mfp-arrow:focus { - opacity: 1; - } - - .mfp-arrow { - - &:before, - &:after, - .mfp-b, - .mfp-a { - content: ''; - display: block; - width: 0; - height: 0; - position: absolute; - left: 0; - top: 0; - margin-top: 35px; - margin-left: 35px; - border: solid transparent; - } - - &:after, - .mfp-a { - opacity: $overlay-opacity; - border-top-width: 12px; - border-bottom-width: 12px; - top:8px; - } - - &:before, - .mfp-b { - border-top-width: 20px; - border-bottom-width: 20px; - } - - } - - .mfp-arrow-left { - left: 0; - - &:after, - .mfp-a { - border-right: 12px solid #000; - left: 5px; - } - &:before, - .mfp-b { - border-right: 20px solid #FFF; - } - } - - .mfp-arrow-right { - right: 0; - &:after, - .mfp-a { - border-left: 12px solid #000; - left: 3px; - } - &:before, - .mfp-b { - border-left: 20px solid #FFF; - } - } -} - - - -// Iframe content type -@if $include-iframe-type { - .mfp-iframe-holder { - padding-top: $iframe-padding-top; - padding-bottom: $iframe-padding-top; - } - .mfp-iframe-holder .mfp-content { - line-height: 0; - width: 100%; - max-width: $iframe-max-width; - } - .mfp-iframe-scaler { - width: 100%; - height: 0; - overflow: hidden; - padding-top: $iframe-ratio * 100%; - } - .mfp-iframe-scaler iframe { - position: absolute; - display: block; - top: 0; - left: 0; - width: 100%; - height: 100%; - box-shadow: $shadow; - background: $iframe-background; - } - .mfp-iframe-holder .mfp-close { - top: -40px; - } -} - - - -// Image content type -@if $include-image-type { - - /* Main image in popup */ - img.mfp-img { - width: auto; - max-width: 100%; - height: auto; - display: block; - line-height: 0; - -webkit-box-sizing: border-box; - -moz-box-sizing: border-box; - box-sizing: border-box; - padding: $image-padding-top 0 $image-padding-bottom; - margin: 0 auto; - } - - /* The shadow behind the image */ - .mfp-figure:after { - content: ''; - position: absolute; - left: 0; - top: $image-padding-top; - bottom: $image-padding-bottom; - display: block; - right: 0; - width: auto; - height: auto; - z-index: -1; - box-shadow: $shadow; - } - .mfp-figure { - line-height: 0; - } - .mfp-bottom-bar { - margin-top: -36px; - position: absolute; - top: 100%; - left: 0; - width: 100%; - cursor: auto; - } - .mfp-title { - text-align: left; - line-height: 18px; - color: $caption-title-color; - word-break: break-word; - padding-right: 36px; // leave some space for counter at right side - } - - .mfp-figure small { - color: $caption-subtitle-color; - display: block; - font-size: 12px; - line-height: 14px; - } - .mfp-image-holder .mfp-content { - max-width: 100%; - } - - .mfp-gallery .mfp-image-holder .mfp-figure { - cursor: pointer; - } - - - @if $include-mobile-layout-for-image { - - @media screen and (max-width: 800px) and (orientation:landscape), screen and (max-height: 300px) { - /** - * Remove all paddings around the image on small screen - */ - .mfp-img-mobile .mfp-image-holder { - padding-left: 0; - padding-right: 0; - } - .mfp-img-mobile img.mfp-img { - padding: 0; - } - /* The shadow behind the image */ - .mfp-img-mobile .mfp-figure:after { - top: 0; - bottom: 0; - } - - .mfp-img-mobile .mfp-bottom-bar { - background: rgba(0,0,0,0.6); - bottom: 0; - margin: 0; - top: auto; - padding: 3px 5px; - position: fixed; - -webkit-box-sizing: border-box; - -moz-box-sizing: border-box; - box-sizing: border-box; - } - .mfp-img-mobile .mfp-bottom-bar:empty { - padding: 0; - } - .mfp-img-mobile .mfp-counter { - right: 5px; - top: 3px; - } - .mfp-img-mobile .mfp-close { - top: 0; - right: 0; - width: 35px; - height: 35px; - line-height: 35px; - background: rgba(0, 0, 0, 0.6); - position: fixed; - text-align: center; - padding: 0; - } - .mfp-img-mobile .mfp-figure small { - display: inline; - margin-left: 5px; - } - } - } - -} - - - -// Scale navigation arrows and reduce padding from sides -@media all and (max-width: 800px) { - .mfp-arrow { - -webkit-transform: scale(0.75); - transform: scale(0.75); - } - .mfp-arrow-left { - -webkit-transform-origin: 0; - transform-origin: 0; - } - .mfp-arrow-right { - -webkit-transform-origin: 100%; - transform-origin: 100%; - } - .mfp-container { - padding-left: $popup-padding-left-mobile; - padding-right: $popup-padding-left-mobile; - } -} - - - -// IE7 support -// Styles that make popup look nicier in old IE -@if $IE7support { - .mfp-ie7 { - .mfp-img { - padding: 0; - } - .mfp-bottom-bar { - width: 600px; - left: 50%; - margin-left: -300px; - margin-top: 5px; - padding-bottom: 5px; - } - .mfp-container { - padding: 0; - } - .mfp-content { - padding-top: 44px; - } - .mfp-close { - top: 0; - right: 0; - padding-top: 0; - } - } -} diff --git a/app/assets/stylesheets/common/mobile.scss b/app/assets/stylesheets/common/mobile.scss deleted file mode 100644 index eab0f0e33..000000000 --- a/app/assets/stylesheets/common/mobile.scss +++ /dev/null @@ -1,23 +0,0 @@ -@media only screen -and (min-device-width : 320px) -and (max-device-width : 540px) { - #reply-control { - .toggle-preview { display:none; } - #reply-title { width: 250px; } - .wmd-controls { - #wmd-input { - width: 100%; - border-top: 0; - } - .preview-wrapper { - display: none; - } - .textarea-wrapper { - width: 100%; - } - .wmd-button-bar { - display: none; - } - } - } -} diff --git a/app/assets/stylesheets/common/modal.css.scss b/app/assets/stylesheets/common/modal.css.scss deleted file mode 100644 index 4589c5b6e..000000000 --- a/app/assets/stylesheets/common/modal.css.scss +++ /dev/null @@ -1,349 +0,0 @@ -// base styles for every modal popup used in Discourse - -@import "common/foundation/variables"; -@import "common/foundation/mixins"; - -.modal-open { - .dropdown-menu { - z-index: 2050; - } - .dropdown.open { - *z-index: 2050; - } - .popover { - z-index: 2060; - } - .tooltip { - z-index: 2070; - } - -} - -.modal-backdrop { - position: fixed; - top: 0; - right: 0; - bottom: 0; - left: 0; - z-index: 1040; - background-color: #000000; - &.fade { - opacity: 0; - } -} - -.modal-backdrop, -.modal-backdrop.fade.in { - opacity: 0.8; - filter: alpha(opacity=80); -} - -.modal-outer-container { - display:table; - width:100%; - height:100%; -} -.modal-middle-container { - display:table-cell; - vertical-align: middle; -} -.modal-inner-container { - max-width: 710px; - margin: 0 auto; - background-color: #ffffff; - border: 1px solid #999; - border: 1px solid rgba(0, 0, 0, 0.3); - *border: 1px solid #999; - /* IE6-7 */ - - @include border-radius-all (6px); - box-shadow: 0 3px 7px rgba(0, 0, 0, 0.3); - background-clip: padding-box; -} -.modal { - position: fixed; - top: 0; - width: 100%; - height: 100%; - z-index: 1050; - overflow: auto; -} - -// Hardcode to be the same as before for now. I would recommend not using bootbox, or finding a way so the html structure can be the same -.bootbox.modal { - position: fixed; - top: 50%; - left: 50%; - z-index: 1050; - overflow: auto; - width: 610px; - height: auto; - margin: -250px 0 0 -305px; - background-color: #ffffff; - border: 1px solid #999; - border: 1px solid rgba(0, 0, 0, 0.3); - *border: 1px solid #999; - /* IE6-7 */ - - @include border-radius-all (6px); - box-shadow: 0 3px 7px rgba(0, 0, 0, 0.3); - background-clip: padding-box; -} - -.modal.fade { - -webkit-transition: opacity .3s linear, top .3s ease-out; - transition: opacity .3s linear, top .3s ease-out; - top: -25%; -} -.modal.fade.in { - top: 50%; -} -.modal-body { - overflow-y: auto; - max-height: 400px; - padding: 15px; -} -.modal-form { - margin-bottom: 0; -} -.modal-footer { - margin: 0 15px; - padding: 14px 0 15px; - border-top: 1px solid #ddd; - @include border-radius-all(0 0 6px 6px); - @include box-shadow (inset 0 1px 0 #ffffff); - *zoom: 1; -} -.modal-footer:before, -.modal-footer:after { - display: table; - content: ""; -} -.modal-footer:after { - clear: both; -} -.modal-footer .btn + .btn { - margin-left: 5px; - margin-bottom: 0; -} -.modal-footer .btn-group .btn + .btn { - margin-left: -1px; -} -.modal-header { - border-bottom: 1px solid #9baab2; - @include box-shadow((0 1px 3px rgba($black, 0.12), inset 0 -4px 4px -4px rgba($black, 0.3))); - h3 { - color: $nav-pills-background-color-active; - font-size: 20px; - padding: 10px 15px 7px; - } - .close { - float: right; - font-size: 20px; - margin: 10px 10px 0px; - text-decoration: none; - color: $modal-close-button-color; - cursor: pointer; - &:hover { - color: darken($modal-close-button-color,20); - } - } -} - -.modal { - .nav { - padding: 10px 30px; - background-color: #e6e6e6; - li > a { - font-size: 14px; - } - border-bottom: 1px solid #bbb; - - } - &.hidden { - display: none; - } - .modal-body { - textarea { - width: 99%; - height: 80px; - } - label { - color: $darkish_gray; - } - p { - color: $black; - font-size: 13px; - } - .archetype-option { - margin-bottom: 20px; - } - .warning { - color: lighten($red, 10%) !important; - } - } - .password-confirmation { - display: none; - } - - section.field { - margin-bottom: 20px; - } -} - -#move-selected { - p { - margin-top: 0; - } - - input[type=radio] { - margin-right: 10px; - } - - button { - margin-top: 10px; - display: block; - width: 300px; - } - - form { - margin-top: 20px; - input[type=text] { - width: 500px; - } - } -} - -.flag-modal { - max-height: 450px; -} - -.custom-message-length { - margin-bottom: 10px; - margin-left: 20px; -} - -.flag-message { - margin-left: 20px; - width: 95% !important; -} - -.edit-category-modal { - .modal-body { - position: relative; - height: 350px; - } - &.small .modal-body { - height: 310px; - } - .secure-category-options { - margin: 10px 0 0 16px; - .badge-list { - margin: 10px 0; - li { - margin: 0 4px 8px 0; - a { - color: #888; - cursor: pointer; - } - a:hover { - color: $black; - } - } - } - } -} - -.tabbed-modal { - .modal-body { - position: relative; - height: 350px; - } -} - -.modal-tab { - position: absolute; -} - -.invite-modal { - overflow: visible; - .ember-text-field { - width: 550px; - } -} - -.reply-where-modal { - width: 370px; - margin-left: -185px; - .modal-footer { - .btn { - text-align: left; - font-size: 18px; - line-height: 20px; - width: 310px; - margin-bottom: 10px; - display: block; - margin-left: 0; - .topic-title { - font-size: 13px; - font-weight: normal; - } - &.btn-reply-here { - @include linear-gradient(#ddd, #ddd); - text-shadow: none; - color: $darkish_gray; - } - } - .cancel { - text-decoration: underline; - float: right; - margin-right: 5px; - } - } -} - -.delete-user-modal { - .modal-footer { - .btn { - font-weight: normal; - text-align: left; - font-size: 14px; - line-height: 20px; - margin-bottom: 10px; - display: inline-block; - margin-left: 0; - } - .cancel { - text-decoration: underline; - display: block; - margin-right: 5px; - } - } -} - -.flagging-delete-spammer, .delete-all-posts { - .modal-footer .cancel { - text-decoration: underline; - margin-left: 10px; - } -} - -.permission-list{ - list-style:none; - margin: 0 0 30px; - padding: 0; - .name { - margin-right: 20px; - display: inline-block; - min-width: 100px; - } - .permission { - margin-left: 20px; - } - .icon-remove-sign { - margin-left: 5px; - } - li { - margin-bottom: 10px; - } -} diff --git a/app/assets/stylesheets/common/onebox.scss b/app/assets/stylesheets/common/onebox.scss deleted file mode 100644 index 3ec03708f..000000000 --- a/app/assets/stylesheets/common/onebox.scss +++ /dev/null @@ -1,85 +0,0 @@ -@import "common/foundation/variables"; -@import "common/foundation/mixins"; - -a.loading-onebox { - background: { - image: image-url("spinner_96.gif"); - position: 0; - size: 20px; - height: 25px; - repeat: no-repeat; - }; - padding-left: 25px; -} - -.onebox-result { - font-size: 14px; - > .source { - margin-bottom: 10px; - margin-right: 10px; - padding: 10px 0; - display: block; - color: $black; - position: relative; - border-bottom: 1px solid $inner_border; - .info { - a { - color: black; - text-decoration: none; - } - background-color: $white; - position: absolute; - font-size: 14px; - img.favicon { - margin-right: 3px; - } - } - } - .onebox-result-body { - padding-top: 5px; - font-family: Georgia, Times, "Times New Roman", serif; - img { - max-width:200px; - } - h3, h4 { - margin: 0px !important; - } - img.thumbnail { - max-width: 25%; - height: auto; - } - code { - max-height: 400px; - } - img { - max-width: 30%; - max-height: 80%; - float: left; - margin-right: 10px; - } - .metrics { - clear: both; - padding-bottom: 25px; - .metric { - display: inline-block; - padding-left: 33px; - float: left; - } - } - } -} - -// RottenTomatoes Onebox -.onebox-result { - .onebox-result-body { - img.verdict { - float: none; - margin-right: 7px; - } - img.popcorn { - float: none; - margin-left: 20px; - margin-right: 5px; - } - } -} diff --git a/app/assets/stylesheets/common/pagedown.css.scss b/app/assets/stylesheets/common/pagedown.css.scss deleted file mode 100644 index 5922d1dda..000000000 --- a/app/assets/stylesheets/common/pagedown.css.scss +++ /dev/null @@ -1,149 +0,0 @@ -// styles that apply to the PageDown editor -// http://code.google.com/p/pagedown/ - -@import "common/foundation/mixins"; - -.wmd-panel { - margin-left: 25%; - margin-right: 25%; - width: 50%; - min-width: 500px; -} - -.wmd-button-bar { - width: 100%; -} - -.wmd-button-row { - margin-left: 5px; - margin-right: 5px; - margin-bottom: 5px; - margin-top: 10px; - padding: 0px; - height: 20px; -} - -.wmd-spacer { - width: 1px; - height: 20px; - margin-right: 8px; - margin-left: 5px; - background-color: silver; - display: inline-block; - float: left; -} - -.wmd-button { - width: 20px; - height: 20px; - padding-left: 2px; - padding-right: 3px; - margin-right: 5px; - background-repeat: no-repeat; - background-position: 0px 0px; - border: 0px; - width: 20px; - height: 20px; - position: relative; - border: 0; - float: left; - - font-family: FontAwesome; - font-weight: normal; - font-style: normal; - text-decoration: inherit; - display: inline; - width: auto; - height: auto; - line-height: normal; - vertical-align: baseline; - background-image: none !important; - background-position: 0% 0%; - background-repeat: repeat; - background-color: white; - padding: 4px; -} - -.wmd-button:hover { - background-color: #99c0fa; -} - - -#wmd-bold-button:before { - content: "\f032"; -} - - -#wmd-italic-button:before { - content: "\f033"; -} - -#wmd-link-button:before { - content: "\f0c1"; -} - -#wmd-quote-button:before { - content: "\f10e"; -} - -#wmd-code-button:before { - content: "\f121"; -} - -#wmd-image-button:before { - content: "\f093"; -} - -#wmd-olist-button:before { - content: "\f0cb"; -} - -#wmd-ulist-button:before { - content: "\f0ca"; -} - -#wmd-heading-button:before { - content: "\f031"; -} - -#wmd-hr-button:before { - content: "\f068"; -} - -#wmd-undo-button:before { - content: "\f0e2"; -} - -#wmd-redo-button:before { - content: "\f01e"; -} - -#wmd-quote-post:before { - content: "\f0e5"; -} - -.wmd-prompt-background { - background-color: black; -} - -.wmd-prompt-dialog { - border: 1px solid #999999; - background-color: whitesmoke; -} - -.wmd-prompt-dialog > div { - font-size: 0.8em; - font-family: arial, helvetica, sans-serif; -} - -.wmd-prompt-dialog > form > input[type="text"] { - border: 1px solid #999999; - color: black; -} - -.wmd-prompt-dialog > form > input[type="button"] { - border: 1px solid #888888; - font-family: trebuchet MS, helvetica, sans-serif; - font-size: 0.8em; - font-weight: bold; -} diff --git a/app/assets/stylesheets/common/request_access.css.scss b/app/assets/stylesheets/common/request_access.css.scss deleted file mode 100644 index b67de0334..000000000 --- a/app/assets/stylesheets/common/request_access.css.scss +++ /dev/null @@ -1,13 +0,0 @@ -#request-access { - width: 325px; - margin: 0 auto; - input[type=text] { - width: 320px; - height: 30px; - font-size: 22px; - } - input[type=submit] { - font-size: 22px; - padding: 10px; - } -} diff --git a/app/assets/stylesheets/common/share_link.css.scss b/app/assets/stylesheets/common/share_link.css.scss deleted file mode 100644 index 3ffdc039a..000000000 --- a/app/assets/stylesheets/common/share_link.css.scss +++ /dev/null @@ -1,39 +0,0 @@ -// styles that apply to the "share" popup when sharing a link to a post or topic - -@import "common/foundation/variables"; -@import "common/foundation/mixins"; - -#share-link { - position: absolute; - left: 20px; - z-index: 990; - @include border-radius-all(3px); - @include box-shadow(1px 1px 5px $darkish_gray); - background-color: $light_gray; - padding: 3px 7px 6px 7px; - width: 300px; - display: none; - &.visible { - display: block; - } - input[type=text] { - width: 96%; - } - h3 { - font-size: 13px; - } - .social-link { - margin-left: 2px; - margin-right: 8px; - float: left; - font-size: 22px; - } - .link { - margin-right: 2px; - float: right; - font-size: 20px; - a { - color: $black; - } - } -} diff --git a/app/assets/stylesheets/common/topic-admin-menu.css.scss b/app/assets/stylesheets/common/topic-admin-menu.css.scss deleted file mode 100644 index 3c9228385..000000000 --- a/app/assets/stylesheets/common/topic-admin-menu.css.scss +++ /dev/null @@ -1,32 +0,0 @@ -// Styles for the topic admin menu - -@import "common/foundation/variables"; -@import "common/foundation/mixins"; - -#show-topic-admin { - position: fixed; - top: 70px; - right: 10px; - z-index: 1000; -} - -.topic-admin-menu { - background-color: $white; - width: 205px; - padding: 10px; - border: 1px solid $gray; - position: fixed; - top: 70px; - right: 10px; - z-index: 1000; - - ul { - list-style: none; - margin: 10px 0 0 0; - } - - button { - width: 200px; - margin-bottom: 5px; - } -} \ No newline at end of file diff --git a/app/assets/stylesheets/common/topic-list.css.scss b/app/assets/stylesheets/common/topic-list.css.scss deleted file mode 100644 index c513aa360..000000000 --- a/app/assets/stylesheets/common/topic-list.css.scss +++ /dev/null @@ -1,339 +0,0 @@ -@import "common/foundation/variables"; -@import "common/foundation/mixins"; - -// -------------------------------------------------- -// Topic lists -// -------------------------------------------------- - -// List controls -// -------------------------------------------------- - -#list-controls { - .nav { - float: left; - margin-bottom: 15px; - } - .btn { - float: right; - margin-left: 8px; - } -} - -#category-filter { - .has-icon span:before { - margin-right: 4px; - font: 15px/0.9 "FontAwesome"; - } - .has-icon .favorited:before { - content: "\f005"; - } - .has-icon .unread:before { - content: "\f02e"; - } -} - -// Base list -// -------------------------------------------------- - -#topic-list { - width: 100%; - border-collapse: separate; - border-spacing: 0; - border: 1px solid $topic-list-border-color; - @include border-radius-all(4px 4px 0 0); - @include box-shadow(0 1px 3px rgba($black, 0.22)); - tbody tr { - background-color: $white; - &:nth-child(even) { - background-color: darken($white, 2%); - } - &.archived a { - opacity: 0.6; - } - &.has-excerpt .star { - vertical-align: top; - margin-top: 2px; - } - &.category-description { - td { - color: $nav-pills-border-color-active; - } - } - &.highlighted { - background-color: $highlight; - } - } - th, - td { - padding: 7px 5px; - line-height: 1.25; - text-align: left; - vertical-align: middle; - &:first-of-type { - padding-left: 10px; - } - &:last-of-type { - padding-right: 10px; - } - } - th { - color: $topic-list-th-color; - font-weight: bold; - font-size: 13px; - @include box-shadow(inset 0 1px 0 $white); - &:first-of-type { - @include border-radius-all(4px 0 0 0); - } - &:last-of-type { - @include border-radius-all(0 4px 0 0); - } - } - td { - //border-top: 1px solid $topic-list-td-border-color; - color: $topic-list-td-color; - font-size: 14px; - } - .star { - width: 20px; - padding-right: 0; - .icon-star { - position: relative; - top: 1px; - } - + .main-link { - padding-left: 0; - } - } - .main-link { - width: 495px; - font-size: 16px; - - i.score { - color: green; - cursor: pointer; - } - } - - .topic-excerpt { - font-size: 14px; - margin-top: 8px; - color: $dark_gray; - } - - .rank-details { - background-color: #eee; - padding: 6px; - margin-bottom: 5px; - - p { - font-size: 12px; - margin: 0; - line-height: 14px; - } - } - - @include medium-width { - .main-link { - width: 380px; - } - } - @include small-width { - .main-link { - width: 335px; - } - } - .topic-statuses:empty { - display: none; - } - .topic-status { - margin-right: 4px; - padding: 0; - &:last-of-type { - margin-right: 0; - } - } - .badge-notification { - position: relative; - top: -1px; - } - .category { - width: 140px; - } - .posters { - width: 150px; - > a { - float: left; - margin-right: 4px; - &:last-of-type { - margin-right: 0; - } - } - } - .avatar { - &.latest { - @include box-shadow(0 0 6px 1px desaturate(lighten($link_color, 18%), 35%)); - } - } - .num { - text-align: center; - a:not(.badge-posts) { - color: inherit; - } - } - .likes { - width: 50px; - } - .activity { - width: 50px; - } - .age { - width: 60px; - } -} - -// Category list -// -------------------------------------------------- - -.category-column { - float: left; - width: 550px; - &.first { - margin-right: 10px; - } -} - -@include medium-width { - .category-column { - width: 493px; - &.first { - margin-right: 9px; - } - } -} - -@include small-width { - .category-column { - width: 470px; - } -} - -.category-list-item { - margin-bottom: 10px; - #topic-list tbody tr:nth-child(even) { - background-color: $white; - } - .badge-category { - float: left; - margin: 1px 4px 0 0; - } - .posters { - float: left; - } - > footer { - border: 1px solid $topic-list-border-color; - border-top: 0; - padding: 7px 10px; - background-color: lighten($topic-list-th-background-color, 2%); - @include border-radius-all(0 0 4px 4px); - @include box-shadow(0 1px 3px rgba($black, 0.22)); - figure { - float: left; - margin: 3px 7px 0 0; - color: lighten($topic-list-th-color, 5%); - font-weight: bold; - font-size: 12px; - text-shadow: 0 1px 0 $white; - } - figcaption { - display: inline; - font-weight: normal; - } - .btn { - float: right; - margin-left: 7px; - } - } -} - -// Loading -// -------------------------------------------------- - -// List - -.loading #topic-list { - border: 0; - @include box-shadow(none); - tr { - background-color: transparent; - } -} - -// Topics - -#topic-list-bottom { - margin: 20px 0; -} - -.topics-loading { - width: 200px; - margin: 0 auto; - padding: 10px 0 10px 43px; - color: $white; - font-size: 18px; - line-height: 25px; - background: { - color: $black; - image: image-url("spinner_96_w.gif"); - repeat: no-repeat; - position: 10px 50%; - size: 25px; - }; - @include border-radius-all(12px); -} - -// Misc. stuff -// -------------------------------------------------- - -#main { - #list-controls { - .badge-category { - display: inline-block; - background-color: yellow; - margin: 8px 0 0 8px; - float: left; - } - clear: both; - } - #list-area { - margin-bottom: 300px; - .empty-topic-list { - padding: 10px; - } - .unseen { - background-color: transparent; - padding: 0; - border: 0; - color: lighten($red, 10%); - font-size: 13px; - cursor: default; - } - } - #topic-list { - .alert { - margin-bottom: 0; - font-size: 14px; - } - .spinner { - margin-top: 40px; - } - } - span.posted { - display: inline-block; - text-indent: -9999em; - width: 15px; - height: 15px; - background: { - image: image-url("posted.png"); - }; - } -} diff --git a/app/assets/stylesheets/common/topic-post.css.scss b/app/assets/stylesheets/common/topic-post.css.scss deleted file mode 100644 index 4d7bf7de1..000000000 --- a/app/assets/stylesheets/common/topic-post.css.scss +++ /dev/null @@ -1,823 +0,0 @@ -@import "common/foundation/variables"; -@import "common/foundation/mixins"; - -@include small-width { - #selected-posts { - display: none; - } - .topic-body { - width: 670px; - } -} - - -@include medium-width { - #selected-posts { - margin-left: 330px; - width: 12%; - p { - font-size: 13px; - } - } -} - - -@include large-width { - #selected-posts { - margin-left: 275px; - width: 20%; - } -} - - -#selected-posts { - position: fixed; - z-index: 1000; - left: 50%; - @include border-radius-all(4px); - background-color: lighten($blue, 52%); - border: 1px solid lighten($blue, 40%); - padding: 5px; - margin-bottom: 5px; - - button { - width: 160px; - margin: 4px auto; - display: inline-block; - text-align: left; - } - - &.hidden { - display: none; - } - .controls { - margin-top: 10px; - } - p { - margin: 0 0 10px 0; - } - p.cancel { - margin: 10px 0 0 0; - } - h3 { - font-size: 25px; - color: $black; - margin-bottom: 5px; - i { - margin-right: 7px; - } - } -} - -@include small-width { - .topic-post { - .gutter { - width: 100px; - } - } -} - - -@include medium-width { - .topic-post { - .gutter { - width: 160px; - } - } -} - - -.topic-post { - margin-bottom: 8px; - pre code { - max-height: 690px; - } - @include hover { - .gutter { - .reply-new, - .track-link { - opacity:1; - } - } - } - - .gutter { - .reply-new{ - .discourse-no-touch & { - opacity: 0; - } - .discourse-touch & { - opacity: 1; - } - transition:opacity 1s linear; - -webkit-transition:opacity 1s linear; - } - .reply-new, - .track-link { - display: inline-block; - color: #808080; - font-size: 13px; - .discourse-touch & { - visibility: visible; - } - &:hover { - color: #2eaee5; - } - &:active { - color: #1d92c5; - } - i { - position: relative; - width: 19px; - margin-right: 6px; - border: 1px solid #b9b9b9; - font-size: 14px; - line-height: 19px; - text-align: center; - background-color: #fafafa; - padding: 1px 2px; - @include border-radius-all(20px); - &:after { - display: block; - position: absolute; - top: 9px; - left: -13px; - width: 12px; - height: 0; - content: ""; - border-top: 1px solid #ccc; - } - } - } - .reply-new i { - padding-top: 2px; - padding-left: 3px; - padding-right: 3px; - line-height: 17px; - color: $attention_fg; - background-color: $attention_bg; - } - .post-links { - margin: 0; - list-style: none; - > li { - margin-bottom: 10px; - } - .incoming .icon-arrow-right:before { - content: "\f060"; - } - } - } - - // Moderator post colours - &.moderator { - article.boxed { - .topic-body { - .contents { - background-color: #eef0ff; - &:after { - display: none; - } - } - &:after{ - border-right-color: #eef0ff; - } - } - } - } - img[alt=hidden] { - display: none; - } - ul { - li { - font-size: 14px; - } - } - .multi-select & { - section.post-menu-area { - display: none !important; - } - } - @include hover { - section.post-menu-area { - display: block; - } - } - - section.post-menu-area { - .discourse-no-touch & { - opacity: 0.2; - @include fade-soft(1s); - } - } - - &:hover section.post-menu-area { - opacity: 1; - } - - button.show-replies { - - span.badge-posts { - margin-right: 6px; - } - - i.icon { - margin-left: 6px; - font-size: 10px; - } - - color: $controls; - border: none; - background: none; - padding: 8px 10px; - border-right: 1px solid $inner_border; - } - - .contents:not(.bottom-round) .show-replies { - position: absolute; - padding-bottom: 9px; - border-right-color: #b9b9b9; - background-color: #e9e6e6; - } - - section.post-menu-area { - @include unselectable; - background-color: $post_footer; - overflow: hidden; - @include box-shadow(inset 0 -4px 4px -4px rgba($black, 0.14)); - nav.post-controls { - @include unselectable; - padding: 0px; - button { - border: none; - color: $nav-button-color; - background: $post_footer; - font-size: 15px; - padding: 8px 10px; - border-left: 1px solid lighten($inner_border, 3%); - vertical-align: top; - @include box-shadow(inset 0 -4px 4px -4px rgba($black, 0.14)); - &:hover { - color: $nav-button-color-hover; - background-color: $nav-button-background-color-hover; - } - &:active { - color: $nav-button-color-active; - background-color: $nav-button-background-color-active; - } - &.hidden { - display: none; - } - &.like, &.edit, &.flag, &.delete, &.share, &.bookmark, &.create { - float: right; - } - .read-icon { - &:before { - font-family: "FontAwesome"; - content: "\f02e"; - } - &.unseen { - &:before { - content: "\f097"; - } - } - &.last-read { - color: $red; - } - &.bookmarked { - &:before { - color: $bookmarkColor; - } - } - } - } - button.create { - color: $attention_fg; - font-weight:bold; - background-color: $attention_bg; - &:hover { - color: darken($attention_fg, 4%); - background-color: darken($attention_bg, 4%); - } - &:active { - color: darken($attention_fg, 8%); - background-color: darken($attention_bg, 8%); - } - i { - font-size: 13px; - margin-right: 4px; - } - } - button.delete { - &:hover { - color: white; - background-color: $btn-danger-background-color; - } - } - - button.like { - &:hover { - color: $nav-like-button-color-hover; - background-color: $nav-like-button-background-color-hover; - } - &:active { - color: $nav-like-button-color-active; - background-color: $nav-like-button-background-color-active; - } - } - &.toggled { - display: block; - } - .post-number { - // display: inline-block; - display: none; - line-height: 8px; - margin-left: 3px; - font-size: 14px; - .discourse-touch & { - margin-right: 29px; - } - } - } - } - - .bottom-round > .post-menu-area { - border-bottom-left-radius: 4px; - border-bottom-right-radius: 4px; - } - - .topic-meta-data { - .contents { - text-align: center; - padding: 0 10px 0 0; - h3 { - margin: 3px 0 0; - font-size: 13px; - line-height: 18px; - } - - .staff a { - @include border-radius-all(3px); - padding: 1px 3px; - background-color: #ffe; - border: 1px solid #ffd; - } - - h3.new-user a[href] { - color: $dark_gray; - } - - div { - display: block; - } - .score { - font-size: 12px; - } - .user-title { - font-size: 11px; - margin-top: 2px; - line-height: 15px; - color: #555; - } - } - } - .topic-meta-data-inside { - float: right; - z-index: 490; - margin-left: 20px; - .post-info { - font-size: 12px; - display: inline-block; - margin-right: 12px; - &.edits { - a, a:visited, span { - color: #aaa; - } - } - } - .post-date { - color: #aaa; - } - } - .reply-to-tab { - z-index: 490; - font-size: 12px; - color: $darkish_gray; - display: block; - padding: 5px 5px 5px 8px; - @include border-radius-bottom(4px); - text-decoration: none; - position: absolute; - left: 120px; - background-color: #fafafa; - border: 1px solid #DDD; - margin-top: -1px; - @include box-shadow(1px 1px 2px rgba($black, 0.07)); - img { - margin-left: 6px; - } - @include hover { - background-color: mix($gray, $light_gray, 5%); - } - } - .embedded-posts.bottom { - @include border-radius-bottom(4px); - border-bottom: 1px solid #b9b9b9; - overflow: hidden; - .arrow { - float: right; - margin: 3px 0 3px 0; - } - } - .embedded-posts.top { - @include border-radius-top(4px); - border-top: 1px solid #ddd; - overflow: hidden; - } - - .embedded-posts { - background-color: #e9e6e6; - - .reply:nth-of-type(1) .row { - padding-top:10px; - } - - .topic-meta-data-inside { - margin: 3px -8px 3px 20px; - } - - div.reply { - border-left: 1px solid #ddd; - border-right: 1px solid #ddd; - padding: 0 10px 10px 10px; - margin: 0; - background-clip: padding-box; - .topic-meta-data { - .contents { - border: 0; - color: rgba(#323232, 0.9); - font-size: 10px; - line-height: 12px; - background-color: transparent; - @include box-shadow(none); - h5 { - margin-top: 5px; - font-size: 11px; - line-height: 13px; - } - } - } - .topic-body { - z-index: 10; - border: 1px solid #ddd; - padding: 0 8px; - color: black; - background-color: $white; - background-clip: padding-box; - @include border-radius-all(4px); - @include box-shadow(0 1px 2px rgba($black, 0.07)); - &:before { - left: -10px; - } - &:after { - left: -9px; - } - - a.arrow { - color: grey; - } - } - .about { - .contents { - padding: 0; - } - } - } - } - &.selected { - article.boxed { - .post-select { - background-color: $blue; - color: $white; - } - .topic-body { - .contents { - @include box-shadow(0px 0px 7px $blue); - } - .contents:after { - display: none; - } - } - } - } - article.boxed { - position: relative; - font-size: 16px; - line-height: 20px; - - .post-select { - @include border-radius-all(4px); - background-color: $light_gray; - border-top: 1px solid $white; - border-left: 1px solid $white; - border-bottom: 1px solid $gray; - border-right: 1px solid $gray; - color: $darkish_gray; - top: 4px; - position: absolute; - right: 5px; - font-size: 12px; - padding: 2px 5px; - z-index: 490; - } - - img { - max-width: 100%; - } - video { - max-width: 100%; - height: auto; - } - audio { - max-width: 100%; - } - - .topic-body { - position: relative; - .contents { - .cooked { - padding: 10px 10px 0; - } - position: relative; - padding: 0; - background-color: $white; - word-wrap: break-word; - @include border-radius-top(4px); - .calc { - background-color: $highlight; - margin-bottom: 10px; - padding: 4px 8px; - display: none; - p { - font-size: 12px; - margin: 0 0 5px 0; - } - } - &.highlighted { - background-color: $highlight; - } - } - .contents.bottom-round { - overflow: hidden; - background-clip: padding-box; - @include border-radius-bottom(4px); - @include box-shadow(0 1px 2px rgba($black, 0.07)); - } - .contents.avoid-tab { - .topic-meta-data-inside { - position: relative; - top: -30px; - } - padding-top: 30px; - .cooked { - padding-top: 10px; - } - } - .post-actions { - padding: 3px 0 0px 15px; - font-size: 12px; - img { - margin-right: 2px; - } - } - footer { - padding-left: 35px; - } - } - section { - font-size: 14px; - color: $dark_gray; - } - } -} - - -.topic-body { - position: relative; - - // this removes the topmost margin; - // if we don't have this, all posts would have extra space at the top - .cooked > *:first-child { - margin-top: 0px !important; - } - - // ditto for blockquotes, no extra margin for first element inside please - .cooked > blockquote *:first-child { - margin-top: 0px !important; - } - - .cooked { - // set up proper header margins in posts - h1, h2, h3, h4, h5, h6 { - margin: 20px 0 10px; - } - } - - // this is the little pointy bit of the speech bubble on the post, on the left side - &:before, - &:after { - position: absolute; - width: 0; - height: 0; - content: ""; - border-style: solid; - border-color: transparent; - pointer-events: none; - } - &:before { - top: 12px; - left: -9px; - border-width: 10px 10px 10px 0; - border-right-color: #dfdfdf; - } - &:after { - top: 13px; - left: -8px; - border-width: 9px 9px 9px 0; - border-right-color: $white; - } -} - -.topic-post.hidden { - display: block; - opacity: 0.4; -} - -.topic-post.deleted { - opacity: 0.8; - article.boxed { - .topic-body .contents { - background-color: #ffcece; - } - .topic-body::after { - border-right-color: #ffcece; - } - } -} - -// Topic summary -// -------------------------------------------------- - -.topic-summary { - margin-top: 8px; - background-color: darken($white, 3%); - @include border-radius-all(4px); - @include box-shadow(0 1px 2px rgba($black, 0.07)); - h3 { - margin-bottom: 4px; - color: #323232; - line-height: 23px; - } - h4 { - margin: 0 0 3px 0; - color: #6c7376; - font-weight: normal; - font-size: 12px; - line-height: 15px; - } - p, - .participants { - margin: 0 0 7px; - } - ul { - margin: 0; - list-style: none; - } - .avatars { - > div { - float: left; - position: relative; - margin: 3px 0; - } - .post-count { - position: absolute; - top: 2px; - right: 6px; - padding: 0 4px; - color: $white; - font-weight: normal; - font-size: 11px; - line-height: 14px; - background-color: rgba($black, 0.5); - @include border-radius-all(2px); - } - } - .avatar { - float: left; - margin-right: 4px; - } - .poster.toggled .avatar { - @include box-shadow(0 0 6px 1px desaturate(lighten($link_color, 18%), 35%)); - } - .summary { - border-bottom: 1px solid #d1d1d2; - &.collapsed { - border-bottom: 0; - } - li { - float: left; - border-right: 1px solid #e6e6e6; - padding: 7px 14px; - &:last-of-type { - border-right: 0; - } - } - a, - .number { - font-weight: bold; - line-height: 20px; - } - .number { - color: #445a62; - } - .avatar + a { - float: left; - } - } - .avatars, - .links, - .information { - padding: 7px 14px; - color: #000; - } - .information { - border-top: 1px solid #d1d1d2; - } - .topic-links { - .badge-notification { - margin: 0 0 4px; - } - } - .buttons { - @include unselectable; - float: right; - .btn { - border: 0; - border-left: 1px solid #e6e6e6; - padding: 0 23px; - color: #4c666f; - background: #eaf2f5; - text-shadow: 0 1px 0 rgba($white, 0.28); - @include border-radius-all(0 2px 0 0); - @include box-shadow(none); - &:hover { - background: darken(#eaf2f5, 5%); - } - &.collapsed { - @include border-radius-all(0 2px 2px 0); - } - .icon { - margin: 0; - font-size: 18px; - line-height: 52px; - } - } - } -} - -// Custom Gutter Glyphs -// -------------------------------------------------- - -.private_message .gutter { - position: relative; - &:before { - display: block; - position: absolute; - top: 0; - left: 0; - color: rgba($black, 0.05); - font: 90px/1 FontAwesome; - content: "\f0e0"; - } -} - - -.deleted-topic .gutter, .read_restricted .gutter { - position: relative; - &:before { - display: block; - position: absolute; - top: 0; - left: 0; - color: rgba($black, 0.05); - font: 90px/1 FontAwesome; - content: "\f05c"; - } -} - - -.read_restricted .gutter { - &:before { - content: "\f0c0"; - } -} diff --git a/app/assets/stylesheets/common/topic.css.scss b/app/assets/stylesheets/common/topic.css.scss deleted file mode 100644 index 15a71f77b..000000000 --- a/app/assets/stylesheets/common/topic.css.scss +++ /dev/null @@ -1,514 +0,0 @@ -/* styles that apply when viewing a topic/topic */ - -@import "common/foundation/variables"; -@import "common/foundation/mixins"; - -// Topic title -// -------------------------------------------------- - - -// note that this CSS affects both the docked title and the in-page title -#topic-title, -.extra-info-wrapper { - h1 { - display: inline-block; - max-width: 850px; - margin-top: 5px; - font-size: 22px; - line-height: 28px; - } - - .star { - height: 40px; - font-size: 20px !important; - line-height: 36px !important; - vertical-align: top; - } - .topic-statuses { - &:empty { - display: none; - } - } - .topic-status { - margin: 0 4px 0 0; - padding: 0; - &:last-of-type { - margin-right: 0; - } - > .icon { - display: inline-block; - margin-top: 2px; - vertical-align: top; - font-size: 23px; - line-height: 23px; - } - } - h1 > .badge-category { - margin-top: 5px; - vertical-align: top; - } - .edit-topic { - i { - font-size: 12px; - line-height: 28px; - vertical-align: top; - } - .discourse-no-touch & { - visibility: hidden; - } - } - @include hover { - .edit-topic { - visibility: visible; - } - } - #edit-title, - .chzn-container { - margin: 6px 0; - } - .category-combobox { - width: 330px; - .chzn-drop { - left: -9000px; - width: 328px; - } - .chzn-search input { - width: 278px; - } - } - button { - margin: 8px 0; - vertical-align: top; - } - .btn-primary { - margin-left: 5px; - } -} - - -// when the H1 is docked at the top, there is less room -// due to the username and search / notifications / etc controls -.extra-info-wrapper { - @include medium-width { - h1 { - max-width: 735px; - } - } - @include small-width { - h1 { - max-width: 690px; - } - } -} - - -// Page header -#topic-title { - margin-bottom: 14px; - #edit-title { - width: 350px; - } -} - -// App header -.extra-info-wrapper { - float: left; - margin-left: 10px; -} - -#multi-select-options { - button { - margin-bottom: 5px; - width: 150px; - } -} - -#topic-filter { - background-color: $highlight_light; - padding: 8px; - bottom: 0; - position: fixed; - width: 100%; - font-size: 15px; - z-index: 495 -} - -#main { - // used in topic onebox - .topic-info { - margin-top: 20px; - .info-line { - float: left; - color: lighten($black, 40%); - } - .posters { - margin-right: 10px; - float: right; - } - } - section.divider { - background-color: $dark_gray; - height: 3px; - margin: 10px 0 20px 0; - opacity: 1; - @include transition(opacity 3s); - &.fade { - opacity: 0; - } - } - a.mention, .ac-wrap .item span { - @include border-radius-all(6px); - background-color: $quote-background; - padding: 2px 5px; - color: $darkish_gray; - } - a.mention { - cursor: pointer; - .clicks { - display:none; - } - } - span.spoiler { - background-color: $black; - color: $black; - @include hover { - color: $white; - } - } - - a.attachment:before { - display: inline-block; - margin-right: 4px; - font-family: "FontAwesome"; - content: "\f019"; - } - .attachment + .size { - margin: 0 5px; - } - - // When we are quoting something - aside.quote { - border-left: 5px solid darken($quote-background, 20%); - margin-top: 14px; - font-size: 14px; - line-height: 20px; - padding-left: 5px; - background-color: $quote-background; - overflow: hidden; - &:nth-of-type(1) { - margin: 0; - } - .title { - padding: 8px 8px 0px; - background-color: $quote-background; - a, - .avatar { - margin-right: 4px; - vertical-align: top; - } - } - .quote-controls { - float: right; - color: #323232; - @include fades-in(0.25s); - a { - margin: 0; - } - .back:before, - .quote-other-topic:before { - display: inline-block; - margin-left: 8px; - color: #323232; - font-family: "FontAwesome"; - } - .back:before { - content: "\f062"; - } - .quote-other-topic:before { - content: "\f061"; - } - } - .discourse-touch & { - .quote-controls { - @include visible; - i, - a { - opacity: 0.5; - } - } - } - @include hover { - .quote-controls { - @include visible; - } - } - blockquote { - margin: 0; - border: 0; - padding: 8px; - color: #333; - *:last-child { - margin-bottom: 0; - } - .highlighted { - display: inline; - padding: 3px 5px 3px 8px; - background-color: $highlight; - } - } - } - .quote-button { - background-color: $blue; - z-index: 500; - color: $white; - font-weight: bold; - font-size: 14px; - padding: 5px 9px 5px 9px; - text-decoration: none; - border: 5px solid rgba(0, 0, 0, 0.75); - top: 10px; - left: 10px; - position: absolute; - display: none; - @include border-radius-all(4px); - @include hover { - cursor: pointer; - background-color: lighten($blue, 10%); - } - &.visible { - display: block; - } - } - #topic-bottom { - height: 20px; - } - - #topic-list { - th { - background-color: $topic-list-th-background-color; - } - } - - #suggested-topics { - margin: 40px 0 40px 20px; - width: 1110px; - @include medium-width { width: 970px; } - @include small-width { width: 870px; } - h3 { - font-size: 15px; - margin-left: 6px; - color: darken($darkish_gray, 20%); - margin-bottom: 10px; - } - } - - #topic-footer-buttons { - margin: 20px 0 0 103px; - - width: 1027px; - @include medium-width { width: 887px; } - @include small-width { width: 787px; } - - .btn-group { - margin-top: 20px; - p { - line-height: 32px; - float: left; - margin: 0 10px; - color: #7f7f7f; - } - h4.title { - line-height: 32px; - font-weight: normal; - float: left; - display: inline; - } - } - ul.dropdown-menu { - top: auto; - bottom: 115%; - left: 0px; - } - ul li a { - span { - display: block; - font-size: 11px; - } - span.title { - font-weight: bold; - font-size: 14px; - } - } - button { - margin-right: 5px; - span.caret { - margin-left: 10px; - } - i { - margin-right: 5px; - } - } - } - - #topic-closing-info { - margin-left: 103px; - } -} - -kbd { - white-space: nowrap; - border-style: solid; - border-color: #cccccc #aaaaaa #888888 #bbbbbb; - padding: 0px 6px; - @include box-shadow(0 1px 0 rgba(0, 0, 0, 0.2) 0 0 0 1px white inset); - border-radius: 4px; - background-color: #fafafa; - border-width: 1px 1px 2px; - color: #444444; - font-family: "Helvetica Neue", Helvetica, Arial, Sans-serif; - font-size: 11px; - font-weight: bold; - white-space: nowrap; - display: inline-block; - margin-bottom: 5px; -} - -.post-text img { - max-width: 640px; -} - -#topic-progress-wrapper { - position: fixed; - width: 0; - bottom: 0px; - right: 50%; - z-index: 500; - outline: 1px solid transparent; -} - -.posts .spinner { - width: 100px; - margin: 0 auto 30px 375px; -} - -.posts-wrapper { - position: relative; -} - -#topic-progress-wrapper.docked { - #topic-progress { - margin-left: 6px; - } - position: absolute; -} - -#topic-progress { - position: relative; - left: 275px; - &.hidden { - display: none; - } - border: none; - background-color: $white; - color: $darkish_gray; - width: 130px; - height: 34px; - .nums { - position: relative; - top: 9px; - width: 100%; - text-align: center; - z-index: 1; - } - button { - padding: 0 1px; - cursor: pointer; - z-index: 1000; - position: absolute; - top: 8px; - left: 4px; - border: 0; - background: none; - color: $darkish_gray; - i { - font-size: 18px; - } - &:nth-of-type(2) { - right: 4px; - left: auto; - } - @include hover { - color: darken($darkish_gray, 10%); - &:disabled { - cursor: default; - color: lighten($darkish_gray, 30%); - } - } - - &:disabled { - cursor: default; - color: lighten($darkish_gray, 30%); - } - } - h4 { - display: inline; - font-size: 18px; - line-height: 15px; - } - .bg { - position: absolute; - top: 0px; - bottom: 0px; - width: 0px; - border-right: 1px solid $white; - // background-color: #d4eaf4; - // background-color: #C5E8F7; - background-color: #C6F3B6; - } -} - -#edit-title { - vertical-align: top; -} - -.private_message .participants .user { - float: left; - display: block; - line-height: 35px; - margin-right: 15px; - margin-top: 8px; - &.group { - color: black; - } -} - -.posts-wrapper .spinner { - margin-left: 390px; -} - - -@include medium-width { - .posts-wrapper .spinner { - margin-left: 380px; - } - #topic-progress { - left: 325px; - } -} - - -@include small-width { - .posts-wrapper .spinner { - margin-left: 360px; - } - #topic-progress { - left: 0; - } - #topic-progress-wrapper { - right: 180px; - } -} - -.remove-invited .icon-remove { - font-size: 10px; -} diff --git a/app/assets/stylesheets/common/upload.css.scss b/app/assets/stylesheets/common/upload.css.scss deleted file mode 100644 index 43414d17c..000000000 --- a/app/assets/stylesheets/common/upload.css.scss +++ /dev/null @@ -1,26 +0,0 @@ -@import "common/foundation/variables"; -@import "common/foundation/mixins"; - -.add-upload .icon-plus { - font-size: 10px; - position: relative; - left: -5px; - bottom: -5px; - text-shadow: -1px -1px 0 $btn-primary-background-color, - 1px 1px 0 $btn-primary-background-color, - 1px -1px 0 $btn-primary-background-color, - -1px 1px 0 $btn-primary-background-color; -} - -.upload-selector { - input[type="text"]{ - width: 520px; - } - input[type="file"] { - font-size: 14px; - line-height: 18px; - } - .description { - color: #9a9ea0; - } -} diff --git a/app/assets/stylesheets/common/user.css.scss b/app/assets/stylesheets/common/user.css.scss deleted file mode 100644 index 1f3c1c88e..000000000 --- a/app/assets/stylesheets/common/user.css.scss +++ /dev/null @@ -1,340 +0,0 @@ -// styles that apply to the user page -@import "common/foundation/variables"; -@import "common/foundation/mixins"; - -.user-preferences { - textarea { - width: 530px; - height: 100px; - } - .static { - color: $black; - margin-top: 5px; - margin-left: 5px; - display: inline-block; - } - .instructions { - color: $dark_gray; - margin-left: 165px; - margin-top: 5px; - } - .avatar { - margin-left: 3px; - } - .instructions a[href] { - color: $darkish_gray; - } - .warning { - @include border-radius-all(6px); - background-color: lighten($red, 10%); - padding: 5px 8px; - color: $white; - width: 520px; - } - - .other .controls { - margin-top: 10px; - select { - width: 280px; - } - } -} - -#user-menu { - .btn { - float: right; - margin: 5px 0 0 10px; - } -} - -#about-me { - padding: 4px; - margin: -4px; - display: block; - width: 220px; - min-height: 200px; - background-color: #f8f8f8; - border-radius: 5px; - color: #444; - word-wrap: break-word; -} - -#user-info { - width: 240px; - margin-right: 20px; - float: left; - .summary { - height: 50px; - } - .avatar { - float: left; - width: 45px; - } - nav.buttons { - width: 180px; - padding: 0; - .btn { - width: 100%; - margin-bottom: 5px; - -webkit-box-sizing: border-box; - -moz-box-sizing: border-box; - box-sizing: border-box; - } - } - h2 { - a { - font-size: 14px; - color: #999999; - cursor: pointer; - } - } - .show { - dl { - width: 100%; - overflow: hidden; - dt { - margin: 0; - padding: 0; - width: 80px; - font-size: 12px; - color: #555555; - float: left; - clear: left; - } - dd { - margin: 0; - padding: 0; - width: 100px; - float: left; - color: #444444; - } - } - } - .avatar { - vertical-align: bottom; - a { - display: inline-block; - } - } - form { - .bio { - width: 220px; - height: 150px; - } - } - .side-nav { - margin-top: 5px; - } -} - -#no-invites { - padding: 10px; -} - -#invited-users { - h2 { - color: $darkish_gray; - font-size: 20px; - } - .invites { - margin-bottom: 20px; - tr { - height: 45px; - } - } -} - -#user-menu h1 { - color: #2d3234; - float: left; - padding-left: 150px; - span { - font-size: 18px; - color: #676b6c; - margin-left: 15px; - font-weight: lighter; - position: relative; - top: -4px; - .icon { - margin-left: 5px; - font-size: 14px; - } - } -} - -#user-menu { - margin: 10px 0 0; -} - -.user-heading { - border-bottom: 1px solid #bcbcbc; - background-color: #e6e6e6; - margin-top: -15px; - margin-bottom: 10px; - position: relative; - .nav { - float: right; - margin: 5px 0 14px 5px; - } -} - -.user-info { - margin-bottom: 10px; - .about-me { - position: relative; - border: 1px solid #b9b9b9; - padding: 6px; - @include border-radius-all(4px); - float: left; - width: 936px; - height: 57px; - margin-left: 150px; - background-color: white; - @include box-shadow((0 1px 2px rgba($black, 0.07), inset 0 -4px 4px -4px rgba($black, 0.14))); - &:before, - &:after { - position: absolute; - width: 0; - height: 0; - content: ""; - border-style: solid; - border-color: transparent; - pointer-events: none; - } - &:before { - top: 12px; - left: -10px; - border-width: 10px 10px 10px 0; - border-right-color: #b9b9b9; - } - &:after { - top: 13px; - left: -9px; - border-width: 9px 9px 9px 0; - border-right-color: $white; - } - .missing-profile { - color: lighten(#000, 70%); - } - } - @include medium-width { - .about-me { - width: 821px; - } - } - @include small-width { - .about-me { - width: 776px; - } - } -} - -.user-heading { - .avatar-wrapper { - position: absolute; - display: block; - width: 120px; - } -} - -#user-activity { - width: 840px; - float: left; - margin-bottom: 50px; - - .user-stream { - .excerpt { - margin: 5px 0px; - font-size: 13px; - word-wrap: break-word; - color: lighten($black, 30%); - } - .item.moderator-action { - background-color: #eef0ff; - } - .item.deleted { - opacity: 0.8; - background-color: #ffcece; - } - .item.hidden { - display: block; - opacity: 0.4; - } - .item { - padding: 10px 8px; - background-color: white; - border: 1px solid #b9b9b9; - margin-bottom: 10px; - @include border-radius-all(4px); - @include box-shadow((0 1px 2px rgba($black, 0.07), inset 0 -4px 4px -4px rgba($black, 0.14))); - } - .type { - color: lighten($black, 40%); - } - span.name { - color: lighten($black, 40%); - } - .time { - display: block; - float: right; - color: silver; - margin-right: 8px; - font-size: 11px; - } - .avatar-link { - float: left; - margin-right: 10px; - } - .title { - display: block; - margin-bottom: 4px; - font-size: 14px; - } - } -} - -// styling of bottom section -.user-stream .child-actions { - margin-top: 8px; - .avatar-link { - float: none; - } - .icon { - width: 15px; - display: inline-block; - color: #777; - } - .avatar-wrapper { - border: none; - } - .avatar-link { - margin-right: 3px; - - } -} - -@include medium-width { - #user-activity { - width: 725px; - } -} -@include small-width { - #user-activity { - width: 680px; - } -} - -.avatar-selector { - label { - display: inline-block; - margin-right: 10px; - } - #avatar-input { - width: 0; - height: 0; - overflow: hidden; - } - .avatar { - margin: 5px 10px 5px 0; - } -} diff --git a/app/assets/stylesheets/common/username_tagsinput.css b/app/assets/stylesheets/common/username_tagsinput.css deleted file mode 100644 index 3682dd523..000000000 --- a/app/assets/stylesheets/common/username_tagsinput.css +++ /dev/null @@ -1,31 +0,0 @@ -div.tagsinput { - border:1px solid #CCC; - background: #FFF; - padding:5px 5px 0px; - width:584px; - height:100px; - overflow-y: auto; - border-radius: 4px; -} - -div.tagsinput span.tag { - border: 1px solid #a5d24a; - border-radius: 2px; - display: block; - float: left; - padding: 1px 5px; - text-decoration:none; - background: #cde69c; - color: #638421; - margin-right: 5px; - margin-bottom:5px; - font-family: helvetica; - font-size:13px; -} - -div.tagsinput span.tag a { font-weight: bold; color: #82ad2b; text-decoration:none; font-size: 11px; } -div.tagsinput input { width:80px; margin:0px; font-family: helvetica; font-size: 13px; border:1px solid transparent; -padding:2px 5px; background: transparent; color: #000; outline:0px; margin-right:5px; margin-bottom:5px; } -div.tagsinput div { display:block; float: left; } -.tags_clear { clear: both; width: 100%; height: 0px; } -.not_valid {background: #FBD8DB !important; color: #90111A !important;} diff --git a/app/assets/stylesheets/desktop.css.erb b/app/assets/stylesheets/desktop.css.erb index 0cd21a762..e1b7740f2 100644 --- a/app/assets/stylesheets/desktop.css.erb +++ b/app/assets/stylesheets/desktop.css.erb @@ -1,4 +1,6 @@ // Manifest // //= require common +//= require ./vendor/bootstrap + //= require_tree ./desktop diff --git a/app/assets/stylesheets/vendor/bootstrap.css.scss b/app/assets/stylesheets/vendor/bootstrap.css.scss deleted file mode 100644 index d39fb6399..000000000 --- a/app/assets/stylesheets/vendor/bootstrap.css.scss +++ /dev/null @@ -1,739 +0,0 @@ -/*! - * Bootstrap v2.0.4 - * - * Copyright 2012 Twitter, Inc - * Licensed under the Apache License v2.0 - * http://www.apache.org/licenses/LICENSE-2.0 - * - * Designed and built with all the love in the world @twitter by @mdo and @fat. - * - * NOTE: THIS IS NOT A CLEAN VERSION OF BOOTSTRAP. As we work toward removing the - * default theme's dependency on Bootstrap, we are deleting code from here that is - * no longer required. - */ - - @import "common/foundation/mixins"; - -a:focus { - outline: thin dotted #333; - outline: 5px auto -webkit-focus-ring-color; - outline-offset: -2px; -} -img { - max-width: 100%; -} -.row { - margin-left: -12px; - *zoom: 1; -} -.row:before, -.row:after { - display: table; - content: ""; -} -.row:after { - clear: both; -} -[class*="span"] { - float: left; - margin-left: 12px; -} -.span24 { - width: 1236px; -} -.span15 { - width: 768px; -} -.span14 { - width: 716px; -} -.span13 { - width: 664px; -} -.span11 { - width: 560px; -} -.span10 { - width: 508px; -} -.span8 { - width: 404px; -} -.span6 { - width: 300px; -} -.span5 { - width: 248px; -} -.span4 { - width: 196px; -} -.span3 { - width: 144px; -} -.span2 { - width: 92px; -} -.offset2 { - margin-left: 116px; -} -.offset1 { - margin-left: 64px; -} - -button.btn::-moz-focus-inner, -input[type="submit"].btn::-moz-focus-inner { - padding: 0; - border: 0; -} -.btn-group { - position: relative; -} -.btn-group:before, -.btn-group:after { - display: table; - content: " "; -} -.btn-group:after { - clear: both; -} -.btn-group + .btn-group { - margin-left: 5px; -} -.btn-group > .btn { - position: relative; - float: left; -} -.btn-group > .btn:hover, -.btn-group > .btn:focus, -.btn-group > .btn:active, -.btn-group > .btn.active { - z-index: 2; -} -.btn-group .dropdown-toggle:active, -.btn-group.open .dropdown-toggle { - outline: 0; -} - -.dropdown { - position: relative; -} -.dropdown-toggle { - *margin-bottom: -3px; -} -.dropdown-toggle:active, -.open .dropdown-toggle { - outline: 0; -} -.caret { - display: inline-block; - width: 0; - height: 0; - vertical-align: middle; - border-top: 4px solid #000000; - border-right: 4px solid transparent; - border-left: 4px solid transparent; - content: ""; -} -.dropdown-menu { - position: absolute; - top: 100%; - left: 0; - z-index: 1000; - display: none; - float: left; - min-width: 160px; - padding: 4px 0; - margin: 1px 0 0; - list-style: none; - background-color: #ffffff; - border: 1px solid #ccc; - border: 1px solid rgba(0, 0, 0, 0.2); - *border-right-width: 2px; - *border-bottom-width: 2px; - border-radius: 5px; - box-shadow: 0 5px 10px rgba(0, 0, 0, 0.2); - background-clip: padding-box; -} -.dropdown-menu a { - display: block; - padding: 3px 15px; - clear: both; - font-weight: normal; - line-height: 18px; - color: #333333; - white-space: nowrap; -} -.dropdown-menu li > a:hover, -.dropdown-menu .active > a, -.dropdown-menu .active > a:hover { - color: #ffffff; - text-decoration: none; - background-color: #0088cc; -} -.open { - *z-index: 1000; -} -.open > .dropdown-menu { - display: block; -} -.fade { - opacity: 0; - -webkit-transition: opacity 0.15s linear; - transition: opacity 0.15s linear; -} -.fade.in { - opacity: 1; -} - -body { - - input, textarea, select { - color: #222222; - } - - p, pre, li, ul { - font-size: 14px; - } - p { - line-height: 20px; - } - - code, pre { - font-family: Consolas, Menlo, Monaco, "Lucida Console", "Liberation Mono", "DejaVu Sans Mono", "Bitstream Vera Sans Mono", "Courier New", monospace, serif; - } - - h1, h2, h3, h4, h5, h6 { - margin: 0; - font-family: inherit; - font-weight: bold; - color: inherit; - text-rendering: optimizelegibility; - } - h1 { - font-size: 30px; - line-height: 36px; - } - h2 { - font-size: 24px; - line-height: 36px; - } - h3 { - font-size: 18px; - line-height: 27px; - } - h4, h5, h6 { - line-height: 18px; - } - h4 { - font-size: 14px; - } - h5 { - font-size: 12px; - } - h6 { - font-size: 11px; - color: #999999; - text-transform: uppercase; - } - - // this removes the unwanted top margin on a paragraph under a heading - h1+p, h2+p, h3+p, h4+p, h5+p, h6+p { - margin-top:0px; - } - - blockquote { - margin: 15px 0 8px; - } - li { - line-height: 18px; - } - form { - margin: 0 0 18px; - } - label, input, button, select, textarea { - font-size: 13px; - font-weight: normal; - line-height: 18px; - } - input, button, select, textarea { - font-family: "Helvetica Neue", Helvetica, Arial, sans-serif; - } - label { - display: block; - margin-bottom: 5px; - } - select, textarea { - display: inline-block; - padding: 4px; - margin-bottom: 9px; - font-size: 13px; - line-height: 18px; - color: #555555; - } - input { - &[type="text"], &[type="password"], &[type="datetime"], &[type="datetime-local"], &[type="date"], &[type="month"], &[type="time"], &[type="week"], &[type="number"], &[type="email"], &[type="url"], &[type="search"], &[type="tel"], &[type="color"] { - display: inline-block; - height: 18px; - padding: 4px; - margin-bottom: 9px; - font-size: 13px; - line-height: 18px; - color: #555555; - } - } - input { - width: 210px; - } - textarea { - width: 210px; - height: auto; - background-color: white; - border: 1px solid #cccccc; - border-radius: 3px; - box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075); - -webkit-transition: border linear 0.2s, box-shadow linear 0.2s; - transition: border linear 0.2s, box-shadow linear 0.2s; - } - input { - &[type="text"], &[type="password"], &[type="datetime"], &[type="datetime-local"], &[type="date"], &[type="month"], &[type="time"], &[type="week"], &[type="number"], &[type="email"], &[type="url"], &[type="search"], &[type="tel"], &[type="color"] { - background-color: white; - border: 1px solid #cccccc; - border-radius: 3px; - box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075); - -webkit-transition: border linear 0.2s, box-shadow linear 0.2s; - transition: border linear 0.2s, box-shadow linear 0.2s; - } - } - textarea:focus { - border-color: rgba(82, 168, 236, 0.8); - outline: 0; - box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 8px rgba(82, 168, 236, 0.6); - } - input { - &[type="text"]:focus, &[type="password"]:focus, &[type="datetime"]:focus, &[type="datetime-local"]:focus, &[type="date"]:focus, &[type="month"]:focus, &[type="time"]:focus, &[type="week"]:focus, &[type="number"]:focus, &[type="email"]:focus, &[type="url"]:focus, &[type="search"]:focus, &[type="tel"]:focus, &[type="color"]:focus { - border-color: rgba(82, 168, 236, 0.8); - outline: 0; - box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 8px rgba(82, 168, 236, 0.6); - } - } - - input { - &[type="radio"], &[type="checkbox"] { - margin: 3px 0; - line-height: normal; - cursor: pointer; - } - &[type="submit"], &[type="reset"], &[type="button"], &[type="radio"], &[type="checkbox"] { - width: auto; - } - } - - select, input[type="file"] { - line-height: 28px; - } - - select { - width: 220px; - border: 1px solid #bbbbbb; - &[multiple], &[size] { - height: auto; - } - &:focus { - outline: thin dotted #333333; - outline: 5px auto -webkit-focus-ring-color; - outline-offset: -2px; - } - } - input { - &[type="file"]:focus, &[type="radio"]:focus, &[type="checkbox"]:focus { - outline: thin dotted #333333; - outline: 5px auto -webkit-focus-ring-color; - outline-offset: -2px; - } - } - .radio, .checkbox { - min-height: 18px; - padding-left: 18px; - } - .radio input[type="radio"], .checkbox input[type="checkbox"] { - float: left; - margin-left: -18px; - } - .controls > { - .radio:first-child, .checkbox:first-child { - padding-top: 5px; - } - } - .radio.inline, .checkbox.inline { - display: inline-block; - padding-top: 5px; - margin-bottom: 0; - vertical-align: middle; - } - .radio.inline .radio.inline, .checkbox.inline .checkbox.inline { - margin-left: 10px; - } - .input-xxlarge { - width: 530px; - } - input[class*="span"], select[class*="span"], textarea[class*="span"] { - float: none; - margin-left: 0; - } - .input-append { - input[class*="span"] { - display: inline-block; - } - } - .input-prepend { - input[class*="span"] { - display: inline-block; - } - } - input, textarea { - margin-left: 0; - } - input[disabled], select[disabled], textarea[disabled], input[readonly], select[readonly], textarea[readonly] { - cursor: not-allowed; - background-color: #eeeeee; - border-color: #dddddd; - } - input { - &[type="radio"][disabled], &[type="checkbox"][disabled], &[type="radio"][readonly], &[type="checkbox"][readonly] { - background-color: transparent; - } - } - .control-group { - &.warning { - > label { - color: #c09853; - } - .checkbox, .radio, input, select, textarea { - color: #c09853; - border-color: #c09853; - } - .checkbox:focus, .radio:focus, input:focus, select:focus, textarea:focus { - border-color: #a47e3c; - box-shadow: 0 0 6px #dbc59e; - } - .input-prepend .add-on, .input-append .add-on { - color: #c09853; - background-color: #fcf8e3; - border-color: #c09853; - } - } - &.error { - > label { - color: #b94a48; - } - .checkbox, .radio, input, select, textarea { - color: #b94a48; - border-color: #b94a48; - } - .checkbox:focus, .radio:focus, input:focus, select:focus, textarea:focus { - border-color: #953b39; - box-shadow: 0 0 6px #d59392; - } - .input-prepend .add-on, .input-append .add-on { - color: #b94a48; - background-color: #f2dede; - border-color: #b94a48; - } - } - &.success { - > label { - color: #468847; - } - .checkbox, .radio, input, select, textarea { - color: #468847; - border-color: #468847; - } - .checkbox:focus, .radio:focus, input:focus, select:focus, textarea:focus { - border-color: #356635; - box-shadow: 0 0 6px #7aba7b; - } - .input-prepend .add-on, .input-append .add-on { - color: #468847; - background-color: #dff0d8; - border-color: #468847; - } - } - } - input:focus:required:invalid, textarea:focus:required:invalid, select:focus:required:invalid { - color: #b94a48; - border-color: #ee5f5b; - } - input:focus:required:invalid:focus, textarea:focus:required:invalid:focus, select:focus:required:invalid:focus { - border-color: #e9322d; - box-shadow: 0 0 6px #f8b9b7; - } - - .input-prepend, .input-append { - margin-bottom: 5px; - } - .input-prepend input, .input-append input, .input-prepend select, .input-append select { - position: relative; - margin-bottom: 0; - *margin-left: 0; - vertical-align: middle; - border-radius: 0 3px 3px 0; - } - .input-prepend input:focus, .input-append input:focus, .input-prepend select:focus, .input-append select:focus { - z-index: 2; - } - .input-prepend .add-on, .input-append .add-on { - display: inline-block; - width: auto; - height: 18px; - min-width: 16px; - padding: 4px 5px; - font-weight: normal; - line-height: 18px; - text-align: center; - text-shadow: 0 1px 0 white; - vertical-align: middle; - background-color: #eeeeee; - border: 1px solid #cccccc; - } - .input-prepend .add-on, .input-append .add-on, .input-prepend .btn, .input-append .btn { - margin-left: -1px; - border-radius: 0; - } - .input-prepend .active, .input-append .active { - background-color: #a9dba9; - border-color: #46a546; - } - .input-prepend { - .add-on, .btn { - margin-right: -1px; - } - .add-on:first-child, .btn:first-child { - border-radius: 3px 0 0 3px; - } - } - .input-append { - input, select { - border-radius: 3px 0 0 3px; - } - .add-on:last-child, .btn:last-child { - border-radius: 0 3px 3px 0; - } - } - .input-prepend.input-append { - input, select { - border-radius: 0; - } - .add-on:first-child, .btn:first-child { - margin-right: -1px; - border-radius: 3px 0 0 3px; - } - .add-on:last-child, .btn:last-child { - margin-left: -1px; - border-radius: 0 3px 3px 0; - } - } - - .form-horizontal input, .form-horizontal textarea, .form-horizontal select, .form-horizontal .input-prepend, .form-horizontal .input-append { - display: inline-block; - *display: inline; - margin-bottom: 0; - } - .form-horizontal .hide { - display: none; - } - - .control-group { - margin-bottom: 9px; - } - .form-horizontal { - .control-group { - margin-bottom: 18px; - *zoom: 1; - &:before { - display: table; - content: ""; - } - &:after { - display: table; - content: ""; - clear: both; - } - } - .control-indent { - margin-left: 20px; - margin-bottom: 10px; - } - .control-label { - float: left; - width: 140px; - padding-top: 5px; - text-align: right; - font-weight: bold; - } - .controls { - *display: inline-block; - *padding-left: 20px; - margin-left: 160px; - *margin-left: 0; - &:first-child { - *padding-left: 160px; - } - } - } - - .alert { - padding: 8px 35px 8px 14px; - margin-bottom: 18px; - text-shadow: 0 1px 0 rgba(255, 255, 255, 0.5); - background-color: #fcf8e3; - border: 1px solid #fbeed5; - border-radius: 4px; - color: #c09853; - } - .alert .close { - position: relative; - top: -2px; - right: -21px; - line-height: 18px; - } - .alert-success { - background-color: #dff0d8; - border-color: #d6e9c6; - color: #468847; - } - .alert-error { - background-color: #f2dede; - border-color: #eed3d7; - color: #b94a48; - } - .alert-info { - background-color: #d9edf7; - border-color: #bce8f1; - color: #3a87ad; - } - .alert { - .close { - float: right; - font-size: 20px; - font-weight: bold; - line-height: 18px; - color: black; - text-shadow: 0 1px 0 white; - opacity: 0.2; - filter: alpha(opacity = 20); - @include hover { - color: black; - text-decoration: none; - cursor: pointer; - opacity: 0.4; - filter: alpha(opacity = 40); - } - } - button.close { - padding: 0; - cursor: pointer; - background: transparent; - border: 0; - -webkit-appearance: none; - } - } - .bootbox.modal { - .modal-footer { - a.btn-primary { - color: white; - } - } - } -} - -table { - max-width: 100%; - background-color: transparent; -} - -.table { - width: 100%; - margin-bottom: 20px; - th, td { - padding: 8px; - line-height: 20px; - text-align: left; - vertical-align: top; - border-top: 1px solid #dddddd; - } - th { - font-weight: bold; - } - thead th { - vertical-align: bottom; - } - caption tr:first-child { - th, td { - border-top: 0; - } - } - colgroup tr:first-child { - th, td { - border-top: 0; - } - } - thead:first-child tr:first-child { - th, td { - border-top: 0; - } - } - tbody tbody { - border-top: 2px solid #dddddd; - } -} - -.table-condensed { - th, td { - padding: 4px 5px; - } -} - -.table-hover tr:hover { - td, th { - background-color: whitesmoke; - } -} - -table [class*=span] { - display: table-cell; - float: none; - margin-left: 0; -} - -.table { - tbody tr { - &.success td { - background-color: #dff0d8; - } - &.error td { - background-color: #f2dede; - } - &.warning td { - background-color: #fcf8e3; - } - &.info td { - background-color: #d9edf7; - } - } -} - -.table-hover tr { - &.success:hover td { - background-color: #d0e9c6; - } - &.error:hover td { - background-color: #ebcccc; - } - &.warning:hover td { - background-color: #faf2cc; - } - &.info:hover td { - background-color: #c4e3f3; - } -}