diff --git a/app/assets/stylesheets/common/foundation/base.scss b/app/assets/stylesheets/common/foundation/base.scss index 39da9f97995..bcc9871fd02 100644 --- a/app/assets/stylesheets/common/foundation/base.scss +++ b/app/assets/stylesheets/common/foundation/base.scss @@ -8,7 +8,7 @@ html { color: $black; font: #{$base-font-size}/#{$base-line-height} $base-font-family; - background-color: $base-background-color; + background-color: #fff; overflow-y: scroll; -webkit-font-smoothing: subpixel-antialiased; } @@ -42,7 +42,7 @@ hr { height: 1px; margin: 1em 0; border: 0; - border-top: 1px solid $hr-border-color; + border-top: 1px solid #eee; padding: 0; } diff --git a/app/assets/stylesheets/desktop/header.scss b/app/assets/stylesheets/desktop/header.scss index eb89d41c83a..d6e4303639f 100644 --- a/app/assets/stylesheets/desktop/header.scss +++ b/app/assets/stylesheets/desktop/header.scss @@ -11,9 +11,8 @@ top: 0; left: 0; z-index: 1000; - border-bottom: 1px solid #9baab2; + box-shadow: 0 1px 5px rgba(70, 70, 70, .4); 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; } @@ -60,14 +59,11 @@ > 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 { @@ -79,7 +75,6 @@ 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; @@ -159,7 +154,6 @@ 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 diff --git a/app/assets/stylesheets/desktop/topic-list.scss b/app/assets/stylesheets/desktop/topic-list.scss index 902f0c9f883..291499d5e63 100644 --- a/app/assets/stylesheets/desktop/topic-list.scss +++ b/app/assets/stylesheets/desktop/topic-list.scss @@ -43,7 +43,7 @@ @include border-radius-all(4px 4px 0 0); @include box-shadow(0 1px 3px rgba($black, 0.22)); - a:visited {color: #888;} + a:visited:not(.badge-notification) {color: #888;} tbody tr { background-color: $white; diff --git a/app/assets/stylesheets/desktop/topic-post.scss b/app/assets/stylesheets/desktop/topic-post.scss index f1a74708877..14d954e4dd1 100644 --- a/app/assets/stylesheets/desktop/topic-post.scss +++ b/app/assets/stylesheets/desktop/topic-post.scss @@ -1,6 +1,5 @@ @import "common/foundation/variables"; -html {background-color: #fff;} .container { @extend .clearfix; @@ -10,6 +9,9 @@ html {background-color: #fff;} } + +h1 .topic-statuses .topic-status i {margin-right: 5px;} + .full-width { margin-left: 0px; } @@ -18,10 +20,17 @@ html {background-color: #fff;} .topic-post { padding: 0; + &:first-of-type { border-top: none; } + &:last-of-type { + border-bottom: 1px solid #ddd; + + } + + .reply-to-tab { display: block; position: absolute; @@ -47,7 +56,7 @@ html {background-color: #fff;} } -section.post-menu-area { +section.post-menu-area, .post-actions { .discourse-no-touch & { opacity: 0.2; transition: linear 0.15s; @@ -55,7 +64,7 @@ section.post-menu-area { } } - &:hover section.post-menu-area { + &:hover section.post-menu-area, &:hover .post-actions { opacity: 1; } @@ -66,18 +75,10 @@ section.post-menu-area { opacity:1; } } - - - } - - - - +} nav.post-controls { - background-color: #fff; padding: 0; - margin-top: 20px; button {color: #aaa; margin-right: 2px; @@ -96,7 +97,7 @@ nav.post-controls { button.show-replies { - padding: 8px 20px; + padding: 8px 15px; margin-left: 0px; } @@ -105,13 +106,11 @@ nav.post-controls { margin-right: 0; color: darken(#e4f2f8, 35%); background: #e4f2f8; - padding: 7px 20px; - border: 1px solid #e4f2f8; + padding: 8px 20px; margin-left: 10px; &:hover { color: darken(#e4f2f8, 45%); background: darken(#e4f2f8, 10%); - border: 1px solid darken(#e4f2f8, 10%); } } @@ -128,7 +127,7 @@ nav.post-controls { vertical-align: top; background: transparent; border: none; - margin-left: 1px; + margin-left: 3px; transition: all linear 0.15s; outline: none; //removes the pesky square button highlight from some browsers &:hover { @@ -189,39 +188,26 @@ nav.post-controls { .quote .title {background: #ddd;} blockquote {background: #ddd;} - - .reply {padding-bottom: 10px;} - - .topic-body { - padding-top: 7px; - padding-bottom: 10px; - } + &.bottom { margin-top: -11px;} .topic-meta-data h5 {margin: 5px;} .topic-meta-data-inside { - margin: -3px 15px 0 0; + margin: -3px 0 0 0; color: #aaa; } .topic-meta-data {padding-top: 20px;} + } - - - - .post-action { - margin-top: 3px; - margin-bottom: 3px; .relative-date { margin-left: 5px; } - .avatar {margin-right: 2px;} + .avatar { margin-right: 2px; } } - - a.star { display: inline-block; float: left; @@ -236,23 +222,16 @@ a.star { display: none; } -.topic-link {margin-left: -8px;} - - .topic-summary { - button {border-radius: 0;} - .btn { - } - .topic-links li { word-wrap: break-word; } - margin: 15px 0 20px 0; + margin: 20px 0 0 0; border: 1px solid #ddd; h3 { @@ -391,13 +370,20 @@ a.star { #suggested-topics { clear: left; + +.topics table tbody tr {background: #fff;} + table { box-shadow: none; border-radius: 0; border-color: #ddd; margin-top: 10px; + + + } - padding: 20px 10px 15px 10px; +padding: 20px 10px 15px 10px; + .title { font-size: 14px; line-height: 8px; @@ -423,7 +409,7 @@ span.post-count { #topic-title { z-index: 1000; - padding: 20px 10px 15px 10px; + padding: 25px 10px 15px 10px; .chzn-container {vertical-align: middle;} } @@ -456,7 +442,9 @@ iframe { } -.extra-info-wrapper {float: left; width: 78%;} +.extra-info-wrapper {float: left; width: 78%; +.topic-statuses {margin-right: 5px;} +} #main .inner a.star {margin-top: 6px;} @@ -467,11 +455,9 @@ iframe { a:not(.badge-category) {margin-left: -10px;} } - - - + a.star { - margin-right: 8px; + margin-right: 5px; margin-top: 6px; } @@ -485,7 +471,8 @@ iframe { margin-bottom: 10px; width: 92px; border-top: 1px solid #ddd; - padding-top: 25px; + padding-top: 30px; + img { text-align: center; } .contents { @@ -519,6 +506,8 @@ h3 {display: block;} .contents .cooked { + padding-right: 30px; + h1, h2, h3 {margin: 10px 0;} } @@ -536,16 +525,13 @@ h1, h2, h3 {margin: 10px 0;} .deleted { .topic-body { background-color: lighten(red, 45%); + } } -} - .moderator { - .topic-body { background-color: lighten(yellow, 45%); -} - + } } #share-link { @@ -633,7 +619,6 @@ h3 { blockquote { - clear:both; margin: 0; padding: 12px; } @@ -644,7 +629,7 @@ blockquote { } .quote .title {margin-right: 0;} - +.quote {margin-top: 20px;} .quote-controls { float: right; color: #aaa; @@ -692,10 +677,12 @@ blockquote { ul {margin: 0;} padding-left: 10px; + i {font-size: 12px;} + .post-links { - margin-top: 6px; + margin-top: 3px; list-style-type: none; - padding-left: 20px; + padding-left: 19px; position: relative; margin-left: 5px; a i { @@ -703,6 +690,7 @@ blockquote { left: 0; margin-right: 15px; margin-bottom: 20px; + } a {color: #aaa;} @@ -718,7 +706,7 @@ blockquote { float: left; position: relative; width: 720px; - padding: 10px 10px 10px 20px; + padding: 10px 0 15px 20px; } @@ -749,35 +737,49 @@ blockquote { .row:after {clear: both;} .embedded-posts { h1, h2, h3 {margin: 10px 0;} + &.bottom { + &.hidden {display: block; opacity: 0; } - &.bottom .arrow {float: right; margin: 0 15px 0 0;} + } + &.bottom .arrow {float: right; margin: 0 0 0 0;} &.top {margin-left: 112px;} .topic-body img {max-width: 100%; height: auto;} .topic-body, .topic-meta-data {border: none;} .row {border-top: 1px solid #ddd; padding-top: 7px;} .reply:first-of-type .row {border-top: none;} } + + + + + .contents.regular { button.show-replies { background: #eee; - border-bottom: 10px solid #eee; + padding-bottom: 20px; + + + &:hover {background: #ddd; + .badge-posts {color: #888;} } + +} &.bottom-round button.show-replies { - background: #fff; + background: #eee; margin-bottom: 0; - border-bottom: none; + padding-bottom: 8px; - &:hover {background: #eee; - .badge-posts {color: #888;} + + &:hover {background: #ddd; + .badge-posts {color: #888;} } - } diff --git a/app/assets/stylesheets/desktop/topic.scss b/app/assets/stylesheets/desktop/topic.scss index d80aa066c8a..487604e3b2f 100644 --- a/app/assets/stylesheets/desktop/topic.scss +++ b/app/assets/stylesheets/desktop/topic.scss @@ -2,12 +2,26 @@ .post-info a {color: #aaa;} .topic-meta-data-inside { + float: right; + margin-top: -22px; float: right; - margin-top: -19px; font-size: 12px; } +.post-actions { + color: #bbb; + text-align: right; + a {color: #bbb;} + .post-action { +display: inline-block; +margin-left: 10px; + margin-top: 10px; + + } +} +.post-menu-area {margin-bottom: 10px; margin-top: 20px;} + .post-info { display: inline-block; } @@ -17,11 +31,11 @@ #topic-title { margin-bottom: 20px; margin: -20px 0 0 0; - +.topic-statuses {margin-left: 5px;} h1 { - font-size: 2em; - line-height: 1.0; + font-size: 2.2em; + line-height: 1em; margin: 0; @@ -56,7 +70,7 @@ a.edit-topic {font-size: 15px;} .reply-new { i { - + font-size: 12px; margin-right: 5px; background: #fff; border: 1px solid #ddd; @@ -73,7 +87,7 @@ a.reply-new {color: #aaa;} a:hover.reply-new {color: #56aed3; i {background: #e4f2f8; - border: 1px solid #e4f2f8; + border: 1px solid #56aed3; padding: 2px 4px; } @@ -154,7 +168,6 @@ i {background: #e4f2f8; .topic-statuses .topic-status { padding: 0; i { - margin-left: 5px !important; font-size:20px; } @@ -181,4 +194,4 @@ i {background: #e4f2f8; width: 100%; font-size: 15px; z-index: 495 -} \ No newline at end of file +}