ROBLOX 2013 Layout

Tags: roblox, 2013, videogames, internet, what do i put here

Description:

I tried making the nav bars max width and position fixed, but that's impossible unfortunately, I hope i can find a solution to that, somehow.

activity status doesn't work that well, it'll always show users that you're online on website.

SO

WARNING1!!

before using it pls check on the last scroll-line depending on ur preferences whether u want to be seen as offline or online

But in future, hopefully I can add an active symbol next to usernames of profile friends list if you know what i mean, like classic roblox. and try to find solution for activity status in the profile so that it works like a regular status to show if the persons online or not!!!11 i hope what i said made sense lol

Tried my best, Hope this is enough

feel free to ask questions!

Preview:

click on the image for a larger preview

Code:

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

<style>
/*Main*/

body {
    background-color: #ffffff;
    font-family: helvetica;
}

.container {
    width: 845px;
}

nav .top {
    background: linear-gradient(to bottom, #1951a5, #124083);
    height: 40px;
    padding: 14px 14px 11px 14px;
}
.general-about .profile-pic img {
    max-width: 165px;
}

.logo {
content: url("https://1000logos.net/wp-content/uploads/2017/09/Roblox-Logo-2010.png")
}

nav .top .left .logo {
    margin-top: -31px;
    padding: 3px;
}

nav .top .left .logo {
    width: 139px;
    height: 75px;
}

nav .top .left img {
    margin: 0 0 0 0px;
}

.col.w-40 {
    width: 41%;
}

.general-about .profile-pic img {
    max-width: 165px;
    max-height: 165px;
}

.online {
    content: var(--status);
    color: #ff0000;
    font-size: 95%;
    font-style: italic;
}

.online img {
    margin-right: -12px;
    animation-name: none;
    opacity: 0;
}

.profile h1::before {
    content: "Hello, ";
}

.profile h1::after {
    content: "!";
}

.profile .contact .heading, .profile .table-section .heading, .setting-section .heading, .home-actions .heading {
    background: linear-gradient(to bottom, #585858, #2e2e2e);
    clip-path: polygon( 0% 0%, 0% 0%, 96% 0%, 104% 103%, 0% 100%, 100% 0%, 0% 100%, 0 0% );
    border-top-left-radius: 3.5px;
    font-style: normal;
    color: white;
    padding: 3px 4px;
}

.profile .contact, .profile .url-info, .profile .table-section, .setting-section, .home-actions {
    width: 100%;
    border: 2px solid transparent;
    margin: 10px 0;
}

.col w-40 left, .table-section .inner, .contact .inner {
    background: linear-gradient(to bottom, #eeeeee 12%, transparent 70%);
    border: 1px solid #999999;
}

.details-table td:first-child {
    background: transparent;
    color: #000000;
    font-weight: bold;
    width: 33%;
}

.details-table td {
    background: transparent;
}

.table-section .inner .details-table p a {
    color: black;
    margin: -19px;
}

.profile-info {
    border: 1px solid #8b8b8b;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 0px 4px;
    margin-bottom: 0px;
}

.blog-preview h4 {
    background: linear-gradient(to bottom, #585858, #2e2e2e);
    clip-path: polygon( 0% 0%, 0% 0%, 96% 0%, 104% 103%, 0% 100%, 100% 0%, 0% 100%, 0 0% );
    border-top-left-radius: 3.5px;
    font-style: normal;
    color: white;
    padding: 6px 7px;
margin-bottom: 0px;
}

.blog-preview p {
    background: #bdbdbd;
    width: 478px;
    padding: 2px 4px;
    border: 1px solid #000000;
    border-top: none;
    font-family: MS UI Gothic;
    font-weight: bold;
    font-style: italic;
    margin-top: -11px;
    margin: 0.1px;
}

.profile .blurbs .heading, .profile .friends .heading {
    background: linear-gradient(39deg, white 95.6%, #c7c7c7 50%);
    width: 319px;
    clip-path: polygon( 0% 0%, 0% 0%, 95% 0%, 105% 103%, 0% 100%, 100% 0%, 0% 100%, 0 0% );
    border: 1px solid #c7c7c7;
    border-top-left-radius: 3px;
    border-bottom: 1px solid white;
    color: black;
    padding: 4px 7px;
}

.profile .blurbs .inner, .profile .friends .inner, .blog-entry .comments .inner, .bulletin .comments .inner, .setting-section .inner ::before {
    border: 1px solid #c7c7c7;
    margin-top: -1px;
}

.profile .friends .inner {
    margin-bottom: 12px;
    padding: 16px;
}

.profile .friends .person {
    width: 121px;
    display: inline-block;
    padding: 0 10px 15px 0;
}

.comments-table td:first-child, .music-table td:first-child {
    background: transparent;
}

.comments-table td, .music-table td {
    background: transparent;
}

/* text stuff */

.contact, .f-row a {
    color: #0070e8;
    text-decoration: none;
}

nav .links {
    background-color: #191919;
    padding: 4.5px 15px 4.5px 16px;
}

nav .links li.active a {
    font-weight: normal;
    line-height: 5px;
}

.icon, .award img {
    opacity: 0;
    margin: 0px;
}

.links .active .icon {
    opcaity: 0;
    margin: -1px 37px;
}

nav .links a {
    text-decoration: none;
    color: white;
    font-size: max(0.98em, 12px);
    text-shadow: 0 0 7px transparent;
}

nav .links li:not(:last-child)::after, footer .links li:not(:last-child)::after {
    content: " | ";
    color: transparent;
}

nav .links .special a {
    color: #ffffff;
}

.col w-40 left .mood, b a {
    color: #0069d9;
    text-decoration: none;
}

.col right, a {
    color: #0069d9;
    text-decoration: none;
}

.blog-preview a {
    color: white;
}

.blog-preview p a {
    color: #0069d9;
}

.profile .blurbs .section h4 {
    margin-bottom: 3px;
    color: black;
    font-size: 12px;
}

.profile .contact .f-row {
    margin-left: 1px;
}

.count {
    color: #0069d9;
}

.profile .friends-grid .person a {
    color: #0069d9;
}

.online {
    color: #0C8C00;
    font-weight: bold;
    font-size: 0;
}

/* remove this if u wanna seen to be offline forever */
p.online::after {
    content: "[ Online: Website ]";
    color: #ff0000;
    font-size: 12px;
    font-weight: 100;
    font-style: italic;
    line-height: 25px;
    padding: 7px;
}

/* remove this if u wanna seen to be online forever */
p.online::after {
    content: "[ Offline ]";
    color: grey;
    font-size: 12px;
    font-weight: 100;
    font-style: normal;
    line-height: 25px;
    padding: 7px;
}

a:hover,
a:active,
.blog-entry .kudos-btn:hover,
.blog-entry .kudos-btn:active{
  color: #1E40AF;
  text-decoration: underline;
}

nav .links a:hover{
  text-decoration: underline;
  color: #ffffff;
}
</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 20 of 140 comments ( View all | Add Comment )

VULPES	1769504610 using Report Comment
Sixx	1769403901 using!! Report Comment
Cosmic brownies! ^3^	1769400903 Using! Report Comment
Cosmic brownies! ^3^	1769400903 Using! Report Comment
𝄞⨾𓍢ִ໋	1769134576 using Report Comment
FATmemegod	1766757004 using Report Comment
EVILWEEZER	1766120662 Using!! Report Comment
EVILWEEZER	1766120658 Using!! Report Comment
the sk8er, the h8er	1765219756 using Report Comment
kei kei	1764501211 using Report Comment
magnolia!! ^_^	1764054475 using!! Report Comment
𓏲ּ𝄢	1763921804 Using Report Comment
TheCakeIsaLie!	1763914996 using :D (only the logo but still using :3 ) Report Comment
ArcticMonkeysFans	1763357555 using Report Comment
numbrr1_yuriL0vr	1763343541 using !!! Report Comment
BL0ss0mL1ght	1761876149 using !! Report Comment
are17 / q	1761296445 using ! Report Comment
iluvchezburgr34	1760905492 Using! ;b Report Comment
batvomit	1759221605 USIN HELL YES Report Comment
☆ jaspyyy ^_^	1758227461 USINGGGG Report Comment