Skip to content

Instantly share code, notes, and snippets.

@aoaim
Last active January 15, 2026 07:10
Show Gist options
  • Select an option

  • Save aoaim/2eb9923e097655b9e0ebd8b5b9224ac8 to your computer and use it in GitHub Desktop.

Select an option

Save aoaim/2eb9923e097655b9e0ebd8b5b9224ac8 to your computer and use it in GitHub Desktop.
自用 miniflux 样式,根据 https://github.com/ryanccn/modernflux 修改
/* ========== 导入基础样式 ========== */
@import url("https://modernflux.ryanccn.dev/base.min.css");
/* ========== Flexoki Cyan 明暗自适应 ========== */
/* 🌞 亮色模式 */
@media (prefers-color-scheme: light) {
:root {
--modernflux-color-scheme: light;
--modernflux-fg0: #100f0f;
--modernflux-fg1: #6f6e69;
--modernflux-fg2: #b7b5ac;
--modernflux-bg0: #fffcf0;
--modernflux-bg1: #f2f0e5;
--modernflux-bg2: #e6e4d9;
--modernflux-accent: #24837b;
--modernflux-success: #66800b;
--modernflux-danger: #af3029;
}
}
/* 🌙 暗色模式 */
@media (prefers-color-scheme: dark) {
:root {
--modernflux-color-scheme: dark;
--modernflux-fg0: #cecdc3;
--modernflux-fg1: #878580;
--modernflux-fg2: #575653;
--modernflux-bg0: #100f0f;
--modernflux-bg1: #1c1b1a;
--modernflux-bg2: #282726;
--modernflux-accent: #3aa99f;
--modernflux-success: #879a39;
--modernflux-danger: #d14d41;
}
}
/* ========== 自定义变量 ========== */
:root {
--font-sans: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI",
"Roboto", "Helvetica Neue", "PingFang SC", "Hiragino Sans GB",
"Microsoft YaHei", sans-serif;
--content-width: 900px;
--img-radius: 8px;
--img-shadow: 0 4px 12px rgba(0, 0, 0, 0.08);
--img-shadow-hover: 0 8px 24px rgba(0, 0, 0, 0.12);
}
/* ========== 全局字体(包含 blockquote) ========== */
:root, body,
.entry-content,
.entry-content blockquote,
.entry-content pre,
.entry-content code,
.entry-title {
font-family: var(--font-sans) !important;
}
/* ========== 正文排版 ========== */
.entry-content {
font-size: 1rem !important;
line-height: 1.6 !important;
}
/* ========== 图片样式(移动优先) ========== */
.entry-content img {
display: block !important;
width: auto !important;
max-width: 100% !important;
margin: 1.5rem auto !important;
border-radius: var(--img-radius) !important;
box-shadow: var(--img-shadow) !important;
transition: transform 0.2s ease, box-shadow 0.2s ease;
}
.entry-content img:hover {
transform: scale(1.02);
box-shadow: var(--img-shadow-hover) !important;
}
/* ========== 平板适配 (768px - 1023px) ========== */
@media (min-width: 768px) and (max-width: 1023px) {
.entry, .entry-content {
max-width: var(--content-width) !important;
}
.entry-content img {
max-width: 70% !important;
max-height: 60vh !important;
}
}
/* ========== 电脑适配 (≥1024px) ========== */
@media (min-width: 1024px) {
.entry, .entry-content {
max-width: var(--content-width) !important;
}
.entry-content img {
max-width: 50% !important;
max-height: 60vh !important;
}
}
/* ========== 图片链接 & 图注 ========== */
.entry-content a:has(img) {
border-bottom: none !important;
text-decoration: none !important;
}
.entry-content figure,
.entry-content figcaption {
text-align: center !important;
width: 100% !important;
margin-top: 0.5rem !important;
font-size: 0.875em !important;
color: var(--modernflux-fg1) !important;
font-style: italic;
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment