/* blog.css - shared type sizes and link colors for blog posts */

:root {
    --blog-body: 19px;
    --blog-small: 16px;
    --blog-title: 42px;
    --blog-h2: 27px;
    --blog-link-internal: #4cff6a;
    --blog-link-external: #c084fc;
}

@media (max-width: 600px) {
    :root {
        --blog-body: 17px;
        --blog-small: 15px;
        --blog-title: 31px;
        --blog-h2: 23px;
    }
}

.prose {
    font-size: var(--blog-body);
}
.post-title {
    font-size: var(--blog-title);
}
.prose h2 {
    font-size: var(--blog-h2);
}
.post-date,
.prose p.discuss {
    font-size: var(--blog-small);
}

/* Links: internal (root-relative or same-page) and external */
.prose a[href^="/"][href],
.prose a[href^="#"][href] {
    color: var(--blog-link-internal);
}
.prose a[href^="http"][href] {
    color: var(--blog-link-external);
}