MS-DOS Theme

Tags: dos, ms-dos, old tech

Description:

a theme meant to mimic MS-DOS. images dont look great on it

Preview:

click on the image for a larger preview

Code:

<!-- (c) Layout created by caneandtie (https://layouts.spacehey.com/layout?id=96665) -->

<!-- -------------------------------------------------------------
     

MS-DOS Theme by C&T  
(https://spacehey.com/dni)
Do not delete this text pl0x
     
     
     ------------------------------------------------------------- -->
<style>
 @font-face {
        font-family: "Perfect DOS VGA 437";
        src: url("https://notabug.neocities.org/Perfect%20DOS%20VGA%20437.ttf");
      }

      .container {
      width: 90%;
      max-width: 1600px;
      border-style: solid;
      border-color: white;
      align-items: center;
      }

      body {
        font-family: "Perfect DOS VGA 437", sans-serif;
        color: white;
        font-size: 26px;
        text-transform: uppercase;
        background-color: black;

      }

html {
filter: grayscale(100%) contrast(300%);
}

nav .top {
        background-color:black;
}

nav .links {
    text-align: center;
background-color:black;
}

.profile h1 {
       color: white;
}

.profile {
        background-color: black;
}

.count {
        color:white;
}

.details-table td {
        color:white;
}

main {
        color:white;
}

.profile .contact, .profile .table-section, .profile .url-info, .profile .friends, .profile .blurbs, table.comments-table, DIV.blog-preview { 
filter: grayscale(100%) sepia(100%) saturation:(200%) hue-rotate(220deg);
border-style:solid; 
border-color:white; 
background-color:black;
color: white;
}

/* contact icons */
.contact .inner a img {
font-size: 0;
}
.contact .inner a img:before {
font-size: 1em;
display: block
}
.contact .inner .f-row:nth-child(1) .f-col:nth-child(1) a:before {
/* add to friends */
content: "■"
}
.contact .inner .f-row:nth-child(1) .f-col:nth-child(2) a:before {
/* add to favorite */
content: "■"
}
.contact .inner .f-row:nth-child(2) .f-col:nth-child(1) a:before {
/* send a message */
content: "■"
}
.contact .inner .f-row:nth-child(2) .f-col:nth-child(2) a:before {
/* foward to friend*/
content: "■"
}
.contact .inner .f-row:nth-child(3) .f-col:nth-child(1) a:before {
/* instant message */
content: "■"
}
.contact .inner .f-row:nth-child(3) .f-col:nth-child(2) a:before {
/* block user */
content: "■"
}
.contact .inner .f-row:nth-child(4) .f-col:nth-child(1) a:before {
/* add 2 group  */
content: "■"
}
.contact .inner .f-row:nth-child(4) .f-col:nth-child(2) a:before {
/* report */
content: "■"
}
footer {
border-radius: 15px;
background-color:black;
color:White; 
}
.online{
content: url(https://media.discordapp.net/attachments/982506777859997709/1198496466608595057/DOS.gif);
}

:root {
--logo-blue: white;
--darker-blue:white;
--lighter-blue:#533973;
--even-lighter-blue:#533973;
--lightest-blue:#3f0f52;
--dark-orange:White;
--light-orange:#533973;
--even-lighter-orange:black;
--green:black;

}
div.ah.df.dg.dh {
    border-radius: 0 0 10px 10px;
    color:white;
}
div.b4.ah.dx.dy.dz.e0 {
    border-radius: 10px 0 0 0;
}
</style>

<style>
.friends .heading
.friends .heading:before{ content: "my friends"; font-size:.8rem; color:White; } 
}
.friends#comments .heading
.friends#comments .heading:before{ content: "comments"; font-size:.8rem; color:White; } 
}
.profile .table-section .heading h4
.profile .table-section .heading h4:before{ content: "my interests & my socials"; font-size:.8rem color:White; }

}
.contact .heading
.contact .heading:before{ content: "say hi"; font-size:.8rem; color:White; }
}
.blurbs .heading
.blurbs .heading:before{ content: "about me"; font-size:.8rem; color:White; }
}
</style>

Copy and paste this code into the "About me" section of your Profile to use it.

Caution: This Layout was not inspected by SpaceHey — use it at your own risk.