Template

Card2/styles.css

From Dogcraft Wiki

div.wiki-card {
    display: flex; 
    flex-direction: column; 
    font-weight: 600; 
    background: #ffffff; 
    border-radius:5px;  
	box-shadow: 0 2px 3px rgba(85, 85, 85, 0.1), 0 0 0 1px rgba(85, 85, 85, 0.1);
    transition: box-shadow 0.2s ease-in-out;
}

div.wiki-card:hover,
div.wiki-card:focus{
    box-shadow: 0 2px 3px rgba(85, 85, 85, 0.25), 0 0 10px rgba(85, 85, 85, 0.25);
}

div.wiki-card > a:nth-child(1) {
	height: 5em; /*this is important because of image height hack (see template doc)*/
}

div.wiki-card > a:nth-child(1) > img {
    height: 100%;
    object-fit: cover;
    border-radius: 5px 5px 0 0;
	filter: saturate(75%) brightness(87%);
}

div.wiki-card > a:nth-child(2) {
	box-sizing:border-box;
	padding: 10px 5px;
	width: 100%;
	line-height: 20px;
	font-size: 16px; /*this is important because of image height hack (see template doc)*/
	text-align: center;
	overflow-x: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}

div.wiki-card:hover > a:nth-child(1) > img,
div.wiki-card:focus > a:nth-child(1) > img{
	filter: saturate(100%) brightness(100%);
}

div.wiki-card > a:nth-child(2):hover,
div.wiki-card > a:nth-child(2):focus {
	text-decoration: none;
}

div.wiki-card.card-overflow > a:nth-child(2) {
	text-overflow: ellipsis;
	white-space: normal;
}
This page was last modified on 28 June 2023, at 22:03. (10 months ago)