MediaWiki:Common.css - Revision history

Admin at 09:52, 27 November 2025

2025-11-27T09:52:55Z

← Older revision		Revision as of 09:52, 27 November 2025
Line 171:		Line 171:
	.gbi-social.linkedin { background-image: url(/images/icons/linkedin.png); }		.gbi-social.linkedin { background-image: url(/images/icons/linkedin.png); }
	.gbi-social.youtube { background-image: url(/images/icons/youtube.png); }		.gbi-social.youtube { background-image: url(/images/icons/youtube.png); }

	~~.infobox {~~
	~~width: 100%;~~
	~~max-width: 600px;~~
	~~margin: 20px auto;~~
	~~background: #ffffff;~~
	~~border-radius: 16px;~~
	~~padding: 18px 22px;~~
	~~box-shadow: 0 6px 18px rgba(0,0,0,0.08);~~
	~~font-family: 'Montserrat', sans-serif;~~
	}

	~~.infobox-title {~~
	~~font-size: 1.6rem;~~
	~~font-weight: 700;~~
	~~text-align: center;~~
	~~margin-bottom: 15px;~~
	~~color: #1a1a1a;~~
	}

	~~.infobox .image img {~~
	~~width: 120px;~~
	~~height: 120px;~~
	~~object-fit: cover;~~
	~~border-radius: 10px;~~
	~~margin: 0 auto 10px;~~
	~~display: block;~~
	}

	~~.infobox-section {~~
	~~margin-top: 12px;~~
	~~border-top: 1px solid #e3e7ec;~~
	~~padding-top: 10px;~~
	}

	~~.infobox-label {~~
	~~font-weight: 600;~~
	~~color: #555;~~
	~~font-size: 0.95rem;~~
	}

	~~.infobox-data {~~
	~~color: #333;~~
	~~font-size: 0.95rem;~~
	}

Admin at 09:40, 27 November 2025

2025-11-27T09:40:36Z

← Older revision		Revision as of 09:40, 27 November 2025
Line 171:		Line 171:
	.gbi-social.linkedin { background-image: url(/images/icons/linkedin.png); }		.gbi-social.linkedin { background-image: url(/images/icons/linkedin.png); }
	.gbi-social.youtube { background-image: url(/images/icons/youtube.png); }		.gbi-social.youtube { background-image: url(/images/icons/youtube.png); }

			.infobox {
			width: 100%;
			max-width: 600px;
			margin: 20px auto;
			background: #ffffff;
			border-radius: 16px;
			padding: 18px 22px;
			box-shadow: 0 6px 18px rgba(0,0,0,0.08);
			font-family: 'Montserrat', sans-serif;
			}

			.infobox-title {
			font-size: 1.6rem;
			font-weight: 700;
			text-align: center;
			margin-bottom: 15px;
			color: #1a1a1a;
			}

			.infobox .image img {
			width: 120px;
			height: 120px;
			object-fit: cover;
			border-radius: 10px;
			margin: 0 auto 10px;
			display: block;
			}

			.infobox-section {
			margin-top: 12px;
			border-top: 1px solid #e3e7ec;
			padding-top: 10px;
			}

			.infobox-label {
			font-weight: 600;
			color: #555;
			font-size: 0.95rem;
			}

			.infobox-data {
			color: #333;
			font-size: 0.95rem;
			}

Admin at 07:40, 27 November 2025

2025-11-27T07:40:35Z

← Older revision		Revision as of 07:40, 27 November 2025
Line 148:		Line 148:
	line-height: 0 !important;		line-height: 0 !important;
	}		}
			.gbi-social-links {
			display: flex;
			gap: 8px;
			align-items: center;
			}

			.gbi-social {
			width: 22px;
			height: 22px;
			display: inline-block;
			background-size: contain !important;
			background-repeat: no-repeat !important;
			background-position: center !important;
			filter: drop-shadow(0px 0px 2px rgba(0,0,0,0.4));
			}

			/* Icon images (upload these or use hosted icons) */
			.gbi-social.website { background-image: url(/images/icons/web.png); }
			.gbi-social.facebook { background-image: url(/images/icons/facebook.png); }
			.gbi-social.instagram{ background-image: url(/images/icons/instagram.png); }
			.gbi-social.twitter { background-image: url(/images/icons/twitter.png); }
			.gbi-social.linkedin { background-image: url(/images/icons/linkedin.png); }
			.gbi-social.youtube { background-image: url(/images/icons/youtube.png); }

Admin at 07:14, 27 November 2025

2025-11-27T07:14:02Z

← Older revision		Revision as of 07:14, 27 November 2025
Line 66:		Line 66:
	font-weight: 700;		font-weight: 700;
	margin: 0;		margin: 0;
			color: #ffffff !important;
	text-shadow: 0px 0px 6px rgba(0,0,0,0.6);		text-shadow: 0px 0px 6px rgba(0,0,0,0.6);
	}		}


	/* Designation */		/* Designation */

Admin at 07:05, 27 November 2025

2025-11-27T07:05:19Z

← Older revision		Revision as of 07:05, 27 November 2025
Line 35:		Line 35:
	height: 100%;		height: 100%;
	position: relative;		position: relative;
	overflow: hidden ~~!important~~;		overflow: hidden;
	border-radius: 0 14px 14px 0;		border-radius: 0 14px 14px 0;
	background: ~~none !important;~~		background: #c8cdd6;
	~~padding: 0 !important;~~
	~~margin: 0 !important~~;
	}		}

	/* Banner Image */		/* Banner Image */
	.gbi-banner-img,		.gbi-banner-img {
	~~.gbi-banner-img img,~~
	~~.gbi-banner a.image,~~
	~~.gbi-banner span~~ {
	width: 100% !important;		width: 100% !important;
	height: 100% !important;		height: 100% !important;
	object-fit: cover !important;		object-fit: cover !important;
	~~object-position: center center !important;~~		display: block;
	display: block ~~!important;~~
	~~padding: 0 !important;~~
	~~margin: 0 !important;~~
	~~border: none !important;~~
	~~line-height: 0 !important~~;
	}		}

Line 61:		Line 51:
	.gbi-banner-overlay {		.gbi-banner-overlay {
	position: absolute;		position: absolute;
	~~bottom~~: 0;		inset: 0;
	~~left~~: 0;		z-index: 5;
	~~right~~: 0;		display: flex;
			flex-direction: column;
			justify-content: flex-end;
	padding: 25px;		padding: 25px;
	~~z-index: 10;~~
	background: linear-gradient(to top, rgba(0,0,0,0.55), rgba(0,0,0,0));		background: linear-gradient(to top, rgba(0,0,0,0.55), rgba(0,0,0,0));
	color: #ffffff;		color: #ffffff;
Line 75:		Line 66:
	font-weight: 700;		font-weight: 700;
	margin: 0;		margin: 0;
	text-shadow: 0px 0px 6px rgba(0,0,0,0.7);		text-shadow: 0px 0px 6px rgba(0,0,0,0.6);
	}		}

Line 81:		Line 72:
	.gbi-designation {		.gbi-designation {
	font-size: 17px;		font-size: 17px;
	opacity: 0.95;		opacity: 0.9;
	margin-top: 6px;		margin-top: 6px;
	}		}
Line 97:		Line 88:
	font-size: 16px;		font-size: 16px;
	}		}

	.gbi-infobox {		.gbi-infobox {
	width: 35%;		width: 35%;
Line 108:		Line 98:
	height: auto;		height: auto;
	}		}
	.gbi-photo,		.gbi-photo, .gbi-banner {
	.gbi-banner {
	width: 100% !important;		width: 100% !important;
	height: 240px !important;		height: 240px !important;
Line 117:		Line 106:
	flex-direction: column;		flex-direction: column;
	}		}
	.gbi-content,		.gbi-content, .gbi-infobox {
	.gbi-infobox {
	width: 100%;		width: 100%;
	}		}
			}

			/* FORCE REAL FIX */
			.gbi-photo .gbi-img,
			.gbi-photo .gbi-img img,
			.gbi-photo a.image,
			.gbi-photo span {
			width: 100% !important;
			height: 100% !important;
			object-fit: cover !important;
			object-position: center center !important;
			display: block !important;
			}

			.gbi-banner .gbi-banner-img,
			.gbi-banner .gbi-banner-img img,
			.gbi-banner a.image,
			.gbi-banner span {
			width: 100% !important;
			height: 100% !important;
			object-fit: cover !important;
			object-position: center center !important;
			display: block !important;
			}

			/* Remove any padding/margin from MW wrappers */
			.gbi-photo a, .gbi-banner a {
			margin: 0 !important;
			padding: 0 !important;
			}

			/* Remove invisible alignment gaps */
			.gbi-photo span,
			.gbi-banner span {
			display: block !important;
			line-height: 0 !important;
	}		}

Admin at 07:04, 27 November 2025

2025-11-27T07:04:44Z

← Older revision		Revision as of 07:04, 27 November 2025
Line 35:		Line 35:
	height: 100%;		height: 100%;
	position: relative;		position: relative;
	overflow: hidden;		overflow: hidden !important;
	border-radius: 0 14px 14px 0;		border-radius: 0 14px 14px 0;
	background: ~~#c8cdd6~~;		background: none !important;
			padding: 0 !important;
			margin: 0 !important;
	}		}

	/* Banner Image */		/* Banner Image */
	.gbi-banner-img {		.gbi-banner-img,
			.gbi-banner-img img,
			.gbi-banner a.image,
			.gbi-banner span {
	width: 100% !important;		width: 100% !important;
	height: 100% !important;		height: 100% !important;
	object-fit: cover !important;		object-fit: cover !important;
	display: block;		object-position: center center !important;
			display: block !important;
			padding: 0 !important;
			margin: 0 !important;
			border: none !important;
			line-height: 0 !important;
	}		}

Line 51:		Line 61:
	.gbi-banner-overlay {		.gbi-banner-overlay {
	position: absolute;		position: absolute;
	~~inset~~: 0;		bottom: 0;
	~~z-index~~: 5;		left: 0;
	~~display~~: ~~flex;~~		right: 0;
	~~flex-direction: column;~~
	~~justify-content: flex-end~~;
	padding: 25px;		padding: 25px;
			z-index: 10;
	background: linear-gradient(to top, rgba(0,0,0,0.55), rgba(0,0,0,0));		background: linear-gradient(to top, rgba(0,0,0,0.55), rgba(0,0,0,0));
	color: #ffffff;		color: #ffffff;
Line 66:		Line 75:
	font-weight: 700;		font-weight: 700;
	margin: 0;		margin: 0;
	text-shadow: 0px 0px 6px rgba(0,0,0,0.6);		text-shadow: 0px 0px 6px rgba(0,0,0,0.7);
	}		}

Line 72:		Line 81:
	.gbi-designation {		.gbi-designation {
	font-size: 17px;		font-size: 17px;
	opacity: 0.9;		opacity: 0.95;
	margin-top: 6px;		margin-top: 6px;
	}		}
Line 88:		Line 97:
	font-size: 16px;		font-size: 16px;
	}		}

	.gbi-infobox {		.gbi-infobox {
	width: 35%;		width: 35%;
Line 98:		Line 108:
	height: auto;		height: auto;
	}		}
	.gbi-photo, .gbi-banner {		.gbi-photo,
			.gbi-banner {
	width: 100% !important;		width: 100% !important;
	height: 240px !important;		height: 240px !important;
Line 106:		Line 117:
	flex-direction: column;		flex-direction: column;
	}		}
	.gbi-content, .gbi-infobox {		.gbi-content,
			.gbi-infobox {
	width: 100%;		width: 100%;
	}		}
	}

	~~/* FORCE REAL FIX */~~
	~~.gbi-photo .gbi-img,~~
	~~.gbi-photo .gbi-img img,~~
	~~.gbi-photo a.image,~~
	~~.gbi-photo span {~~
	~~width: 100% !important;~~
	~~height: 100% !important;~~
	~~object-fit: cover !important;~~
	~~object-position: center center !important;~~
	~~display: block !important;~~
	}

	~~.gbi-banner .gbi-banner-img,~~
	~~.gbi-banner .gbi-banner-img img,~~
	~~.gbi-banner a.image,~~
	~~.gbi-banner span {~~
	~~width: 100% !important;~~
	~~height: 100% !important;~~
	~~object-fit: cover !important;~~
	~~object-position: center center !important;~~
	~~display: block !important;~~
	}

	~~/* Remove any padding/margin from MW wrappers */~~
	~~.gbi-photo a, .gbi-banner a {~~
	~~margin: 0 !important;~~
	~~padding: 0 !important;~~
	}

	~~/* Remove invisible alignment gaps */~~
	~~.gbi-photo span,~~
	~~.gbi-banner span {~~
	~~display: block !important;~~
	~~line-height: 0 !important;~~
	}		}

Admin at 06:59, 27 November 2025

2025-11-27T06:59:26Z

@@ Line 109: / Line 109: @@
          width: 100%;
+     }
+}

Admin at 06:55, 27 November 2025

2025-11-27T06:55:29Z

← Older revision		Revision as of 06:55, 27 November 2025
Line 1:		Line 1:
	/* 🌟 Global Bio Index – ~~Improved Layout & Fixes~~ */		/* 🌟 Global Bio Index – Fixed FINAL */

	/* Header Container */		/* Header Container */
Line 8:		Line 8:
	margin-bottom: 30px;		margin-bottom: 30px;
	position: relative;		position: relative;
	~~overflow~~: ~~hidden;~~		gap: 0;
	~~border-radius: 14px~~;
	}		}

Line 15:		Line 14:
	.gbi-photo {		.gbi-photo {
	width: 30%;		width: 30%;
	~~height~~: ~~100%~~;		overflow: hidden;
	display: flex;		display: flex;
	justify-content: center;		justify-content: center;
	align-items: center;		align-items: center;
			border-radius: 14px 0 0 14px;
	background: #d9dde4;		background: #d9dde4;

	~~overflow: hidden;~~
	}		}

	/* Profile Image */		/* Profile Image */
	.gbi-img {		.gbi-img {
			width: 100% !important;
	object-fit: cover;		height: 100% !important;
	~~object~~-~~position~~: ~~center~~;		object-fit: cover !important;
			border-radius: inherit !important;
	}		}

Line 43:		Line 42:
	/* Banner Image */		/* Banner Image */
	.gbi-banner-img {		.gbi-banner-img {
	width: 100%;		width: 100% !important;
	height: 100%;		height: 100% !important;
	object-fit: cover;		object-fit: cover !important;
	~~object-position: center; /* Fixes blank spaces */~~
	display: block;		display: block;
	}		}

	/* ~~Banner~~ Text Overlay */		/* Text Overlay */
	.gbi-banner-overlay {		.gbi-banner-overlay {
	position: absolute;		position: absolute;
	~~left: 0; right: 0; bottom~~: 0;		inset: 0;
	~~padding~~: ~~25px~~;		z-index: 5;
	display: flex;		display: flex;
	flex-direction: column;		flex-direction: column;
	justify-content: flex-end;		justify-content: flex-end;
	~~z-index~~: 10;		padding: 25px;
			background: linear-gradient(to top, rgba(0,0,0,0.55), rgba(0,0,0,0));
	~~/* Clear bottom fade for better visibility */~~		color: #ffffff;
	background: linear-gradient(
	to top,
	rgba(0,0,0,0.8),
	rgba(0,0,0,0.0)
	);
	color: #~~fff~~;
	}		}

	/* Title Text */		/* Title Text */
	.gbi-title {		.gbi-title {
	font-size: ~~32px~~;		font-size: 30px;
	font-weight: 700;		font-weight: 700;
	margin: 0;		margin: 0;
	~~line-height: 1.2;~~		text-shadow: 0px 0px 6px rgba(0,0,0,0.6);
	text-shadow: 0px ~~3px 10px~~ rgba(0,0,0,0.7);
	}		}

	/* Designation */		/* Designation */
	.gbi-designation {		.gbi-designation {
	font-size: ~~18px~~;		font-size: 17px;
			opacity: 0.9;
	margin-top: 6px;		margin-top: 6px;
	~~opacity: 0.95;~~
	}		}

Line 94:		Line 85:
	.gbi-content {		.gbi-content {
	width: 65%;		width: 65%;
	line-height: 1.7;		line-height: 1.6;
	font-size: ~~17px;~~		font-size: 16px;
	~~text-align: justify~~;
	}		}

	.gbi-infobox {		.gbi-infobox {
	width: 35%;		width: 35%;
	}		}

	/* 🔹 Mobile ~~Responsive~~ */		/* Mobile View */
	@media(max-width: 900px){		@media(max-width: 900px){
	.gbi-header {		.gbi-header {
Line 109:		Line 98:
	height: auto;		height: auto;
	}		}
	.gbi-photo {		.gbi-photo, .gbi-banner {
	~~width: 100% !important;~~
	~~height: 250px !important;~~
	~~border-radius: 14px 14px 0 0 !important;~~
	}
	.gbi-banner {
	width: 100% !important;		width: 100% !important;
	height: ~~250px~~ !important;		height: 240px !important;
	border-radius: ~~0 0 14px~~ 14px !important;		border-radius: 14px !important;
	}
	~~.gbi-title {~~
	~~font-size: 24px;~~
	}
	~~.gbi-designation {~~
	~~font-size: 15px~~;
	}		}
	.gbi-layout {		.gbi-layout {

Admin at 06:53, 27 November 2025

2025-11-27T06:53:36Z

← Older revision		Revision as of 06:53, 27 November 2025
Line 26:		Line 26:
	/* Profile Image */		/* Profile Image */
	.gbi-img {		.gbi-img {
	~~width: 100%;~~
	~~height: 100%;~~
	object-fit: cover;		object-fit: cover;
	object-position: center;		object-position: center;

Admin at 06:52, 27 November 2025

2025-11-27T06:52:31Z

← Older revision		Revision as of 06:52, 27 November 2025
Line 20:		Line 20:
	align-items: center;		align-items: center;
	background: #d9dde4;		background: #d9dde4;
	~~border-radius: 14px 0 0 14px;~~
	overflow: hidden;		overflow: hidden;
	}		}