Template:ArticleCard/styles.css - Revision history

VijayanPN at 16:39, 9 June 2026

2026-06-09T16:39:42Z

← Older revision		Revision as of 22:09, 9 June 2026
Line 60:		Line 60:
	.article-intro-wrapper {		.article-intro-wrapper {
	position: relative;		position: relative;
	max-height: 4.~~8em~~; /* ~~Exactly 3 lines~~ (1.6em line-height * 3) */		max-height: 6.4em; /* 4 വരികൾക്കായി കൃത്യമായി ക്രമീകരിച്ചത് (1.6em line-height * 4) */
	overflow: hidden;		overflow: hidden;
	margin-bottom: ~~1rem~~;		margin-bottom: 6px !important; /* മുൻപുണ്ടായിരുന്ന 16px-ൽ നിന്നും 6px ആയി കുറച്ചു */
	}		}

Line 68:		Line 68:
	font-family: 'Manjari', 'Meera', 'Rachana', 'Noto Sans Malayalam', sans-serif !important;		font-family: 'Manjari', 'Meera', 'Rachana', 'Noto Sans Malayalam', sans-serif !important;
	font-size: 0.95em;		font-size: 0.95em;
	line-height: 1.6em; ~~/* Strict line-height definition */~~		line-height: 1.6em;
	color: #4a5568;		color: #4a5568;
	margin: 0;		margin: 0 !important; /* മീഡിയവിക്കി P ടാഗിന്റെ ഡിഫോൾട്ട് മാർജിൻ പൂർണ്ണമായി ഒഴിവാക്കി */
	padding: 0;		padding: 0 !important;
	}		}

	/* ~~Single line layout row grouping Author name and Date together~~ */		/* ഓതർ, ഡേറ്റ് എന്നിവ അടങ്ങുന്ന മെറ്റാ റോ */
	.article-meta-row {		.article-meta-row {
	display: flex;		display: flex;
	justify-content: space-between;		justify-content: space-between;
	align-items: center;		align-items: center;
	margin-top: auto;		margin-top: auto !important; /* കുറവ് വിവരങ്ങളുള്ള കാർഡുകളിലെ അധിക സ്ഥലം ഇതിന് മുകളിലേക്ക് മാറ്റും */
	padding-top: ~~0.5rem~~;		margin-bottom: 0 !important;
			padding-top: 6px !important; /* പാഡിങ് 8px-ൽ നിന്നും 6px ആയി കുറച്ചു */
	border-top: 1px solid #edf2f7;		border-top: 1px solid #edf2f7;
	font-family: 'Manjari', 'Meera', 'Rachana', 'Noto Sans Malayalam', sans-serif !important;		font-family: 'Manjari', 'Meera', 'Rachana', 'Noto Sans Malayalam', sans-serif !important;
			}

			/* മീഡിയവിക്കി ജനറേറ്റ് ചെയ്യാൻ സാധ്യതയുള്ള അനാവശ്യ മാർജിനുകളെ തടയാൻ */
			.article-meta-row p,
			.article-info p {
			margin: 0 !important;
			padding: 0 !important;
	}		}

Line 89:		Line 97:
	font-weight: bold;		font-weight: bold;
	color: #4a5568;		color: #4a5568;
			margin: 0 !important;
	}		}

Line 94:		Line 103:
	font-size: 0.8em;		font-size: 0.8em;
	color: #718096;		color: #718096;
			margin: 0 !important;
	}		}

	/* Optional placeholder class for hidden internal metadata layout */		/* Optional placeholder class for hidden internal metadata layout */
	.author-photo-hidden {		.author-photo-hidden {
	display: none;		display: none;
	}		}

VijayanPN at 12:55, 9 June 2026

2026-06-09T12:55:40Z

← Older revision		Revision as of 18:25, 9 June 2026
Line 19:		Line 19:
	overflow: hidden;		overflow: hidden;
	background-color: #f7fafc;		background-color: #f7fafc;
			display: flex;
			justify-content: center;
			align-items: center;
	}		}

	.article-thumbnail img {		.article-thumbnail img {
	width: ~~100%~~;		width: auto;
	height: 100%;		height: 100%;
	object-fit: cover;		object-fit: cover;

VijayanPN at 10:27, 9 June 2026

2026-06-09T10:27:18Z

← Older revision		Revision as of 15:57, 9 June 2026
Line 1:		Line 1:
			/* ================ ARTICLE CARD STANDARDISED STYLES ================ */

	.article-card {		.article-card {
	display: flex;		display: flex;
	~~gap~~: ~~1rem~~;		flex-direction: column;
	border: 1px solid #~~ddd~~;		border: 1px solid #e2e8f0;
	border-radius: ~~6px~~;		border-radius: 8px;
	~~padding~~: 0.~~75rem~~;		margin-bottom: 1.5rem;
	~~margin~~-~~bottom~~: ~~1rem~~;		background-color: #ffffff;
	background-color: #~~fafafa~~;		overflow: hidden;
			box-shadow: 0 1px 3px rgba(0,0,0,0.05);
			height: 100%;
			}

			/* Image container styling at the top */
			.article-thumbnail {
			width: 100%;
			max-height: 180px;
			overflow: hidden;
			background-color: #f7fafc;
	}		}

	.article-thumbnail img {		.article-thumbnail img {
	~~max-~~width: ~~150px~~;		width: 100%;
	~~border~~-~~radius~~: ~~4px~~;		height: 100%;
			object-fit: cover;
			display: block;
	}		}

			/* Informational text wrapper below the image */
	.article-info {		.article-info {
	flex: 1;		padding: 1rem;
			display: flex;
			flex-direction: column;
			flex-grow: 1;
	}		}

			/* Title / Displayname section with enforced font styling */
	.article-title {		.article-title {
	font-size: 1.~~1em~~;		font-family: 'Manjari', 'Meera', 'Rachana', 'Noto Sans Malayalam', sans-serif !important;
	font-weight: ~~bold~~;		font-size: 1.25em;
			font-weight: 700;
			line-height: 1.4;
			margin: 0 0 0.5rem 0;
			}

			.article-title a {
			color: #1a202c;
			text-decoration: none;
			}

			.article-title a:hover {
			color: #3182ce;
			}

			/* Standard compliant text containment replacing non-standard webkit-clamping */
			.article-intro-wrapper {
			position: relative;
			max-height: 4.8em; /* Exactly 3 lines (1.6em line-height * 3) */
			overflow: hidden;
			margin-bottom: 1rem;
			}

			.article-intro {
			font-family: 'Manjari', 'Meera', 'Rachana', 'Noto Sans Malayalam', sans-serif !important;
			font-size: 0.95em;
			line-height: 1.6em; /* Strict line-height definition */
			color: #4a5568;
	margin: 0;		margin: 0;
			padding: 0;
			}

			/* Single line layout row grouping Author name and Date together */
			.article-meta-row {
			display: flex;
			justify-content: space-between;
			align-items: center;
			margin-top: auto;
			padding-top: 0.5rem;
			border-top: 1px solid #edf2f7;
			font-family: 'Manjari', 'Meera', 'Rachana', 'Noto Sans Malayalam', sans-serif !important;
	}		}

	.article-author {		.article-author {
	font-size: 0.~~95em~~;		font-size: 0.85em;
	~~color~~: ~~#555~~;		font-weight: bold;
	~~margin~~: ~~0.25em 0~~;		color: #4a5568;
	}		}

	.article-date {		.article-date {
	font-size: 0.~~85em~~;		font-size: 0.8em;
	color: #~~777;~~		color: #718096;
	~~margin-bottom: 0.5em~~;
	}		}

	.~~article~~-~~summary~~ {		/* Optional placeholder class for hidden internal metadata layout */
	~~font-size~~: ~~0.95em;~~		.author-photo-hidden {
	~~line-height: 1.4~~;		display: none;
	}		}

VijayanPN: Created page with ".article-card { display: flex; gap: 1rem; border: 1px solid #ddd; border-radius: 6px; padding: 0.75rem; margin-bottom: 1rem; background-color: #fafafa; } .article-thumbnail img { max-width: 150px; border-radius: 4px; } .article-info { flex: 1; } .article-title { font-size: 1.1em; font-weight: bold; margin: 0; } .article-author { font-size: 0.95em; color: #555; margin: 0.25em 0; } .article-date { font-size: 0.85em; color: #777; m..."

2026-06-02T09:40:34Z

Created page with ".article-card { display: flex; gap: 1rem; border: 1px solid #ddd; border-radius: 6px; padding: 0.75rem; margin-bottom: 1rem; background-color: #fafafa; } .article-thumbnail img { max-width: 150px; border-radius: 4px; } .article-info { flex: 1; } .article-title { font-size: 1.1em; font-weight: bold; margin: 0; } .article-author { font-size: 0.95em; color: #555; margin: 0.25em 0; } .article-date { font-size: 0.85em; color: #777; m..."

New page

.article-card {
display: flex;
gap: 1rem;
border: 1px solid #ddd;
border-radius: 6px;
padding: 0.75rem;
margin-bottom: 1rem;
background-color: #fafafa;
}

.article-thumbnail img {
max-width: 150px;
border-radius: 4px;
}

.article-info {
flex: 1;
}

.article-title {
font-size: 1.1em;
font-weight: bold;
margin: 0;
}

.article-author {
font-size: 0.95em;
color: #555;
margin: 0.25em 0;
}

.article-date {
font-size: 0.85em;
color: #777;
margin-bottom: 0.5em;
}

.article-summary {
font-size: 0.95em;
line-height: 1.4;
}