MediaWiki:Common.css: Difference between revisions

← Older edit Newer edit →

@@ Line 320: / Line 320: @@
    vertical-align: top;
 }
-#donate-top-notice{
-   background:#f3332b;
+/* === Primary Donation Top Notice === */
-   color:#fff;
+#donate-top-notice {
-   font-size:16px;
+   background: #f2f2f2;
-  line-height:1.4;
+   border-bottom: 1px solid #d6d6d6;
-  border-bottom:3px solid rgba(0,0,0,.15);
+   font-size: 18px;
 }
-.donate-notice-inner{
-   max-width:1200px;
+#donate-top-notice .donate-notice-inner {
-   margin:0 auto;
+   max-width: 1300px;
-   padding:14px 44px 14px 16px;
+   margin: 0 auto;
-   display:flex;
+   padding: 22px 64px 22px 24px;
-   align-items:center;
+   display: grid;
-   gap:14px;
+  grid-template-columns: auto 1fr auto;
+   align-items: center;
+   gap: 28px;
 }
-.donate-notice-inner strong{
-   font-weight:700;
+/* Title */
+#donate-top-notice .donate-title {
+   font-weight: 700;
+  font-size: 20px;
+  color: #111;
+  white-space: nowrap;
 }
-.donate-notice-inner span{
-   flex:1;
+/* Body text */
-   opacity:.95;
+#donate-top-notice .donate-text {
+   color: #333;
+   line-height: 1.4;
 }
-.donate-btn{
-   background:#fff;
+/* Donate button */
-   color:#111;
+#donate-top-notice .donate-btn {
-   padding:8px 14px;
+   background: #f3332b;
-   border-radius:8px;
+   color: #fff;
-   text-decoration:none;
+   padding: 12px 22px;
-   font-weight:600;
+   border-radius: 10px;
+   text-decoration: none;
+   font-weight: 700;
+  font-size: 16px;
 }
-#donate-notice-close{
-   position:absolute;
+#donate-top-notice .donate-btn:hover {
-  right:10px;
+   opacity: 0.9;
-  top:50%;
-  transform:translateY(-50%);
-  background:transparent;
-  border:0;
-  color:#fff;
-  font-size:22px;
-  cursor:pointer;
 }
-@media (max-width:720px){
-   .donate-notice-inner{
+/* Close button */
-     flex-wrap:wrap;
+#donate-top-notice #donate-notice-close {
-     gap:10px;
+  position: absolute;
+  right: 18px;
+  top: 50%;
+  transform: translateY(-50%);
+  background: transparent;
+  border: none;
+  font-size: 24px;
+  color: #666;
+  cursor: pointer;
+}
+#donate-top-notice #donate-notice-close:hover {
+  color: #000;
+}
+/* Mobile */
+@media (max-width: 800px) {
+   #donate-top-notice .donate-notice-inner {
+     grid-template-columns: 1fr;
+     gap: 12px;
+    padding-right: 48px;
+  }
+  #donate-top-notice .donate-title {
+    font-size: 18px;
    }
 }