Template:HackerNews/styles.css: Difference between revisions
From Rest of What I Know
Created page with "→Hacker News card styles. Scoped by container class to avoid global bleed.: .mw-hn { border: 1px solid #e2e8f0; border-radius: 8px; padding: 12px 14px; margin: 8px 0; background: #fff; line-height: 1.45; font-family: system-ui, -apple-system, Segoe UI, Roboto, Helvetica, Arial, sans-serif; } →Header: .mw-hn-header { font-size: 0.9em; color: #475569; margin-bottom: 6px; display: flex; gap: 8px; align-items: center; } .mw-hn-header svg {..." |
Remove dark mode stuff |
||
| (One intermediate revision by the same user not shown) | |||
| Line 25: | Line 25: | ||
height: 18px; | height: 18px; | ||
} | } | ||
.mw-hn-header .mw-hn-logo { width:18px;height:18px;display:inline-block; } | |||
.mw-hn-header .mw-hn-logo::before { | |||
content:"▲"; font-weight:700; font-size:14px; line-height:18px; color:#f60; | |||
display:inline-block; text-align:center; width:18px; | |||
} | |||
/* Title */ | /* Title */ | ||
| Line 72: | Line 81: | ||
.mw-hn-header { font-size: 0.88em; gap: 6px; } | .mw-hn-header { font-size: 0.88em; gap: 6px; } | ||
.mw-hn-title { margin: 2px 0 4px 0; } | .mw-hn-title { margin: 2px 0 4px 0; } | ||
} | } | ||
Latest revision as of 07:40, 22 November 2025
/* Hacker News card styles. Scoped by container class to avoid global bleed. */
.mw-hn {
border: 1px solid #e2e8f0;
border-radius: 8px;
padding: 12px 14px;
margin: 8px 0;
background: #fff;
line-height: 1.45;
font-family: system-ui, -apple-system, Segoe UI, Roboto, Helvetica, Arial, sans-serif;
}
/* Header */
.mw-hn-header {
font-size: 0.9em;
color: #475569;
margin-bottom: 6px;
display: flex;
gap: 8px;
align-items: center;
}
.mw-hn-header svg {
flex: 0 0 auto;
vertical-align: middle;
width: 18px;
height: 18px;
}
.mw-hn-header .mw-hn-logo { width:18px;height:18px;display:inline-block; }
.mw-hn-header .mw-hn-logo::before {
content:"▲"; font-weight:700; font-size:14px; line-height:18px; color:#f60;
display:inline-block; text-align:center; width:18px;
}
/* Title */
.mw-hn-title {
font-weight: 600;
margin: 2px 0 6px 0;
color: #0f172a;
word-wrap: break-word;
overflow-wrap: anywhere;
}
/* Body excerpt */
.mw-hn blockquote.mw-hn-text {
margin: 6px 0 10px 0;
padding: 0 0 0 12px;
border-left: 3px solid #e2e8f0;
color: #0f172a;
}
.mw-hn blockquote.mw-hn-text p {
margin: 0.4em 0;
}
/* Meta line */
.mw-hn-meta {
font-size: 0.85em;
color: #475569;
display: flex;
flex-wrap: wrap;
gap: 8px;
align-items: center;
}
.mw-hn-meta a {
color: #0f6efd; /* MediaWiki default-ish link blue */
text-decoration: none;
}
.mw-hn-meta a:hover,
.mw-hn-meta a:focus {
text-decoration: underline;
}
.mw-hn-meta time {
white-space: nowrap;
}
/* Compact layout on narrow screens */
@media (max-width: 420px) {
.mw-hn { padding: 10px 12px; }
.mw-hn-header { font-size: 0.88em; gap: 6px; }
.mw-hn-title { margin: 2px 0 4px 0; }
}
/* Print */
@media print {
.mw-hn { border-color: #bbb; background: #fff; }
.mw-hn-meta a { text-decoration: underline; color: #000; }
}
