Template:Demo RecipeItemIcon/styles.css: Difference between revisions

From Eco - English Wiki
[unchecked revision][unchecked revision]
WugWugg (talk | contribs)
mNo edit summary
WugWugg (talk | contribs)
No edit summary
Line 19: Line 19:
.recipe-item-icon__count {
.recipe-item-icon__count {
position: absolute;
position: absolute;
bottom: 4px;
bottom: clamp(4px, 0.1em, 16px);
right: 4px;
right: clamp(4px, 0.1em, 16px);
line-height: 1;
line-height: 1;
color: #fff;
color: #fff;

Revision as of 14:16, 19 February 2026

.recipe-item-icon {
	position: relative;
	width: fit-content;
	height: fit-content;
	background-color: yellow;
	border: clamp(2px, 0.1em, 8px) solid yellow;
	border-radius: clamp(1px, 0.1em, 4px);
}

.recipe-item-icon__img-container {
	width: 1em;
	height: 1em;
}

.recipe-item-icon__img-container img {
	display: block;
}

.recipe-item-icon__count {
	position: absolute;
	bottom: clamp(4px, 0.1em, 16px);
	right: clamp(4px, 0.1em, 16px);
	line-height: 1;
	color: #fff;
	text-shadow: 0 1px 2px rgba(0,0,0,0.85);
	font-weight: bold;
	font-size: 0.3em;
}