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 dakota maetuhn (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 35 comments ( View all | Add Comment )

valerie	1713891028 usingg !!! Report Comment
natasha	1713546467 usiing Report Comment
cr0wluvr	1712974168 using :D Report Comment
J⚝X	1710041895 Using Report Comment
vampire's coat (alehhh) 🍉	1709404978 using!!!!!!!!1 Report Comment
matt ✭	1709227871 using! Report Comment
whereisenzo	1708992534 omg using this!!! Report Comment
Kluts	1708941903 Using!! :> Report Comment
Egor1566	1708782304 using : 3 Report Comment
alex (o_O)	1708670762 using :33 Report Comment
alex (o_O)	1708670762 using :33 Report Comment
𝓗𝓪𝓲𝔀𝓬𝓪𝓵𝓼	1707782593 usandooo Report Comment
AshamedGodhead	1706041296 Using ! :33 Report Comment
toothpasteboy	1705801195 Using Report Comment
jasper 🍀	1705038973 using!! Report Comment
Ray Starfloof	1703124625 Using :3 Report Comment
miles :p	1702721254 using :D Report Comment
liam / ethan	1702397828 using! Report Comment
toby/cass ✮	1702090786 using !!1 Report Comment