Skip to content

blog.fefe.de by tjb

Screenshot of blog.fefe.de

Details

Authortjb

LicenseMIT

Categoryblog.fefe.de

Created

Updated

Size3.1 kB

Statistics

Learn how we calculate statistics in the FAQ.

Failed to fetch stats.

Description

A simple and easy to read auto light/dark theme for blog.fefe.de

Notes

Userstyle doesn't have notes.

Source code

/* ==UserStyle==
@name         blog.fefe.de
@version      1.0.0
@namespace    userstyles.world/user/tjb
@description  A nice light/dark theme, based on fefe2.css
@author       tjb
@license      MIT
==/UserStyle== */

@-moz-document url-prefix("https://blog.fefe.de") {
@import url('https://fonts.googleapis.com/css2?family=JetBrains+Mono:wght@400;800&display=swap');

body {
    font-family: "JetBrains Mono", monospace;
    font-size: 1em;
    background-color: #ddd;
    color: #333;
    max-width: 720px;
    margin: 2em auto;
    line-height: 1.5em;
}

body > div:last-child {
    text-align: center !important;
    margin-top: 40px;
}

a {
    color: #4eb90f !important;
    text-decoration: none;
    font-weight: 600 !important;
}

a:hover {
    color: #fff !important;
    background: #000 !important;
}

li p,
blockquote {
    text-align: justify;
}


li p[u] b {
    color: #000;
    font-weight: bold;
}

h2 {
    text-align: right;
    margin-bottom: 0.2em;
    text-transform: lowercase;
    font-size: 2rem;
}

h3 {
    margin-bottom: 0em;
    text-transform: lowercase;
    font-size: 1.4em;
}

b {
    background-color: #000;
    padding: 0.2em 0.3em;
    float: right;
    text-transform: uppercase;
    width: 29em;
    text-align: right;
    font-weight: bold;
    color: #fff;
}

body > b:first-of-type {
    display: block;
    clear: both;
    margin-bottom: 20px;
    font-size: .75em;
}

body > p:first-of-type {
    content: "";
    clear: both;
    margin-bottom: 4rem;
}

ul b {
    float: none;
    color: #000;
    padding: 0;
    text-transform: none;
    background: 0;
    /*font: bold 1rem monospace;*/
}

ul,
li {
    list-style-type: none;
    margin: 0;
    padding: 0;
}

li {
    padding: 1.3em 0;
    border-color: #9f9f9f;
    border-bottom: 1px dashed #808080;
}

li a {
    text-decoration: none;
    font-weight: bold;
}

li a:hover {
    color: #fff;
    background-color: #000;
}

li pre {
    background: #ebf0f8;
    padding: 1em;
    border: 1px solid #999
}

blockquote {
    font-style: italic;
    border-left: 3px solid #999;
    padding: 0 1em;
    margin-left: 0;
}

li blockquote li {
    margin: 0 1em;
}

li ul,
li ol {
    margin: 1em 0;
}

li ul li,
li ol li {
    padding: 0;
    border: 0;
}

li ul li {
    list-style-type: square;
}

li ol li {
    list-style-type: upper-roman;
}

@media (prefers-color-scheme: dark) {
    body {
        background-color: #151c22;
        color: #eee;
    }
    a:hover {
        color: #fff !important;
        background: #62ab37 !important;
    }
    li pre {
        background-color: #32363e;
        border: none;
    }
    b {
        background-color: #000;
        color: #fff;
    }
    li p[u],
    li p[u] b {
        color: #fff;
    }
    li blockquote {
        color: #ddd;
    }
    ul b {
        color: #ddd;
    }
}

@media (max-width: 960px) {
    body {
        margin: 2em 5%;
    }
}
}

Reviews

No reviews yet.