themez

some themes for my site. you can apply these in a user style manager such as Stylus (Chrome) (Firefox) or Stylem (for Pale Moon but may work on other XUL-compatible browsers)

classic

show/hide

the old, super minimalist layout remade to work on the newest version of my site:

html {
    scrollbar-color: rgb(51, 63, 49) rgb(90, 150, 96);
    color: rgb(91, 255, 91);
    background-color: black;
    background-image: none;
    font-family: Consolas, ConsolasTTF, monospace;
}

h2, nav, .buttonBox, .homeTitle {
    text-align: center
}

nav, .buttonBox, textarea {
    background-color: rgb(15, 15, 15)
}

nav, .buttonBox {
    color: rgb(255, 0, 68);
}

.container {
    max-width: 555px;
    margin: 0 auto;
    justify-content: space-between;
}

ul {
    line-height: 150%;
    list-style: none;
}

ul li:before {
    content: inherit;
    font-size: 120%;
    }

.content {
    background-color: black;
    position: relative;
    padding: 5%;
    margin: 20px
}


.homeTitle, red {
    color: red;
}

h2 {
    color:rgb(0, 255, 166)
}

textarea {
    color: inherit;
    font-family: inherit;
    width: auto;
}

pixelated {
    image-rendering: crisp-edges;
    image-rendering: pixelated
}

yellow {
    color: yellow
}

dark {
    color: rgb(0, 112, 0)
}

tags {
    color: rgb(35, 100, 35);
    font-size: 80%;
}

.titleContainer {
    display: none
}

nav, .buttonBox, .content {
    box-shadow: none;
    border-radius: 5px 5px 0px 0px;
}

@media (min-width: 640px) {
}
.buttonBox {
    margin: 20px 10%;
}

nav {
    margin: 0 10% 10px
}

@media (min-width: 1024px) {
    nav, .buttonBox {
        position: absolute;
        top: 25px;
        width: 23.5%;
    }
    
    nav {
        margin: 0;
    }
    
    .buttonBox {
        top: 10px;
        right: 0px;
        margin: 10px
    }
}

.title {
    font-size: small;
    background-color: rgb(28, 28, 28);
    border-radius: 5px;
    text-align: left;
    font-weight: bold;
    list-style-image: url("icons/restore.png");
}

details[open] > .title {
    list-style-image: url("icons/minimize.png");
    border-radius: 5px 5px 0px 0px;
}

a:link {
    color:rgb(25, 85, 255);
    text-decoration: none
}

a:visited {
    color:rgb(108, 75, 255);
    text-decoration: none
}

a:hover {
    text-decoration: underline
}

a:active {
    color: rgb(255, 0, 120)
}

small {
    font-size: smaller
}

img, video {
    max-width: 100%;
    vertical-align: middle;
}

warning {
    color: steelblue;
}

@font-face {
    font-family: Consolas;
    src: url(/consolas.ttf);
}

also add this css but only make it apply to the webrings page:

.container {
    max-width: 864px;
}

soft

show/hide