MediaWiki:Common.css - Revision history

Admin: Update

2026-05-25T07:43:46Z

Update

← Older revision		Revision as of 07:43, 25 May 2026
Line 2,224:		Line 2,224:

	/* =========================		/* =========================
	FLOATING BUTTONS - luôn trên ~~footer~~		FLOATING BUTTONS - luôn trên top
	========================= */		========================= */
			#floating-buttons {
			position: fixed !important;
			z-index: 99999 !important;
			/* Position: thường là góc dưới phải */
			bottom: 24px;
			right: 24px;
			}

	~~/* Target tất cả~~ floating ~~button thường gặp */~~		#floating-buttons button,
	~~.mw-back-to~~-~~top,~~		#floating-buttons a {
	~~.vector-back-to-top,~~
	button~~[class*="back-to-top"],~~
	~~button[class*="scroll-to-top"]~~,
	~~.scroll-to-top,~~
	~~.vector-toc-btn,~~
	~~.cdx-button[aria-label*="top" i],~~
	~~.cdx-button[aria-label*="Back" i],~~
	~~[class*="~~floating-~~button"],~~
	~~[class*="fab-button"]~~ {
	z-index: 99999 !important;		z-index: 99999 !important;
	~~position: fixed !important;~~
	}		}

	/* Đảm bảo footer ~~SOJI không~~ che button */		/* Đảm bảo footer KHÔNG che các button này */
	.soji-site-footer {		.soji-site-footer,
			#footer,
			.mw-footer-container {
	z-index: 1 !important;		z-index: 1 !important;
	~~position: relative !important;~~
	}		}

	~~/* Nếu có sticky-header conflict */~~
	~~.vector-sticky-header {~~
	~~z-index: 1000 !important;~~
	}

Admin: Update btn

2026-05-25T07:40:54Z

Update btn

@@ Line 2,223: / Line 2,223: @@
+}
+/* Nếu có sticky-header conflict */
+.vector-sticky-header {
+    z-index: 1000 !important;
+}

Admin: Update footer

2026-05-22T06:39:33Z

Update footer

← Older revision		Revision as of 06:39, 22 May 2026
Line 269:		Line 269:
	}		}

	.soji-footer-link {		.soji-footer-link,
	color: #ffffff;		.soji-footer-link:visited,
			.soji-footer-link:link,
			.soji-footer-link:active {
			color: #ffffff !important;
	text-decoration: none;		text-decoration: none;
	~~font-size: 14px;~~
	~~transition: color 0.2s;~~
	}		}

	.soji-footer-link:hover {		.soji-footer-link:hover {
	color: #ffffff;		color: #ffffff !important;
			opacity: 0.7;
	text-decoration: none;		text-decoration: none;
	}		}

Admin: Update Main Page Card

2026-05-22T02:14:53Z

Update Main Page Card

← Older revision		Revision as of 02:14, 22 May 2026
Line 1,914:		Line 1,914:

	.main-page-product-card {		.main-page-product-card {
	flex: 0 0 ~~280px~~; /* ← fixed width 280px, không co dãn */		flex: 0 0 320px; /* ← fixed width 280px, không co dãn */
	background: white;		background: white;
	border: 1px solid #e0e0e0;		border: 1px solid #e0e0e0;

Admin: Update Main Page Card

2026-05-22T02:05:10Z

Update Main Page Card

← Older revision		Revision as of 02:05, 22 May 2026
Line 2,102:		Line 2,102:

	.main-page-product-card {		.main-page-product-card {
	background: ~~white~~;		background: transparent;
	border: ~~1px solid #e0e0e0;~~		border: none;
	~~border-radius: 8px~~;		padding: 20px;
	padding: ~~28px~~ 20px ~~24px~~;
	text-align: center;		text-align: center;
	~~transition: all 0.2s;~~
	display: flex;		display: flex;
	flex-direction: column;		flex-direction: column;
Line 2,114:		Line 2,112:
	box-sizing: border-box;		box-sizing: border-box;
	position: relative;		position: relative;
			cursor: pointer;
	}		}

			/* Bỏ hover effect trên card (không border, không shadow, không transform) */
	.main-page-product-card:hover {		.main-page-product-card:hover {
	border~~-color~~: ~~#2c5aa0~~;		background: transparent;
	box-shadow: ~~0 6px 20px rgba(44, 90, 160, 0.12)~~;		border: none;
	transform: ~~translateY(-2px)~~;		box-shadow: none;
			transform: none;
	}		}

Line 2,126:		Line 2,127:
	content: "";		content: "";
	position: absolute;		position: absolute;
	~~top: 0;~~		inset: 0;
	~~left: 0;~~
	~~right: 0;~~
	~~bottom~~: 0;
	z-index: 1;		z-index: 1;
	}		}

	/* ~~Đảm bảo các phần khác hiển thị nhưng~~ link ~~cover phía trên~~ */		/* Pass clicks through icon và description xuống stretched link */
	.main-page-product-icon,		.main-page-product-icon,
	.main-page-product-~~title~~,		.main-page-product-desc,
	.main-page-product-~~desc~~ {		.main-page-product-no-icon {
	~~position: relative;~~		pointer-events: none;
	z-~~index~~: 0;
	}		}

	/* ~~Nếu có~~ link ~~khác trong card (vd icon có link riêng),~~ giữ ~~nó clickable trên cùng~~ */		/* Title link giữ pointer-events bình thường */
	~~.main-page-product-card a:not(~~.main-page-product-title a) {		.main-page-product-title {
	~~position: relative;~~		pointer-events: auto;
	z-~~index~~: 2;
	}		}

Line 2,155:		Line 2,151:
	justify-content: center;		justify-content: center;
	}		}

	.main-page-product-icon img {		.main-page-product-icon img {
	max-width: 100%;		max-width: 100%;
Line 2,160:		Line 2,157:
	object-fit: contain;		object-fit: contain;
	}		}

	.main-page-product-title {		.main-page-product-title {
	font-size: 22px;		font-size: 22px;
	font-weight: 700;		font-weight: 700;
			color: #2c5aa0;
			text-align: center;
	margin: 8px 0 14px;		margin: 8px 0 14px;
	}		}

	.main-page-product-title a {		.main-page-product-title a {
	color: #2c5aa0;		color: #2c5aa0;
	text-decoration: none;		text-decoration: none;
			transition: color 0.2s;
	}		}

			/* Chỉ highlight title khi hover card (giống 4 category cards bottom) */
	.main-page-product-card:hover .main-page-product-title a {		.main-page-product-card:hover .main-page-product-title a {
	text-decoration: underline;		text-decoration: underline;
	color: #1a3a6e;		color: #1a3a6e;
	}
	~~.main-page-product-desc {~~
	~~color: #444;~~
	~~font-size: 14px;~~
	~~line-height: 1.5;~~
	~~text-align: center;~~
	}

	~~.main-page-product-icon {~~
	~~width: 140px;~~
	~~height: 140px;~~
	~~display: flex;~~
	~~align-items: center;~~
	~~justify-content: center;~~
	~~margin: 0 auto 16px;~~
	}

	~~.main-page-product-icon img {~~
	~~max-width: 100%;~~
	~~max-height: 100%;~~
	~~object-fit: contain;~~
	}

	~~.main-page-product-title {~~
	~~font-size: 22px;~~
	~~font-weight: 700;~~
	~~margin: 8px 0 14px;~~
	~~color: #2c5aa0;~~
	~~text-align: center;~~
	}

	~~.main-page-product-title a {~~
	~~color: #2c5aa0;~~
	~~text-decoration: none;~~
	}		}

Admin: Update Main Page Card

2026-05-22T02:01:27Z

Update Main Page Card

← Older revision		Revision as of 02:01, 22 May 2026
Line 1,925:		Line 1,925:
	align-items: center;		align-items: center;
	cursor: pointer;		cursor: pointer;
	~~box-sizing: border-box;~~
	}

	~~.main-page-product-card:hover {~~
	~~border-color: #2c5aa0;~~
	~~box-shadow: 0 6px 20px rgba(44, 90, 160, 0.12);~~
	~~transform: translateY(-2px);~~
	}		}

Line 2,178:		Line 2,171:
	.main-page-product-card:hover .main-page-product-title a {		.main-page-product-card:hover .main-page-product-title a {
	text-decoration: underline;		text-decoration: underline;
			color: #1a3a6e;
	}		}
	.main-page-product-desc {		.main-page-product-desc {

Admin: Update color footer

2026-05-21T10:34:30Z

Update color footer

← Older revision		Revision as of 10:34, 21 May 2026
Line 335:		Line 335:
	height: 34px;		height: 34px;
	border-radius: 50%;		border-radius: 50%;
	background: ~~#fff~~;		background: rgba(255, 255, 255, 0.85);
	color: #~~2d3338~~;		color: #4a5468;
	display: inline-flex;		display: inline-flex;
	align-items: center;		align-items: center;
Line 345:		Line 345:

	.soji-footer-social-item:hover {		.soji-footer-social-item:hover {
			background: #ffffff;
	transform: translateY(-2px);		transform: translateY(-2px);
	text-decoration: none;		text-decoration: none;
Line 358:		Line 359:
	margin-top: 40px;		margin-top: 40px;
	padding-top: 20px;		padding-top: 20px;
	border-top: 1px solid rgba(255,255,255,0.1);		border-top: 1px solid rgba(255, 255, 255, 0.15);
	text-align: center;		text-align: center;
	color: ~~#8a8a8a~~;		color: rgba(255, 255, 255, 0.7);
	font-size: 12px;		font-size: 12px;
	}		}

Admin: Update color footer

2026-05-21T10:32:31Z

Update color footer

← Older revision		Revision as of 10:32, 21 May 2026
Line 159:		Line 159:

	.soji-site-footer {		.soji-site-footer {
	background: #~~2d3338~~;		background: #4a5468;
	color: #~~e6e6e6~~;		color: #ffffff;
	padding: 50px 0 20px;		padding: 50px 0 20px;
	font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;		font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
Line 180:		Line 180:
	display: flex;		display: flex;
	flex-direction: column;		flex-direction: column;
			background: #f8f9fa !important;
	}		}
	body.has-soji-footer > .mw-page-container,		body.has-soji-footer > .mw-page-container,
Line 207:		Line 208:

	.soji-footer-company-name {		.soji-footer-company-name {
	color: #~~fff~~;		color: #ffffff;
	font-size: 16px;		font-size: 16px;
	font-weight: 700;		font-weight: 700;
Line 228:		Line 229:
	font-size: 13px;		font-size: 13px;
	line-height: 1.5;		line-height: 1.5;
	color: #~~cfcfcf~~;		color: #ffffff;
	}		}

Line 235:		Line 236:
	width: 18px;		width: 18px;
	height: 18px;		height: 18px;
	color: #~~f0a830~~;		color: #ffffff;
	display: inline-flex;		display: inline-flex;
	align-items: center;		align-items: center;
Line 248:		Line 249:
	.soji-footer-col h2,		.soji-footer-col h2,
	.soji-footer-subscribe-col h2 {		.soji-footer-subscribe-col h2 {
	color: #~~f0a830~~;		color: #ffffff;
	font-size: 14px;		font-size: 14px;
	font-weight: 700;		font-weight: 700;
Line 269:		Line 270:

	.soji-footer-link {		.soji-footer-link {
	color: #~~cfcfcf~~;		color: #ffffff;
	text-decoration: none;		text-decoration: none;
	font-size: 14px;		font-size: 14px;
Line 276:		Line 277:

	.soji-footer-link:hover {		.soji-footer-link:hover {
	color: #~~f0a830~~;		color: #ffffff;
	text-decoration: none;		text-decoration: none;
	}		}
Line 287:		Line 288:
	width: 100%;		width: 100%;
	background: transparent;		background: transparent;
	border: 1px solid #~~6b6b6b~~;		border: 1px solid #ffffff;
	padding: 12px 14px;		padding: 12px 14px;
	color: #fff;		color: #fff;
Line 297:		Line 298:

	.soji-footer-subscribe-input::placeholder {		.soji-footer-subscribe-input::placeholder {
	color: ~~#8a8a8a~~;		color: rgba(255, 255, 255, 0.7);
	}		}

	.soji-footer-subscribe-input:focus {		.soji-footer-subscribe-input:focus {
	outline: none;		outline: none;
	border-color: #~~f0a830~~;		border-color: #ffffff;
	}		}

	.soji-footer-subscribe-btn {		.soji-footer-subscribe-btn {
	width: 100%;		width: 100%;
	background: #~~f0a830~~;		background: #ffffff;
	color: #~~2d3338~~;		color: #4a5468;
	border: none;		border: none;
	padding: 12px;		padding: 12px;

Admin: Update

2026-05-21T10:23:57Z

Update

@@ Line 2,118: / Line 2,118: @@
      flex: 0 0 280px;
      box-sizing: border-box;
+}
@@ Line 2,124: / Line 2,125: @@
      box-shadow: 0 6px 20px rgba(44, 90, 160, 0.12);
      transform: translateY(-2px);
+}

Admin: Update

2026-05-21T10:02:05Z

Update

@@ Line 2,088: / Line 2,088: @@
 /* Products grid */
 .main-page-products-grid {
      display: flex;
@@ Line 2,096: / Line 2,106: @@
+}