MediaWiki:Citizen.css: Difference between revisions

Browse history interactively

@@ Line 12: / Line 12: @@
 	--woa-accent: #00B8E6;
 	--woa-dark: #053E73;
+	/* Override Codex default blues with WikiOasis brand */
+	--color-primary: var(--woa-primary);
+	--color-progressive: var(--woa-secondary);
+	--color-destructive: #d32424;
 }
@@ Line 27: / Line 32: @@
 h1 {
-	border-bottom: 3px solid var(--woa-secondary);
 	padding-bottom: 0.5em;
 }
@@ Line 58: / Line 62: @@
 /* Align icon opacity with skin default */
 .mw-logo-icon {
-	opacity: var(--opacity-icon-base);
+	opacity: 1;
-	filter: var(--filter-invert);
+	filter: none !important;
 }
@@ Line 72: / Line 76: @@
 }
+/* External portlet hidden */
 .mw-portlet-External {
-	position: sticky;
-	bottom: 0;
-	margin-top: var(--space-md);
-	margin-inline: calc(var(--space-xs) * -1);
-	padding: var(--space-xs);
-	border-top: 2px solid var(--woa-secondary);
-	backdrop-filter: var(--backdrop-filter-frosted-glass);
-	font-size: var(--font-size-x-small);
-	grid-column: 1 / -1;
-	white-space: nowrap;
-}
-.mw-portlet-External .citizen-menu__heading {
 	display: none;
-}
-.mw-portlet-External ul {
-	display: flex;
-	overflow: auto;
-}
-.mw-portlet-External .mw-list-item a {
-	gap: 0;
-	transition: color 200ms ease;
-}
-.mw-portlet-External .mw-list-item a:hover {
-	color: var(--woa-secondary) !important;
 }
@@ Line 245: / Line 223: @@
 	gap: var(--space-sm);
 	font-weight: var(--font-weight-bold);
-	background: linear-gradient(135deg, var(--woa-primary), var(--woa-secondary));
+}
-	-webkit-background-clip: text;
-	-webkit-text-fill-color: transparent;
+.mw-logo-icon {
-	background-clip: text;
+	filter: none;
 }
@@ Line 299: / Line 277: @@
 button {
 	transition: all 200ms ease;
-	border-color: var(--woa-primary);
+	border-color: var(--woa-primary) !important;
-	color: white;
+	color: white !important;
-	background-color: var(--woa-primary);
+	background-color: var(--woa-primary) !important;
+	position: relative;
+	overflow: visible;
 }
@@ Line 307: / Line 287: @@
 .mw-ui-progressive:hover,
 button:hover {
-	background-color: var(--woa-secondary);
+	background-color: var(--woa-primary) !important;
-	border-color: var(--woa-secondary);
+	border-color: var(--woa-secondary) !important;
-	box-shadow: 0 2px 8px rgba(0, 147, 212, 0.3);
+	color: white !important;
+	box-shadow: 0 0 16px rgba(0, 147, 212, 0.6), 0 0 24px rgba(0, 147, 212, 0.3) !important;
+	animation: none !important;
+}
+.mw-ui-button:active,
+.mw-ui-progressive:active,
+button:active {
+	background-color: var(--woa-dark) !important;
+	border-color: var(--woa-dark) !important;
+	box-shadow: 0 0 8px rgba(0, 147, 212, 0.4) !important;
 }
@@ Line 364: / Line 354: @@
 		--gradient-angle: 360deg;
 	}
+}
+@keyframes woa-gradient-pulse {
+%, 100% {
+		transform: scale(1);
+	}
+% {
+		transform: scale(1.02);
+	}
+}
+.woa-gradient-glow {
+	animation: woa-gradient-pulse var(--gradient-time) ease-in-out infinite;
 }