No edit summary |
No edit summary |
||
(21 intermediate revisions by the same user not shown) | |||
Line 9: | Line 9: | ||
padding: .5em; | padding: .5em; | ||
overflow: hidden; | overflow: hidden; | ||
position:relative; | |||
} | } | ||
.card .right { | .card .right { | ||
Line 18: | Line 18: | ||
float: left; | float: left; | ||
margin: .5em; | margin: .5em; | ||
} | |||
.card-icon img{ | |||
height: 1.3em; | |||
width: 1.3em; | |||
} | } | ||
.card-tooltip { | .card-tooltip { | ||
Line 55: | Line 59: | ||
width: auto; | width: auto; | ||
} | } | ||
.card-indicator { | |||
float: right; | |||
position: absolute; | |||
width: 36px; | |||
height: 36px; | |||
top: 6px; | |||
right: 8px; | |||
opacity: .75; | |||
} | |||
/* Live Excerpt Indicator */ | |||
.circle { | |||
width: 10px; | |||
height: 10px; | |||
background-color: #D29B31; | |||
border-radius: 50%; | |||
position: absolute; | |||
top: 13px; | |||
left: 13px; | |||
} | |||
.pulse { | |||
border: 2px solid #D29B31; | |||
border-radius: 25px; | |||
height: 16px; | |||
width: 16px; | |||
position: absolute; | |||
left: 10px; | |||
top: 10px; | |||
animation: pulsate 5s ease-out; | |||
animation-iteration-count: infinite; | |||
opacity: 0.0; | |||
} | |||
@keyframes pulsate { | |||
0% {transform: scale(0.1, 0.1); opacity: 0.0;} | |||
50% {opacity: .5;} | |||
100% {transform: scale(1.15, 1.15); opacity: 0.0;} | |||
} | |||
/** | /** | ||
Line 67: | Line 112: | ||
filter: invert( 1 ); | filter: invert( 1 ); | ||
} | } | ||
Line 73: | Line 117: | ||
/* Interwiki inclusion modifications */ | /* Interwiki inclusion modifications */ | ||
.wikipedia-excerpt .infobox,.navigation-not-searchable { | .wikipedia-excerpt .error,.infobox,.navigation-not-searchable { | ||
display:none; | display:none; | ||
} | } | ||
Line 82: | Line 126: | ||
margin-top:0; | margin-top:0; | ||
} | } | ||
Latest revision as of 18:05, 5 February 2024
.card {
background: #f8f9fa;
border: 1px solid #a2a9b1;
border-left: 1em solid #a2a9b1;
box-sizing: border-box;
break-inside: avoid;
margin: 1em 0;
padding: .5em;
overflow: hidden;
position:relative;
}
.card .right {
float: right;
}
.card-icon {
float: left;
margin: .5em;
}
.card-icon img{
height: 1.3em;
width: 1.3em;
}
.card-tooltip {
float: right;
margin: .5em;
}
.card-title {
font-weight: bold;
margin: .5em;
}
.card-content {
margin: .5em;
}
.card-content img {
vertical-align: middle;
max-width: 100%;
height: auto;
}
.card-content .thumb {
background: transparent;
border: none;
}
.card-content .thumbinner {
margin: 0;
}
.card-content .template-video {
background: transparent;
border: none;
padding: 0;
}
.card-grid {
display: grid;
grid-auto-rows: minmax( 100px, auto );
grid-gap: 10px;
grid-template-columns: repeat( auto-fit, minmax( 300px, 1fr ) );
margin: 1em 0;
width: auto;
}
.card-indicator {
float: right;
position: absolute;
width: 36px;
height: 36px;
top: 6px;
right: 8px;
opacity: .75;
}
/* Live Excerpt Indicator */
.circle {
width: 10px;
height: 10px;
background-color: #D29B31;
border-radius: 50%;
position: absolute;
top: 13px;
left: 13px;
}
.pulse {
border: 2px solid #D29B31;
border-radius: 25px;
height: 16px;
width: 16px;
position: absolute;
left: 10px;
top: 10px;
animation: pulsate 5s ease-out;
animation-iteration-count: infinite;
opacity: 0.0;
}
@keyframes pulsate {
0% {transform: scale(0.1, 0.1); opacity: 0.0;}
50% {opacity: .5;}
100% {transform: scale(1.15, 1.15); opacity: 0.0;}
}
/**
* Dark mode
*/
html.skin-citizen-dark .card {
background: #303134;
border-color: #3c4043;
color: #bdc1c6;
}
html.skin-citizen-dark .card-icon {
filter: invert( 1 );
}
/* Interwiki inclusion modifications */
.wikipedia-excerpt .error,.infobox,.navigation-not-searchable {
display:none;
}
.wikipedia-excerpt .mw-references-wrap {
height:0;
overflow:hidden;
margin-top:0;
}