MediaWiki:Common.css: Difference between revisions
mNo edit summary |
mNo edit summary |
||
| Line 479: | Line 479: | ||
/* ========================================================= | /* ========================================================= | ||
OOO NOTICE SYSTEM (Industrial | OOO NOTICE SYSTEM (Variant Driven – Industrial Clean) | ||
========================================================= */ | ========================================================= */ | ||
| Line 487: | Line 487: | ||
margin: 28px 0; | margin: 28px 0; | ||
border-radius: 10px; | border-radius: 10px; | ||
border: 1px solid transparent; | |||
border-left: 8px solid var(--ooo-accent); | |||
border: | |||
background: rgba(245,196,0,0.04); | background: rgba(245,196,0,0.04); | ||
} | } | ||
/* Title */ | |||
.ooo-notice__title { | .ooo-notice__title { | ||
font-size: 1.05rem; | font-size: 1.05rem; | ||
font-weight: 800; | font-weight: 800; | ||
margin-bottom: 8px; | margin-bottom: 8px; | ||
letter-spacing: 0.3px; | letter-spacing: 0.3px; | ||
color: inherit; | |||
} | } | ||
/* Content */ | |||
.ooo-notice__content { | .ooo-notice__content { | ||
line-height: 1.6; | line-height: 1.6; | ||
opacity: 0. | opacity: 0.95; | ||
} | |||
/* ========================================================= | |||
INFO (Brand Yellow Default) | |||
========================================================= */ | |||
.ooo-notice--info { | |||
border-left-color: var(--ooo-accent); | |||
border-color: rgba(245,196,0,0.25); | |||
background: rgba(245,196,0,0.06); | |||
color: var(--ooo-accent); | |||
} | |||
.ooo-notice--info .ooo-notice__title { | |||
color: var(--ooo-accent); | |||
} | } | ||
/* ===== | /* ========================================================= | ||
WARNING (Stronger Yellow) | |||
========================================================= */ | |||
.ooo-notice--warning { | .ooo-notice--warning { | ||
border-left-color: #f5c400; | border-left-color: #f5c400; | ||
border-color: rgba(245,196,0,0.35); | |||
background: rgba(245,196,0,0.10); | |||
} | |||
.ooo-notice--warning .ooo-notice__title { | |||
color: #f5c400; | |||
} | } | ||
/* ========================================================= | |||
SUCCESS (Green) | |||
========================================================= */ | |||
.ooo-notice--success { | .ooo-notice--success { | ||
border-left-color: #2ea44f; | border-left-color: #2ea44f; | ||
border-color: rgba(46,164,79,0. | border-color: rgba(46,164,79,0.30); | ||
background: rgba(46,164,79,0. | background: rgba(46,164,79,0.06); | ||
} | } | ||
| Line 524: | Line 549: | ||
color: #2ea44f; | color: #2ea44f; | ||
} | } | ||
/* ========================================================= | |||
DANGER (Red) | |||
========================================================= */ | |||
.ooo-notice--danger { | .ooo-notice--danger { | ||
border-left-color: #d73a49; | border-left-color: #d73a49; | ||
border-color: rgba(215,58,73,0. | border-color: rgba(215,58,73,0.30); | ||
background: rgba(215,58,73,0. | background: rgba(215,58,73,0.06); | ||
} | } | ||
| Line 535: | Line 564: | ||
} | } | ||
/* | /* ========================================================= | ||
.skin-theme-clientpref-night .ooo-notice { | DARK MODE TUNING | ||
========================================================= */ | |||
background: rgba(245,196,0,0. | |||
.skin-theme-clientpref-night .ooo-notice--info { | |||
background: rgba(245,196,0,0.12); | |||
} | |||
.skin-theme-clientpref-night .ooo-notice--warning { | |||
background: rgba(245,196,0,0.18); | |||
} | |||
.skin-theme-clientpref-night .ooo-notice--success { | |||
background: rgba(46,164,79,0.12); | |||
} | } | ||
.skin-theme-clientpref-night .ooo-notice--danger { | |||
background: rgba(215,58,73,0.12); | |||
} | } | ||