diff --git a/css/enhancedsteam.css b/css/enhancedsteam.css index 1b471c114..887c3e110 100644 --- a/css/enhancedsteam.css +++ b/css/enhancedsteam.css @@ -1554,40 +1554,48 @@ img.astats_icon { * add_language_warning(), * add_fake_country_code_warning() **************************************/ -.es_warning { - display: flex; +.es_warn { font-size: 12px; - color: #fff; padding: 8px 0; text-align: center; - background: linear-gradient(rgb(154, 40, 32) 0%, rgb(214, 53, 37) 100%); + background: linear-gradient(#9a2820 0%, #d63525 100%); + color: white; } -.es_warning__msg { - display: inline; - flex-grow: 1; + +.es_warn__cnt { + max-width: 940px; + display: flex; + justify-content: space-between; + margin: auto; + line-height: 20px; } -.es_warning__msg > a { +.es_warn__cnt a { text-decoration: underline; } -.es_warning__controls { - display: inline-flex; - align-items: center; - margin-right: 10px; -} -.es_warning__controls > * { - margin: 0 5px; -} -.es_warning__dont-show-again { - display: inline-flex; - align-items: center; -} -.es_warning__input { - margin-right: .5em; + +.es_warn__control { + white-space: nowrap; } -.es_warning__close { + +.es_warn__btn { + background: linear-gradient(135deg, #faa 0%,#d46a6a 100%); + padding: 0 10px; + color: black; + text-transform: uppercase; + font-size: 11px; + border-radius: 1px; + text-decoration: none !important; + display: inline-block; + line-height: 20px; cursor: pointer; + white-space: nowrap; +} +.es_warn__btn:hover { + background: linear-gradient(135deg, #801515 0%,#500 100%); + color: white; } + /*************************************** * Wishlist * add_wishlist_total() diff --git a/js/content/common.js b/js/content/common.js index cee4a2a4f..7ac40ae5b 100644 --- a/js/content/common.js +++ b/js/content/common.js @@ -1235,23 +1235,26 @@ let AugmentedSteam = (function() { function addWarning(innerHTML, stopShowingHandler) { let el = HTML.element( - `
-
${innerHTML}
-
-
- - ${Localization.str.update.dont_show} + ``); - el.querySelector(".js_warning__close").addEventListener("click", () => { - if (el.querySelector(".js_warning__input").checked && stopShowingHandler) { + el.querySelector(".js-warn-close").addEventListener("click", () => { + if (stopShowingHandler) { stopShowingHandler(); } - el.closest(".es_warning").remove(); - }) + el.closest(".js-warn").remove(); + }); + + el.querySelector(".js-warn-hide").addEventListener("click", () => { + el.closest(".js-warn").remove(); + }); document.getElementById("global_header").insertAdjacentElement("afterend", el); }