/* Daily Links: layout B. Uses your theme's fonts; only spacing, numbers and accents are set here. */
.dlp-source,
.dlp-kicker,
.dlp-archive-date {
font-size: 0.75em;
font-weight: 600;
letter-spacing: 0.12em;
text-transform: uppercase;
opacity: 0.75;
}
.dlp-lead-image { margin: 0 0 1em; }
.dlp-lead-image img { display: block; width: 100%; height: auto; }
.dlp-lead-image a.dlp-lead-img-link { display: block; text-decoration: none; border: 0; box-shadow: none; }
.dlp-lead-image a.dlp-lead-img-link img { transition: opacity 0.15s ease; }
.dlp-lead-image a.dlp-lead-img-link:hover img,
.dlp-lead-image a.dlp-lead-img-link:focus-visible img { opacity: 0.88; }
.dlp-lead-image figcaption { margin-top: 0.4em; font-size: 0.75em; opacity: 0.7; }
.dlp-lead-title { margin: 0.2em 0 0.4em; line-height: 1.15; }
/* Headlines read as links: accent underline, and a small arrow on links that leave the site. */
.dlp-lead-title a,
.dlp-list h3 a,
.dlp-feature-title a,
.dlp-own a {
color: inherit;
text-decoration: underline;
text-decoration-color: var(--dlp-accent, #C2410C);
text-decoration-thickness: 2px;
text-underline-offset: 0.18em;
transition: color 0.15s ease, text-decoration-thickness 0.15s ease;
}
.dlp-lead-title a:hover,
.dlp-list h3 a:hover,
.dlp-feature-title a:hover,
.dlp-own a:hover,
.dlp-lead-title a:focus-visible,
.dlp-list h3 a:focus-visible,
.dlp-own a:focus-visible {
color: var(--dlp-accent, #C2410C);
text-decoration-thickness: 3px;
}
.dlp-lead-title a[target="_blank"]::after,
.dlp-list h3 a[target="_blank"]::after {
content: "\2197";
display: inline-block;
margin-left: 0.25em;
font-size: 0.75em;
font-weight: 700;
color: var(--dlp-accent, #C2410C);
text-decoration: none;
}
.dlp-rest-title,
.dlp-rest-head,
.dlp-own-title {
display: flex;
align-items: center;
gap: 0.75em;
margin: 0.5em 0 0.25em;
font-size: 1em;
letter-spacing: 0.15em;
text-transform: uppercase;
}
.dlp-rest-title::after,
.dlp-rest-head::after,
.dlp-own-title::after {
content: "";
flex: 1;
border-top: 3px solid currentColor;
}
/* The list: no bullets, no numbers, no indent. !important beats themes that indent lists in post content. */
.dlp-list,
.entry-content .dlp-list,
.post-content .dlp-list {
list-style: none !important;
margin: 0 !important;
padding: 0 !important;
}
.dlp-list > li {
list-style: none !important;
margin: 0 !important;
padding: 1em 0 !important;
border-bottom: 1px solid rgba(127, 127, 127, 0.25);
}
.dlp-list > li::before,
.dlp-list > li::marker { content: none !important; display: none; }
/* Source line above each headline */
.dlp-meta {
display: flex;
align-items: baseline;
gap: 0.6em;
margin: 0 0 0.35em;
}
.dlp-num {
font-weight: 700;
font-size: 1.15em;
line-height: 1;
letter-spacing: 0.04em;
color: var(--dlp-accent, #C2410C);
}
.dlp-meta .dlp-source { opacity: 0.75; }
.dlp-list h3 { margin: 0 0 0.35em; font-size: 1.2em; line-height: 1.3; }
.dlp-take { margin: 0; }
/*
* Ads (and anything else) that an ad network or plugin inserts into the list:
* centered and full width, whether they land inside a list item or between items.
*/
.dlp-list li > :not(h3):not(p),
.dlp-list > :not(li) {
display: block;
max-width: 100%;
margin: 1.25em auto;
text-align: center;
}
.dlp-list li > :not(h3):not(p) > *,
.dlp-list > :not(li) > * { margin-left: auto; margin-right: auto; }
.dlp-own a { font-weight: 600; }
/* Front page spot and [daily_links] */
.dlp-spot { margin: 2em 0; }
.dlp-spot-item { list-style: none; }
.dlp-feature {
padding: 2em 2.25em;
border-top: 6px solid var(--dlp-accent, #C2410C);
background: rgba(127, 127, 127, 0.06);
}
.dlp-feature .dlp-kicker { color: var(--dlp-accent, #C2410C); opacity: 1; }
.dlp-feature-title { margin: 0.15em 0 0.4em; }
.dlp-more a { font-weight: 600; color: var(--dlp-accent, #C2410C); }
.dlp-compact .dlp-list li { padding: 0.5em 0; }
.dlp-compact .dlp-list h3 { font-size: 1em; }
/* Archive */
.dlp-archive-wrap { padding: 2em 1em; }
.dlp-archive { max-width: 760px; margin: 0 auto; }
.dlp-archive .dlp-kicker { color: var(--dlp-accent, #C2410C); opacity: 1; }
.dlp-archive-head { display: flex; flex-wrap: wrap; align-items: flex-end; justify-content: space-between; gap: 1em; }
.dlp-archive-title { margin: 0.1em 0; }
.dlp-month { display: flex; align-items: center; gap: 0.75em; margin: 1.5em 0 0.25em; font-size: 1em; letter-spacing: 0.15em; text-transform: uppercase; }
.dlp-month::after { content: ""; flex: 1; border-top: 3px solid currentColor; }
.dlp-archive-row {
display: flex;
gap: 1.25em;
align-items: center;
padding: 1em 0;
border-bottom: 1px solid rgba(127, 127, 127, 0.25);
color: inherit;
text-decoration: none;
}
.dlp-archive-row:hover .dlp-archive-lead { color: var(--dlp-accent, #C2410C); }
.dlp-archive-thumb { flex: 0 0 200px; }
.dlp-archive-thumb img { display: block; width: 200px; height: 112px; object-fit: cover; }
.dlp-archive-text { display: flex; flex-direction: column; gap: 0.3em; min-width: 0; }
.dlp-archive-date { color: var(--dlp-accent, #C2410C); opacity: 1; }
.dlp-archive-lead { font-size: 1.25em; font-weight: 600; line-height: 1.2; }
.dlp-archive-more { opacity: 0.7; }
.dlp-archive-nav { display: flex; justify-content: space-between; gap: 1em; margin-top: 2em; font-weight: 600; }
@media (max-width: 600px) {
.dlp-feature { padding: 1.25em 1em; }
.dlp-archive-thumb { flex-basis: 110px; }
.dlp-archive-thumb img { width: 110px; height: 62px; }
.dlp-archive-lead { font-size: 1.05em; }
}
/*
* Type sizes. Set in rem with doubled classes so they beat themes that enlarge every or
* in post content. Headlines stay clearly bigger than takes on phones and desktops.
*/
.dlp-list.dlp-list h3 {
font-size: clamp(1.25rem, 1.1rem + 0.6vw, 1.5rem);
line-height: 1.3;
font-weight: 700;
}
.dlp-list.dlp-list p.dlp-take,
p.dlp-lead-take.dlp-lead-take {
font-size: clamp(1rem, 0.96rem + 0.25vw, 1.125rem);
line-height: 1.55;
opacity: 0.85;
}
.dlp-lead-title.dlp-lead-title {
font-size: clamp(1.6rem, 1.3rem + 1.4vw, 2.25rem);
line-height: 1.2;
}
p.dlp-lead-take.dlp-lead-take { font-size: clamp(1.05rem, 1rem + 0.3vw, 1.2rem); }
.dlp-list.dlp-list p.dlp-meta,
p.dlp-source.dlp-source {
font-size: 0.8rem;
line-height: 1.4;
}
.dlp-list.dlp-list p.dlp-meta .dlp-source { font-size: inherit; }
.dlp-paywall { margin-left: 0.4em; font-weight: 700; letter-spacing: 0.08em; text-transform: uppercase; color: var(--dlp-accent, #C2410C); }
.dlp-product-title { display: flex; align-items: center; gap: 0.75em; margin: 0.5em 0 0.25em; font-size: 1em; letter-spacing: 0.15em; text-transform: uppercase; }
.dlp-product-title::after { content: ""; flex: 1; border-top: 3px solid currentColor; }
.dlp-product .dlp-product-link { font-weight: 700; white-space: nowrap; }
p.dlp-disclosure.dlp-disclosure { font-size: 0.75rem; opacity: 0.65; margin-top: 0.4em; }
/* A line under each daily post to separate it from the next post on the homepage. */
.dlp-post {
padding-bottom: 1.5em;
margin-bottom: 2em;
border-bottom: 3px solid currentColor;
}
.dlp-post .dlp-list > li:last-child { border-bottom: 0; }
/*
* Linkage layout: the site's address over every underlined headline, lead included.
* No section headings, no arrows, the product pick is a regular row.
*/
.dlp-linkage-post .dlp-lead-title a::after,
.dlp-linkage-post .dlp-list h3 a::after { content: none !important; display: none !important; }
.dlp-linkage-post p.dlp-source.dlp-lead-source {
margin: 1.1em 0 0.35em;
font-size: 0.75rem;
font-weight: 700;
letter-spacing: 0.14em;
opacity: 0.7;
}
.dlp-linkage-post .dlp-lead-title.dlp-lead-title { margin: 0 0 1.25em; }
.dlp-linkage-post .dlp-list > li {
padding: 0.9em 0 !important;
border-bottom: 0;
border-top: 1px solid rgba(127, 127, 127, 0.22);
}
.dlp-linkage-post .dlp-list.dlp-list p.dlp-meta { margin: 0 0 0.3em; font-size: 0.75rem; }
.dlp-linkage-post .dlp-list.dlp-list p.dlp-meta .dlp-source { font-weight: 700; letter-spacing: 0.14em; opacity: 0.7; }
.dlp-linkage-post .dlp-list.dlp-list h3 {
margin: 0;
font-size: clamp(1.1rem, 1rem + 0.35vw, 1.25rem);
font-weight: 600;
line-height: 1.4;
}
.dlp-linkage-post .dlp-product-item h3 a { text-decoration-color: var(--dlp-accent, #C2410C); }
.dlp-linkage-post p.dlp-disclosure.dlp-disclosure { margin-top: 1.25em; }