From 2f595f27e9e2bc8a1d080d7cdad5783ee4a29fa1 Mon Sep 17 00:00:00 2001 From: Kane York Date: Tue, 18 Aug 2015 22:02:01 -0700 Subject: [PATCH] CLEANUP: Coalesce repeated CSS properties --- app/assets/stylesheets/common/base/alert.scss | 1 - app/assets/stylesheets/common/base/emoji.scss | 4 +- .../common/base/magnific-popup.scss | 3 +- app/assets/stylesheets/common/base/modal.scss | 1 - .../stylesheets/common/base/onebox.scss | 3 +- .../stylesheets/common/base/pagedown.scss | 14 +----- .../stylesheets/common/base/upload.scss | 3 +- .../stylesheets/common/base/user-badges.scss | 6 +-- .../common/base/username_tagsinput.scss | 13 ++++- .../common/components/navs.css.scss | 3 +- .../stylesheets/common/foundation/mixins.scss | 1 + .../stylesheets/common/topic-entrance.scss | 2 - app/assets/stylesheets/desktop/discourse.scss | 6 +-- app/assets/stylesheets/desktop/modal.scss | 1 - .../stylesheets/desktop/topic-list.scss | 3 +- .../stylesheets/desktop/topic-post.scss | 1 - app/assets/stylesheets/mobile/discourse.scss | 3 +- app/assets/stylesheets/mobile/modal.scss | 3 +- app/assets/stylesheets/mobile/topic-list.scss | 9 ++-- app/assets/stylesheets/mobile/topic.scss | 1 - app/assets/stylesheets/mobile/user.scss | 3 +- app/assets/stylesheets/vendor/bootstrap.scss | 1 + app/assets/stylesheets/vendor/pikaday.scss | 4 +- app/assets/stylesheets/vendor/select2.scss | 49 +++++++++---------- 24 files changed, 55 insertions(+), 83 deletions(-) diff --git a/app/assets/stylesheets/common/base/alert.scss b/app/assets/stylesheets/common/base/alert.scss index fe80bb2eb..1476a3f23 100644 --- a/app/assets/stylesheets/common/base/alert.scss +++ b/app/assets/stylesheets/common/base/alert.scss @@ -11,7 +11,6 @@ float: right; font-size: 1.429em; font-weight: bold; - line-height: 18px; color: $primary; opacity: 0.2; filter: alpha(opacity = 20); diff --git a/app/assets/stylesheets/common/base/emoji.scss b/app/assets/stylesheets/common/base/emoji.scss index fb658ea4a..2d9061bff 100644 --- a/app/assets/stylesheets/common/base/emoji.scss +++ b/app/assets/stylesheets/common/base/emoji.scss @@ -51,9 +51,7 @@ body img.emoji { } .emoji-modal .toolbar { - margin: 0; - margin-top: 8px; - margin-bottom: 5px + margin: 8px 0 5px; } .emoji-modal .toolbar li { diff --git a/app/assets/stylesheets/common/base/magnific-popup.scss b/app/assets/stylesheets/common/base/magnific-popup.scss index 98ead180b..3aa7f39eb 100644 --- a/app/assets/stylesheets/common/base/magnific-popup.scss +++ b/app/assets/stylesheets/common/base/magnific-popup.scss @@ -337,9 +337,8 @@ button { @if $IE7support { filter: unquote("alpha(opacity=#{$controls-opacity*100})"); } - margin: 0; top: 50%; - margin-top: -55px; + margin: -55px 0 0; padding: 0; width: 90px; height: 110px; diff --git a/app/assets/stylesheets/common/base/modal.scss b/app/assets/stylesheets/common/base/modal.scss index 0df5f7b41..ee8de426b 100644 --- a/app/assets/stylesheets/common/base/modal.scss +++ b/app/assets/stylesheets/common/base/modal.scss @@ -65,7 +65,6 @@ margin: 0 auto; background-color: $secondary; border: 1px solid dark-light-diff($primary, $secondary, 90%, -60%); - border: 1px solid dark-light-diff($primary, $secondary, 90%, -60%); box-shadow: 0 3px 7px rgba(0,0,0, .8); background-clip: padding-box; diff --git a/app/assets/stylesheets/common/base/onebox.scss b/app/assets/stylesheets/common/base/onebox.scss index 2ff7b0d3a..84cfbca27 100644 --- a/app/assets/stylesheets/common/base/onebox.scss +++ b/app/assets/stylesheets/common/base/onebox.scss @@ -82,8 +82,7 @@ a.loading-onebox { @mixin onebox-favicon($class, $image) { &.#{$class} .source { - background-image: image-url("favicons/#{$image}.png"); - background-repeat: no-repeat; + background: image-url("favicons/#{$image}.png") no-repeat; padding-left: 20px; } } diff --git a/app/assets/stylesheets/common/base/pagedown.scss b/app/assets/stylesheets/common/base/pagedown.scss index ec7b7c375..8cac61a14 100644 --- a/app/assets/stylesheets/common/base/pagedown.scss +++ b/app/assets/stylesheets/common/base/pagedown.scss @@ -13,10 +13,7 @@ } .wmd-button-row { - margin-left: 5px; - margin-right: 5px; - margin-bottom: 5px; - margin-top: 5px; + margin: 5px; padding: 0; height: 20px; overflow: hidden; @@ -33,18 +30,9 @@ } .wmd-button { - width: 20px; - height: 20px; - padding-left: 2px; - padding-right: 3px; margin-right: 5px; - background-repeat: no-repeat; - background-position: 0 0; border: 0; - width: 20px; - height: 20px; position: relative; - border: 0; float: left; font-family: FontAwesome; font-weight: normal; diff --git a/app/assets/stylesheets/common/base/upload.scss b/app/assets/stylesheets/common/base/upload.scss index 97fdf508e..6afba003e 100644 --- a/app/assets/stylesheets/common/base/upload.scss +++ b/app/assets/stylesheets/common/base/upload.scss @@ -1,5 +1,4 @@ .uploaded-image-preview { - background-position: center center; background-size: cover; - background-color: $primary; + background: $primary center center; } diff --git a/app/assets/stylesheets/common/base/user-badges.scss b/app/assets/stylesheets/common/base/user-badges.scss index 74b87c826..e1bd5d086 100644 --- a/app/assets/stylesheets/common/base/user-badges.scss +++ b/app/assets/stylesheets/common/base/user-badges.scss @@ -4,10 +4,9 @@ color: $primary; border: 1px solid dark-light-diff($primary, $secondary, 90%, -65%); line-height: 19px; - margin: 0; display: inline-block; background-color: $secondary; - margin-bottom: 3px; + margin: 0 0 3px; .fa { padding-right: 3px; @@ -52,8 +51,7 @@ img { display: block; - margin: auto; - margin-bottom: 4px; + margin: auto auto 4px; width: 55px; height: 55px; } diff --git a/app/assets/stylesheets/common/base/username_tagsinput.scss b/app/assets/stylesheets/common/base/username_tagsinput.scss index 8e0f60dca..c18494c18 100644 --- a/app/assets/stylesheets/common/base/username_tagsinput.scss +++ b/app/assets/stylesheets/common/base/username_tagsinput.scss @@ -24,8 +24,17 @@ div.tagsinput span.tag { } 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: 0.929em; border:1px solid transparent; -padding:2px 5px; background: transparent; color: #000; outline:0px; margin-right:5px; margin-bottom:5px; } +div.tagsinput input { + width:80px; + font-family: helvetica; + font-size: 0.929em; + border:1px solid transparent; + padding:2px 5px; + background: transparent; + color: #000; + outline:0px; + margin: 0px 5px 5px 0px; +} div.tagsinput div { display:block; float: left; } .tags_clear { clear: both; width: 100%; height: 0; } .not_valid {background: #FBD8DB !important; color: #90111A !important;} diff --git a/app/assets/stylesheets/common/components/navs.css.scss b/app/assets/stylesheets/common/components/navs.css.scss index 5934c2fb7..d29d05a3d 100644 --- a/app/assets/stylesheets/common/components/navs.css.scss +++ b/app/assets/stylesheets/common/components/navs.css.scss @@ -75,10 +75,9 @@ { left: 90%; top: 33%; - border: solid transparent; content: " "; position: absolute; - border-width: 8px; + border: 8px solid transparent; border-left-color: $secondary; } diff --git a/app/assets/stylesheets/common/foundation/mixins.scss b/app/assets/stylesheets/common/foundation/mixins.scss index 60a682ac0..2243802d1 100644 --- a/app/assets/stylesheets/common/foundation/mixins.scss +++ b/app/assets/stylesheets/common/foundation/mixins.scss @@ -60,6 +60,7 @@ // Linear gradient +//noinspection CssOptimizeSimilarProperties @mixin linear-gradient($start-color, $end-color) { background-color: $start-color; background-image: linear-gradient(to bottom, $start-color, $end-color); diff --git a/app/assets/stylesheets/common/topic-entrance.scss b/app/assets/stylesheets/common/topic-entrance.scss index 8316aae9e..847edc46a 100644 --- a/app/assets/stylesheets/common/topic-entrance.scss +++ b/app/assets/stylesheets/common/topic-entrance.scss @@ -8,8 +8,6 @@ position: absolute; width: 133px; - padding: 5px; - @include unselectable; button.full { diff --git a/app/assets/stylesheets/desktop/discourse.scss b/app/assets/stylesheets/desktop/discourse.scss index 0d117b4ae..e25653136 100644 --- a/app/assets/stylesheets/desktop/discourse.scss +++ b/app/assets/stylesheets/desktop/discourse.scss @@ -77,12 +77,12 @@ body { .grippie { width: 100%; - border: 1px solid dark-light-diff($primary, $secondary, 90%, -60%); - border-width: 1px 0; + border: 1px solid; + border-right-width: 0; + border-left-width: 0; cursor: row-resize; height: 11px; overflow: hidden; - background-color: dark-light-diff($primary, $secondary, 90%, -60%); display:block; background: image-url("grippie.png") dark-light-diff($primary, $secondary, 90%, -60%) no-repeat center 3px; } diff --git a/app/assets/stylesheets/desktop/modal.scss b/app/assets/stylesheets/desktop/modal.scss index 8c527e21f..c9d5b84c3 100644 --- a/app/assets/stylesheets/desktop/modal.scss +++ b/app/assets/stylesheets/desktop/modal.scss @@ -17,7 +17,6 @@ margin: -250px 0 0 -305px; background-color: $secondary; border: 1px solid dark-light-diff($primary, $secondary, 90%, -60%); - border: 1px solid dark-light-diff($primary, $secondary, 90%, -60%); box-shadow: 0 3px 7px rgba(0,0,0, .8); background-clip: padding-box; diff --git a/app/assets/stylesheets/desktop/topic-list.scss b/app/assets/stylesheets/desktop/topic-list.scss index 2e90524da..8d3a880b1 100644 --- a/app/assets/stylesheets/desktop/topic-list.scss +++ b/app/assets/stylesheets/desktop/topic-list.scss @@ -182,8 +182,7 @@ } td.latest { vertical-align: top; - padding: 8px; - padding-top: 0; + padding: 0 8px 8px; } .last-user-info { font-size: 0.857em; diff --git a/app/assets/stylesheets/desktop/topic-post.scss b/app/assets/stylesheets/desktop/topic-post.scss index 181d06551..1d2668623 100644 --- a/app/assets/stylesheets/desktop/topic-post.scss +++ b/app/assets/stylesheets/desktop/topic-post.scss @@ -800,7 +800,6 @@ $topic-avatar-width: 45px; #selected-posts { - padding-left: 20px; margin-left: 330px; width: 200px; position: fixed; diff --git a/app/assets/stylesheets/mobile/discourse.scss b/app/assets/stylesheets/mobile/discourse.scss index f4a32585b..4d56b037f 100644 --- a/app/assets/stylesheets/mobile/discourse.scss +++ b/app/assets/stylesheets/mobile/discourse.scss @@ -88,8 +88,7 @@ blockquote { // we must remove margins for text site titles h2#site-text-logo { - margin: 0; - margin-left: 10px; + margin: 0 0 0 10px; } // categories should not be bold on mobile; they fight with the topic title too much diff --git a/app/assets/stylesheets/mobile/modal.scss b/app/assets/stylesheets/mobile/modal.scss index 8c94edf25..e54ab173c 100644 --- a/app/assets/stylesheets/mobile/modal.scss +++ b/app/assets/stylesheets/mobile/modal.scss @@ -17,7 +17,6 @@ width: 100%; height: auto; background-color: $secondary; - border: 1px solid scale-color($secondary, $lightness: 90%); border: 1px solid rgba(0, 0, 0, 0.3); @include border-radius-all (6px); @@ -178,4 +177,4 @@ #search-help p { margin: 5px; -} \ No newline at end of file +} diff --git a/app/assets/stylesheets/mobile/topic-list.scss b/app/assets/stylesheets/mobile/topic-list.scss index 5f71cddca..47c69376b 100644 --- a/app/assets/stylesheets/mobile/topic-list.scss +++ b/app/assets/stylesheets/mobile/topic-list.scss @@ -268,17 +268,14 @@ tr.category-topic-link { float: left; width: 280px; padding: 4px 0; - margin: 1px 0 0; list-style: none; background-color: $secondary; - border: 1px solid dark-light-diff($primary, $secondary, 90%, -60%); - border: 1px solid rgba(0, 0, 0, 0.2); + border: 1px solid dark-light-choose(rgba(0, 0, 0, 0.2), scale-color($primary, $lightness: -60%)); border-radius: 5px; box-shadow: 0 5px 10px rgba(0, 0, 0, 0.2); background-clip: padding-box; - margin-bottom: 20px; -.title {font-weight: bold; display: block;} - + margin: 1px 0 20px; + .title {font-weight: bold; display: block;} } .dropdown-menu a { display: block; diff --git a/app/assets/stylesheets/mobile/topic.scss b/app/assets/stylesheets/mobile/topic.scss index db76dd41f..9bc347b65 100644 --- a/app/assets/stylesheets/mobile/topic.scss +++ b/app/assets/stylesheets/mobile/topic.scss @@ -69,7 +69,6 @@ position: absolute; bottom: 34px; width: 133px; - padding: 5px; button.full { width: 100%; diff --git a/app/assets/stylesheets/mobile/user.scss b/app/assets/stylesheets/mobile/user.scss index 1f45f68ee..03ec7fb16 100644 --- a/app/assets/stylesheets/mobile/user.scss +++ b/app/assets/stylesheets/mobile/user.scss @@ -221,9 +221,8 @@ } .about { - background-color: dark-light-diff($primary, $secondary, 0%, -75%); background-size: cover; - background-position: center center; + background: dark-light-diff($primary, $secondary, 0%, -75%) center center; width: 100%; margin-bottom: 10px; overflow: hidden; diff --git a/app/assets/stylesheets/vendor/bootstrap.scss b/app/assets/stylesheets/vendor/bootstrap.scss index cf73b4d7d..df21cf6c8 100644 --- a/app/assets/stylesheets/vendor/bootstrap.scss +++ b/app/assets/stylesheets/vendor/bootstrap.scss @@ -14,6 +14,7 @@ @import "common/foundation/mixins"; +//noinspection CssOverwrittenProperties a:focus { outline: thin dotted #333; outline: 5px auto -webkit-focus-ring-color; diff --git a/app/assets/stylesheets/vendor/pikaday.scss b/app/assets/stylesheets/vendor/pikaday.scss index 3b2a3c0a8..a12e8e546 100644 --- a/app/assets/stylesheets/vendor/pikaday.scss +++ b/app/assets/stylesheets/vendor/pikaday.scss @@ -86,9 +86,7 @@ text-indent: 20px; // hide text using text-indent trick, using width value (it's enough) white-space: nowrap; overflow: hidden; - background-color: transparent; - background-position: center center; - background-repeat: no-repeat; + background: transparent no-repeat center center; background-size: 75% 75%; opacity: .5; *position: absolute; diff --git a/app/assets/stylesheets/vendor/select2.scss b/app/assets/stylesheets/vendor/select2.scss index aa3d61372..828c71851 100644 --- a/app/assets/stylesheets/vendor/select2.scss +++ b/app/assets/stylesheets/vendor/select2.scss @@ -200,6 +200,7 @@ Version: @@ver@@ Timestamp: @@timestamp@@ white-space: nowrap; } +//noinspection CssOverwrittenProperties .select2-search input { width: 100%; height: auto !important; @@ -228,6 +229,7 @@ Version: @@ver@@ Timestamp: @@timestamp@@ margin-top: 4px; } +//noinspection CssOverwrittenProperties .select2-search input.select2-active { background: #fff asset-url('select2-spinner.gif') no-repeat 100%; background: asset-url('select2-spinner.gif') no-repeat 100%, -webkit-gradient(linear, left bottom, left top, color-stop(0.85, #fff), color-stop(0.99, #eee)); @@ -389,16 +391,14 @@ disabled look for disabled choices in the results dropdown /* disabled styles */ .select2-container.select2-container-disabled .select2-choice { - background-color: #f4f4f4; - background-image: none; - border: 1px solid #ddd; - cursor: default; + background: #f4f4f4 none; + border: 1px solid #ddd; + cursor: default; } .select2-container.select2-container-disabled .select2-choice .select2-arrow { - background-color: #f4f4f4; - background-image: none; - border-left: 0; + background: #f4f4f4 none; + border-left: 0; } .select2-container.select2-container-disabled .select2-choice abbr { @@ -540,17 +540,15 @@ html[dir="rtl"] .select2-search-choice-close { /* disabled styles */ .select2-container-multi.select2-container-disabled .select2-choices { - background-color: #f4f4f4; - background-image: none; - border: 1px solid #ddd; - cursor: default; + background: #f4f4f4 none; + border: 1px solid #ddd; + cursor: default; } .select2-container-multi.select2-container-disabled .select2-choices .select2-search-choice { - padding: 3px 5px 3px 5px; - border: 1px solid #ddd; - background-image: none; - background-color: #f4f4f4; + padding: 3px 5px 3px 5px; + border: 1px solid #ddd; + background: #f4f4f4 none; } .select2-container-multi.select2-container-disabled .select2-choices .select2-search-choice .select2-search-choice-close { display: none; @@ -594,16 +592,15 @@ html[dir="rtl"] .select2-search-choice-close { /* Retina-ize icons */ @media only screen and (-webkit-min-device-pixel-ratio: 1.5), only screen and (min-resolution: 2dppx) { - .select2-search input, - .select2-search-choice-close, - .select2-container .select2-choice abbr, - .select2-container .select2-choice .select2-arrow b { - background-image: asset-url('select2x2.png') !important; - background-repeat: no-repeat !important; - background-size: 60px 40px !important; - } + .select2-search input, + .select2-search-choice-close, + .select2-container .select2-choice abbr, + .select2-container .select2-choice .select2-arrow b { + background: asset-url('select2x2.png') no-repeat !important; + background-size: 60px 40px !important; + } - .select2-search input { - background-position: 100% -21px !important; - } + .select2-search input { + background-position: 100% -21px !important; + } }