diff --git a/app/javascript/src/javascripts/utility.js b/app/javascript/src/javascripts/utility.js index 612150753..20dfb54ec 100644 --- a/app/javascript/src/javascripts/utility.js +++ b/app/javascript/src/javascripts/utility.js @@ -19,7 +19,7 @@ Utility.test_max_width = function(width) { Utility.notice_timeout_id = undefined; Utility.notice = function(msg, permanent) { - $('#notice').addClass("ui-state-highlight").removeClass("ui-state-error").fadeIn("fast").children("span").html(msg); + $('#notice').addClass("notice-info").removeClass("notice-error").fadeIn("fast").children("span").html(msg); if (Utility.notice_timeout_id !== undefined) { clearTimeout(Utility.notice_timeout_id) @@ -33,7 +33,7 @@ Utility.notice = function(msg, permanent) { } Utility.error = function(msg) { - $('#notice').removeClass("ui-state-highlight").addClass("ui-state-error").fadeIn("fast").children("span").html(msg); + $('#notice').removeClass("notice-info").addClass("notice-error").fadeIn("fast").children("span").html(msg); if (Utility.notice_timeout_id !== undefined) { clearTimeout(Utility.notice_timeout_id) diff --git a/app/javascript/src/styles/base/040_colors.css b/app/javascript/src/styles/base/040_colors.css index 41d723e9a..9f5a962f7 100644 --- a/app/javascript/src/styles/base/040_colors.css +++ b/app/javascript/src/styles/base/040_colors.css @@ -9,7 +9,7 @@ --error-background-color: hsl(0, 100%, 95%); /* light red */ --success-background-color: hsl(120, 100%, 95%); /* light green */ - --warning-background-color: hsl(50, 100%, 95%); /* light yellow */ + --warning-background-color: hsl(50, 100%, 93%); /* light yellow */ --subnav-menu-background-color: #F5F5FF; @@ -165,23 +165,18 @@ --bulk-update-request-approved-color: green; --bulk-update-request-failed-color: red; - --notice-text-color: var(--text-color); - --notice-background: #FFFBBF; - --notice-border: 1px solid #CCC999; - --sign-in-link-color: #E00; --footer-border: 1px solid #EEE; --jquery-ui-widget-content-background: var(--body-background-color); --jquery-ui-widget-content-text-color: var(--text-color); - --jquery-ui-state-error-background: #FDDFDE; - --jquery-ui-state-error-border: 1px solid #FBC7C6; - --jquery-ui-state-error-text-color: var(--text-color); - --jquery-ui-state-highlight-background: #FDF5D9; - --jquery-ui-state-highlight-border: 1px solid #FCEEC1; - --jquery-ui-state-highlight-text-color: var(--text-color); --jquery-ui-dialog-box-shadow: 2px 2px 1px grey; + --notice-error-background: var(--error-background-color); + --notice-error-border: 1px solid #FBC7C6; + --notice-info-background: var(--warning-background-color); + --notice-info-border: 1px solid #CCC999; + --dtext-blockquote-border: 1px solid #666; --dtext-blockquote-background: #EEE; --dtext-code-background: #EEE; @@ -351,12 +346,6 @@ body[data-user-theme="dark"] { --jquery-ui-widget-content-text-color: var(--text-color); --jquery-ui-widget-content-background: var(--grey-2); --jquery-ui-dialog-box-shadow: 0px 0px 8px var(--grey-1); - --jquery-ui-state-error-background: var(--red-0); - --jquery-ui-state-error-border: 1px solid var(--grey-4); - --jquery-ui-state-error-text-color: var(--text-color); - --jquery-ui-state-highlight-background: var(--blue-0); - --jquery-ui-state-highlight-border: 1px solid var(--blue-1); - --jquery-ui-state-highlight-text-color: var(--text-color); --keyboard-shortcut-color: var(--text-color); --keyboard-shortcut-background-color: var(--grey-2); @@ -381,9 +370,10 @@ body[data-user-theme="dark"] { --note-highlight-color: var(--blue-1); --note-tn-color: var(--muted-text-color); - --notice-text-color: var(--grey-5); - --notice-background: var(--blue-0); - --notice-border: 1px solid var(--blue-1); + --notice-error-background: var(--red-0); + --notice-error-border: 1px solid var(--grey-4); + --notice-info-background: var(--blue-0); + --notice-info-border: 1px solid var(--blue-1); --paginator-arrow-background-color: white; --paginator-arrow-color: var(--link-color); diff --git a/app/javascript/src/styles/common/main_layout.scss b/app/javascript/src/styles/common/main_layout.scss index 68b335007..ad2e4fb53 100644 --- a/app/javascript/src/styles/common/main_layout.scss +++ b/app/javascript/src/styles/common/main_layout.scss @@ -5,21 +5,6 @@ div#page { margin: 0 20px; padding: 0 10px; - div#upgrade-account-notice, div#ban-notice, div#dmail-notice, div#mod-notice { - margin: 1em 0; - padding: 1em; - text-align: center; - position: relative; - - h1 { - font-size: $h2_size; - } - - p { - margin: 0; - } - } - aside#sidebar { width: 15em; float: left; diff --git a/app/javascript/src/styles/common/notices.scss b/app/javascript/src/styles/common/notices.scss index d64309af6..8ad56a777 100644 --- a/app/javascript/src/styles/common/notices.scss +++ b/app/javascript/src/styles/common/notices.scss @@ -9,21 +9,42 @@ div.error-messages { } div#notice { - padding: 0.25em; + padding: 0.5em; position: fixed; - top: 0.5em; + top: 1em; left: 25%; width: 50%; z-index: 100; - &:not(.ui-state-error) { - background: var(--notice-background); - border: var(--notice-border); - color: var(--notice-text-color); + a#close-notice-link { + position: absolute; + right: 1em; } } -a#close-notice-link { - position: absolute; - right: 1em; +.notice { + border-radius: 3px; +} + +.notice-small { + font-size: 0.8em; + margin: 0.5em 0; + padding: 0.5em 1em; +} + +.notice-large { + margin: 1em 0; + padding: 1em; + text-align: center; + position: relative; +} + +.notice-info { + background: var(--notice-info-background); + border: var(--notice-info-border); +} + +.notice-error { + background: var(--notice-error-background); + border: var(--notice-error-border); } diff --git a/app/javascript/src/styles/specific/posts.scss b/app/javascript/src/styles/specific/posts.scss index 1f855df68..c946aa7ee 100644 --- a/app/javascript/src/styles/specific/posts.scss +++ b/app/javascript/src/styles/specific/posts.scss @@ -232,12 +232,10 @@ div#c-posts { } .post-notice { - font-size: 0.8em; + margin: 0.5em 0; padding: 0.5em; - margin-bottom: 0.5em; overflow: hidden; border: var(--post-notice-border); - border-radius: 3px; ul.post-flag-reasons, ul.post-appeal-reasons { list-style: inside; @@ -260,7 +258,7 @@ div#c-posts { &.post-notice-deleted { background: var(--post-deleted-notice-background); } &.post-notice-appealed { background: var(--post-appealed-notice-background); } &.post-notice-resized { background: var(--post-resized-notice-background); } - &.post-notice-search { background: var(--post-search-notice-background); font-size: 1em; } + &.post-notice-search { background: var(--post-search-notice-background); } } aside#sidebar #tag-list h2 { diff --git a/app/javascript/src/styles/specific/wiki_pages.scss b/app/javascript/src/styles/specific/wiki_pages.scss index 2bdd2ad82..4c454e678 100644 --- a/app/javascript/src/styles/specific/wiki_pages.scss +++ b/app/javascript/src/styles/specific/wiki_pages.scss @@ -1,13 +1,3 @@ -div#c-wiki-pages { - #a-new { - div.notice { - font-size: 0.8em; - padding: 1em; - margin: 1em 0; - } - } -} - .wiki-other-name { background-color: var(--wiki-page-other-name-background-color); padding: 3px; diff --git a/app/views/layouts/default.html.erb b/app/views/layouts/default.html.erb index 6ce435b0a..3d4c74aa7 100644 --- a/app/views/layouts/default.html.erb +++ b/app/views/layouts/default.html.erb @@ -119,7 +119,7 @@