midnight city

Tags: compact, neon, city, small, simple, minimal, city, midnight, suni

Description:

midnight city

super compact layout inspired by TRaGiiCTaYY. *

check their layouts out! i love how compact they are and really wanted to create some layouts with a similar style! i'm such a sucker for the tiniest of layouts.

^{*they're aware i'm posting this, i wanted to make sure to give them proper credit for their influence on this one!}

info

this layout includes an animated neon gif header above your about me.

music not included in the code, just wanted to add a lil somethin' to my previews.

code to put your information in a scrollbox:

<div align="center"><div style="width: auto; height: 50px; background-color: #000000; color: #ffffff; font-size: 11px; font-family: Times New Roman; text-align: center; direction: ltr; overflow: auto;">
INSERT ABOUT ME TEXT HERE

</div></div>

this layout will hide your

url
friends
comments
links
profile info (the area at the top where it says "___ is your friend")
interests table
headings

these can be reversed, although not recommended for the appearance.
^{i'm still learning (clearly) and i'll try my best to help y'all out.}

♥ if you like it/use it, please leave a comment and add me if you'd like!♥

Preview:

click on the image for a larger preview

Code:

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

<style>
    :root {
        --logo-blue: black!important;
        --darker-blue: #ffffff;
        --lighter-blue: #ffcdd2;
        --even-lighter-blue: transparent!important;
        --lightest-blue: transparent!important;
        --dark-orange: black!important;
        --light-orange: #dfd1f4;
        --even-lighter-orange: #FFFFFF;
        --green: #000000;
       
        
    } 
  
    

        
     nav .links {
        background: black!important;
        font-size: 9px;

    }
    
  
  .mood {
      display: none!important;
  }
    
    .mood p{
        background: white;
        
    }
    
    .profile {
        direction: rtl;
    }
    
    .profile p{
        font-size: 11px;
    }
    
    .profile a{
        color: white!important;
        border: ;
    }
    
    .profile a:visited{
        color: white!important;
    }
    
     nav .links a{color: white!important;}
     
     nav .links a:visited{ 
         color: white!important;}
     

    .section
        p {color: white!important;}
        
    .blurbs{
        margin-top: -90px!important;
        text-align: center;
        color: white;
        direction: ltr;
    }
    .blurbs h4{
        display: none;
    }
    
    .search-wrapper input[type=text] {
        font-family: times;
        background-color: white!important;
        border: 1px solid!important;
        border-radius: 0px !important;
        font-size: 9px;
        
    }
    
    button{
        border-radius: 0px !important;
        border: 1px solid!important;
        text-transform: lowercase;
        font-family: times;
        font-size: 9px!important;
        background-color: black!important;
        width:;
        color: white!important}
       
    
    body {
        background: white;
        background-image: url("https://wallpapercave.com/wp/wp5444133.jpg");
        background-attachment: fixed;
        background-repeat: no-repeat;
        background-position: right bottom, left bottom;
        text-transform: lowercase;
        font-family: times;
        font-size:13px!important;
        
    }

.blog-preview {
        display: none;
       
    }
    
    .blog-preview p {
        display: none;
        text-transform: lowercase;
        font-size: 12px;
        margin-top: -10px;
    }
    

 .profile .left {
     direction: ltr;
 }
    
        
    }
    .blog-preview p a{
        color: white!important;
    }
    .blog-preview p a:hover
    .blog-preview p a:active,
    .blog-preview p a:focus{
        color: white!important;
    }
    
 
    nav {
        border: solid white 1px;
        border-bottom: none;
        color: white!important;
        text-align: center;
        overflow: hidden;
    }
   
    
    .contact {
        text-align: center;
        padding: 4px;
        font-size: 11px;
        font-family: times;
        border: dotted 0px!important;
        background-image: url("")!important;
        background: ;
        border-top: 0px;
        direction: ltr;
        
    }
    
    
    
    .contact a:visited{
        color: white!important;
        
    }
    .contact .inner a img {
        font-size: 0;
    }
    .contact .inner a img:before {
        font-size: 1em;
        display: block
    }
  
    .profile-info{
        display: none!important;
    }    
    
    .profile .url-info {
        display:none;
    }
    .profile .table-section {
        display: none;
    
    }
    
    .profile .table-section p{
        color: white;
    }

.table-section:nth-last-child(2) .details-table tr:nth-child(1) td:first-child p { font-size:0; }
.table-section:nth-last-child(2) .details-table tr:nth-child(1) td:first-child p:before { content:"likes"; font-size:11px; color: white; font-weight: 1;}
    .table-section:nth-last-child(2) .details-table tr:nth-child(2) td:first-child p { font-size:0; }
.table-section:nth-last-child(2) .details-table tr:nth-child(2) td:first-child p:before { content:"listens"; font-size:11px; color: white; font-weight: 1;}
    .table-section:nth-last-child(2) .details-table tr:nth-child(3) td:first-child p { font-size:0; color: black}
.table-section:nth-last-child(2) .details-table tr:nth-child(3) td:first-child p:before { content:"films"; font-size:11px; color: white; font-weight: 1;}
    .table-section:nth-last-child(2) .details-table tr:nth-child(4) td:first-child p { font-size:0; color: black}
.table-section:nth-last-child(2) .details-table tr:nth-child(4) td:first-child p:before { content:"shows"; font-size:11px; color: white; font-weight: 1;}
   .table-section:nth-last-child(2) .details-table tr:nth-child(5) td:first-child p { font-size:0; color: black}
.table-section:nth-last-child(2) .details-table tr:nth-child(5) td:first-child p:before { content:"books"; font-size:11px; color: white; font-weight: 1;}
.table-section:nth-last-child(2) .details-table tr:nth-child(6){display:none;}

    }
    .home-actions {
        border: none;
    }

    
    table.details-table {
        border: dotted px;
        border-collapse: collapse;
        border-top: 0px;
        background: trasnparent!important;
        opacity: ;
        
        
        
    }
    table.details-table td {
        background: url("");
        border-bottom: dotted px;
        border-right: dotted px
    }
    .profile-pic {
        margin-top: 0px!important;
        margin-left: 40px!important;
        max-height: 100%;
        max-width: 100%;
   

        

    }
        
        
    .profile .details {
        display: none!important;
    }
    
    
    
    .heading {
        display: none;
    
    }
    h1 {
    font-style: italic;
    text-transform: uppercase;
    text-align: center!important;
    margin-top: -285px!important;
    width: 205px;
    max-width: 100%;
    color: white!important;
    font-size: 20px!important;
    }
    
  main:before {
      margin-left: 80px;
        background-image: url('https://i.ibb.co/2v6YGmn/ezgif-com-crop.gif');
        background-size: 230px;
        background-repeat: no-repeat;
        color: transparent!important;
        display: block;
        content: "";
        height: 280px;
        max-width: 100%;
        max-height: 100%;
    
}
    
    main {
        border: white solid 1px;
        border-top: none;
        background-repeat: no-repeat!important;
        background-position: ;
        background-size: ;
        background-color: #09040a!important;
    }
    
    .container {
        border-radius: 0px 0px 0 0;
        overflow: hidden;
        padding: 100px;
        margin-top: 0px;
    }

    .blurbs .heading {
        display: none;
        
    }
    footer {
        border: 0px;
        border-top: 0px;
        background: transparent!important;
        display: block !important;
        line-height: 0px;
        height: 83px;
        margin-top: -1px!important;
        
        
    }
    footer a{
        color: white!important;
    }
    
    footer p{
        color: white!important;
    }
    
    
    table.comments-table td {
        display: none;
        background-color: black!important;
        border: dotted 1px;
        width: 10px!important;
        font-size: 11px;
        
        
    }
    .comments-table td:first-child img {
        width: 60px!important;
        border-radius: 50px;
        
    }
    .profile .friends .person img {
        width: 60px;
        border-radius: 50px;
        
        
    }
    .profile .right
    }
    
    .blog-preview {
        text-align: center;
        border-top: solid 1px;
        border-bottom: solid 1px;
    }
    
   

    a.addme {
        font-size: 4rem;
        font-weight: bold;
        margin-bottom: 15px;
        display: block;
    }
 

    a:link {
        text-transform: uppercase;
        font-style: italic;
    }
    
    a:hover {
        text-transform: uppercase;
        text-decoration-style: none!important;
        color: none;
        background: none;
        border: none;
    }
    
  
    

.friends {
    display: none;



    .table-section:last-child {
         display: none !important;}
 



</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 11 of 11 comments ( View all | Add Comment )

MASHIIXKUN	1735938423 using <3 Report Comment
MirandaKatlyn	1724057746 hiiii using this! Report Comment
ioa	1713686563 hi, using! Report Comment
cilica	1710444541 i have a question how do you completely change section's look? Report Comment
Lissa	1672615071 Cool vibes, thanks. I'm going to try it out! :) Report Comment
bunny	1670798569 I just dont want to hide my links, figured it out but it also shows the interest box :< and the links box is not that small. Im obsessed with it tho Report Comment
𝕵𝖊𝖘𝖘𝖌0𝖗3	1654056971 Love it, thanks! :) Report Comment
NøTranquility	1649482989 cool Report Comment
chickenrex68	1636909518 looks great and easy to customize! many thanks Report Comment
Lux⚡	1633161057 tysm, changed out the background and the gif header and i love the finished look Report Comment
Tiffany	1616298665 Absolutely adore this layout. I tweaked it a little to create the one I'm using now, so thank you so much Report Comment oh my god i absolutely love what you did with it!!!! it looks so good!!! by sun; 1616355091; Report Thank you so much(: by Tiffany; 1616356773; Report