Magent: Replacement for the MediaWiki: page once pickipedia#140 is deployed

2026-10-09T22:15:33Z

Replacement for the MediaWiki: page once pickipedia#140 is deployed

New page

/* CSS placed here will be applied to all skins */

#siteSub {
display: block;
font-size: 10px;
}

@media screen and (max-width: 600px) {
.show-infobox {
float: none !important;
width: 100% !important;
margin: 0 0 1em 0 !important;
box-sizing: border-box;
}
}

/* The user-subpage zine styling is in the PickiPediaReleases extension now
* (ext.pickipediaReleases.zine.css). See cryptograss/pickipedia#140. */

/* ============================================================
* Listening lists — see [[Template:Listening list]]
* ============================================================ */

.pp-ll-head {
border-left: 3px solid #7d8c76;
padding: 0.1em 0 0.25em 1em;
margin: 0.4em 0 1.5em 0;
}
.pp-ll-kicker {
font-size: 0.72em;
letter-spacing: 0.14em;
text-transform: uppercase;
color: #6b7566;
margin-bottom: 0.5em;
}
.pp-ll-name {
font-family: Georgia, "Times New Roman", serif;
font-size: 1.55em;
line-height: 1.22;
font-weight: 600;
color: #2f3a2e;
margin-bottom: 0.4em;
max-width: 24em;
}
.pp-ll-dek {
font-size: 0.95em;
line-height: 1.5;
color: #3d4a3e;
margin-bottom: 0.7em;
max-width: 42em;
}
.pp-ll-meta {
font-family: monospace;
font-size: 0.78em;
color: #6b7566;
}
.pp-ll-meta a { color: #6b7566; }

.pp-ll-row {
display: flex;
flex-wrap: wrap;
align-items: baseline;
gap: 0.3em 1em;
padding: 0.6em 0.3em;
border-bottom: 1px solid #d4dacd;
max-width: 60em;
}
.pp-ll-row:hover { background: #f4f6f2; }

.pp-ll-main { flex: 1 1 20em; min-width: 0; }

.pp-ll-artist {
font-size: 0.72em;
letter-spacing: 0.09em;
text-transform: uppercase;
color: #5a6858;
}
/* an entry with no credited artist shouldn't leave a blank line */
.pp-ll-artist:empty { display: none; }

.pp-ll-title {
font-weight: 600;
font-size: 1.02em;
line-height: 1.35;
}

.pp-ll-note {
font-size: 0.87em;
font-style: italic;
line-height: 1.45;
color: #3d4a3e;
margin-top: 0.2em;
max-width: 40em;
}
.pp-ll-note::before { content: "\201C"; }
.pp-ll-note::after { content: "\201D"; }

.pp-ll-starts { margin-top: 0.35em; }
.pp-ll-chip {
display: inline-block;
font-size: 0.82em;
border: 1px solid #d4dacd;
border-radius: 999px;
padding: 0.05em 0.7em;
margin: 0.15em 0.35em 0.15em 0;
background: #fbfcfa;
}

.pp-ll-side {
flex: 0 0 auto;
margin-left: auto;
font-family: monospace;
font-size: 0.76em;
color: #6b7566;
white-space: nowrap;
}
.pp-ll-nosource { color: #a8a08e; }

@media screen and (max-width: 600px) {
.pp-ll-row { flex-wrap: wrap; }
.pp-ll-side { flex-basis: 100%; text-align: left; padding-top: 0.25em; }
}
/* ============================================================
* Listening list art cell + Record infobox
* ============================================================ */

.pp-ll-art {
flex: 0 0 auto;
width: 64px;
align-self: center;
}
.pp-ll-art img {
width: 64px;
height: 64px;
object-fit: cover;
border-radius: 4px;
border: 1px solid #d4dacd;
display: block;
}
/* no art yet: hold the column so titles align, hint the gap */
.pp-ll-art:empty {
height: 64px;
border-radius: 4px;
border: 1px dashed #d4dacd;
background: #fbfcfa;
}
@media screen and (max-width: 600px) {
.pp-ll-art, .pp-ll-art:empty { width: 48px; height: 48px; }
.pp-ll-art img { width: 48px; height: 48px; }
}

.pp-record-box {
float: right;
clear: right;
width: 20em;
margin: 0 0 1em 1em;
border: 1px solid #d4dacd;
background: #fbfcfa;
border-radius: 6px;
overflow: hidden;
}
.pp-record-box .pp-record-art img { width: 100%; height: auto; display: block; }
.pp-record-head {
padding: .6em .8em .1em;
font-family: Georgia, "Times New Roman", serif;
font-size: 1.15em;
font-weight: 600;
color: #2f3a2e;
}
.pp-record-meta {
padding: 0 .8em .6em;
font-size: .85em;
color: #3d4a3e;
}
.pp-record-listen {
border-top: 1px solid #d4dacd;
padding: .45em .8em;
font-family: monospace;
font-size: .78em;
}
@media screen and (max-width: 600px) {
.pp-record-box { float: none; width: 100%; margin: 0 0 1em 0; }
}

/* Podcast episode artwork — see Template:Firehose row and Template:PodcastEpisode. */
.pp-episode-art img {
display: block;
object-fit: cover;
border-radius: 4px;
border: 1px solid #d4dacd;
}
.pp-episode-art--row { flex: 0 0 auto; width: 56px; height: 56px; }
.pp-episode-art--row img { width: 56px; height: 56px; box-sizing: border-box; }
/* no art: hold the column so the titles still line up */
.pp-episode-art--none {
border-radius: 4px;
border: 1px dashed #d4dacd;
background: #fbfcfa;
box-sizing: border-box;
}
.pp-episode-art--large img { width: 100%; max-width: 250px; height: auto; margin: 0 auto; }
@media screen and (max-width: 600px) {
.pp-episode-art--row, .pp-episode-art--row img { width: 44px; height: 44px; }
}

User:Magent/Common.css after zine - Revision history

Magent: Replacement for the MediaWiki: page once pickipedia#140 is deployed