literature

Terminal CSS

Deviation Actions

Published: Jul 14, 2009

11.2K Views

Literature Text

.journalbox{
    border-style:solid inset;
    border-width:6px;
    border-color:#ccd9d8;
    background-color:#080808;
    color:#5fba3d;
    font-family:monospace, prestige;
}

a{
    color:#5fba3d;
    text-decoration:underline;
}

.journaltop{
    background-color:#080808;
    color:#5fba3d;
}

h2{
    color:#5fba3d;
    font-family:monospace, prestige;
}

img{
    width:0px;
    height:0px;
}

li{
    background-color:#080808;
}

.a{
    background-color:#080808;
}

.redback{
    background-color:#d5381a;
    color:#080808;
}

.blueback{
    background-color:#0034dc;
    color:#5fba3d;
}

.greenback{
    background-color:#5fba3d;
    color:#080808;
}

.yellowback{
    background-color:#e5df43;
    color:#d5381a;
}

.greyback{
    background-color:#888888;
    color:#ffffff;
}

.border{
    width:auto;
    height:auto;
    border-style:solid;
    border-width:3px;
    border-color:#888888;
}

.image{
    width:auto;
    height:auto;
}

Terminal CSS to make your journal look more old school!

Useful hints:

If you want to add images, you'll have to add the "image" or "border" class to the image tag ( <img class="image OR border" src="picture.png" /> )
With "image" it's just a normal image, "border" adds a grey 3 pixel border, like you can see in the CSS preview.

The reason you have to use different classes for images is because I removed all standard icons by making images invisible by default, which means the normal journal icon that appears before your title won't show, and neither will mood icons.

There are 5 different text markup classes: "redback", "greenback", "yellowback", "blueback" and "greyback", all shown in preview.
You can use either span or div tag to style the text. Examples from my preview are:
<span class="yellowback">source=bash@wikipedia</span>
and
<DlV class="redback">Terminal CSS by Svanrog</DlV>
(Note that I've written 'DlV' as 'DLV' above, because if I'd use the proper 'div', then those tags would disappear)

Please comment and fav if you use this CSS, and if you'd run into any problem with my CSS, be sure to notify me and I'll make sure to sort it out~

Comments16

Join the community to add your comment. Already a deviant? Log In

KasaiNeko42a

Jul 30, 2015

How do I use this?