Apple Classic

Tags: apple; macos; macos 9; retro; old; macintosh; colourful; colorful;

Description:

A layout based on MacOS 9

You can change this to fit your tastes, but please don't remove the comment at the top, you'll hurt my feelings

Preview:

click on the image for a larger preview

Code:

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

<style>
/*
    this layout was made by Ashton Evans (Crystepsi) "https://spacehey.com/crystepsi"
    please do not remove this comment
    feel free to change anything you want, i tried to explain what's going on with comments

    https://discord.gg/HsBC9sFTKY  
*/

/* sets the background image */
body {
    background-image: url("https://upload.wikimedia.org/wikipedia/commons/e/ef/Mac_OS_9_Wallpaper.jpg");
    color: black;
}
/* rainbow footer */
footer {
    background-image: linear-gradient(#61BB46, #FDB827, #F5821F, #E03A3E, #963D97, #009DDC);
    border-radius: 10px !important;
}

/* set text colours */
h1, h2, h3, h4, h5, h6, p {
    color: black !important;
}
a {
    color: #63629b !important;
}
a:hover {
    color: #57555b !important;
}
.profile .friends .person p {
    color: #63629b !important;  
}
.profile .friends .person p:hover {
    color: #57555b !important;
}
.count {
    color: #63629b;
}
nav, nav .links a {
    color: #000;
    text-shadow: none;
}

/* set name font */
.profile h1 {
    font-family: 'EB Garamond';
    font-size: 40px;
    font-weight: normal;
    text-align: center;
}

/* add radius to images */
.profile-pic img {
    /* own pfp */
    border-radius: 15px;
}
.profile .friends .person img:not(.icon) {
    /* friends' pfp */
    border-radius:15px;
}

/* customising the menu and link bars */
nav .top {
    background-color: #dedcde;
    border: 1px solid black;
    border-radius: 10px !important;
}
nav .links {
    background-image: linear-gradient(#61BB46, #FDB827, #F5821F, #E03A3E, #963D97, #009DDC);
    border-left: 1px solid black;
    border-right: 1px solid black;
    border-radius: 10px !important;
}

/* this is the actual 'profile' section */
main {
    background-color: rgba(222,220,222, 0.5);
    border: 1px solid black;
    border-radius: 10px !important;
}
footer .copyright::after {
content: "\A But most of all, Ashton is my hero";
white-space: pre;
}
.profile .contact, .profile .table-section, .home-actions, .url-info{
    background-color: none;
    border-width: 1px 2px 2px 1px !important;
    border-color: black !important;
}
.heading {
    background-color: #dedcde !important;
    text-align: center !important;
}
.heading:hover {
    background-color: #8d8b8d !important;
}
.url-info 
{
    background-color: #dedcde !important;
    text-align: center !important;
}
.url-info:hover {
    background-color: #8d8b8d !important;
}

/* comments table stuff */
.comments-table {
    border: black;
    border-width: 1px 2px 2px 1px;
}
.comments-table td{
    border-width: 1px 2px 2px 1px;
}
.comments-table td {
    background-color: #dedcde !important;
}
.comments-table td:hover {
    background-color: #8d8b8d !important;
}
.comment-replies {
    background-image: linear-gradient(#61BB46, #FDB827, #F5821F, #E03A3E, #963D97, #009DDC);
    border-radius: 10px !important;
}
.table-section td {
    background: none !important;
}

/* scrollbar */
::-webkit-scrollbar {
    width: 10px;
    height: 12px;
}
::-webkit-scrollbar-track {
    border-radius: var(--curve);
    border: 1px solid black;
    background: #f0eef0;
}
::-webkit-scrollbar-thumb {
    background: #dedcde; 
}
::-webkit-scrollbar-thumb:hover {
    background: #8d8b8d;  
}
</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.

Comments

Displaying 4 of 4 comments ( View all | Add Comment )

HikikomoriDev	1729041852 Now we talkin'! Report Comment
daisy mae	1728389450 very cool! Report Comment
Minidroit	1717358886 Very cool layout. I will be using this. Report Comment
Cap!!	1704539689 using!! Report Comment