diff --git a/src/Gadgets/Compatibility/Ding/Ding.css b/src/Gadgets/Compatibility/Ding/Ding.css index 2ed655b..5238e8c 100644 --- a/src/Gadgets/Compatibility/Ding/Ding.css +++ b/src/Gadgets/Compatibility/Ding/Ding.css @@ -3,6 +3,7 @@ * _addText: '{{Gadget Header|license=CC-BY-SA-4.0}}' * * @base + * @base * @source */ /** @@ -12,8 +13,8 @@ * | All changes should be made in the repository, | * | otherwise they will be lost. | * +--------------------------------------------------------+ - * | Changes to this page affect many users. | - * | Please discuss changes at Talk page before editing. | + * | Changes to this page may affect many users. | + * | Please discuss changes at talk page before editing. | * +--------------------------------------------------------+ */ /* */ @@ -29,8 +30,7 @@ } #ding button:active { - background: hsla(0deg 0% 100%/60%); - background: rgb(255 255 255 / 20%); + background: rgba(255, 255, 255, 0.2); } .ding_inner { @@ -39,19 +39,28 @@ right: 0; bottom: 0; left: 0; + width: 75%; height: auto; - padding: 0.6em 2em; - margin: 0 0 auto; - box-shadow: 0 2px 5px rgb(0 0 0 / 20%); - font-size: 86%; - font-weight: 700; - line-height: 1.4em; + min-height: 3.75%; + padding: 0.75em 1.5em; + border-radius: 1em 1em 0 0; + margin: 0 auto; + box-shadow: 0 2px 5px rgba(0, 0, 0, 0.2); + font-size: 92.5%; + font-weight: bold; + line-height: 1.25em; opacity: 1; text-align: center; - transform: translateY(-130%); + -webkit-transform: translateY(125%); + -moz-transform: translateY(125%); + -ms-transform: translateY(125%); + -o-transform: translateY(125%); + transform: translateY(125%); transition: all 0.2s; + word-break: break-word; } +/* Font and background colors */ .ding_default { background-color: #eaecf0; color: #000; @@ -72,7 +81,21 @@ } .ding_warning { - background-color: #d33; + background-color: #b32424; +} + +.ding_inner a, +.ding_inner a:visited, +.ding_inner a:hover { + color: #f4ff7f !important; +} + +/* Avoid overlapping the blue bar with the limited width control */ +@media all and (min-width: 1000px) { + .ding_inner { + width: 800px !important; + margin: auto !important; + } } /* */