ƎNA LAYOUT!

Tags: ena, blue, 2000s, simple, layout, white

Description:

i finished it! i've never seen an ena layout here so.. here ya go. i'll try to create a madcom layout soon (it's probably just a tricky theme since i love him ever since i was a kid). includes an ena pfp! comment when using and please credit when using as base (don't upload an edited version of this please) visit here if ya wanna see a live preview of it

Preview:

click on the image for a larger preview

Code:

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

<style>
    body{
        background-image: url('https://cdn.discordapp.com/attachments/1064462871947378729/1080405908376539217/latest.png');
        background-size: 2000px;
        background-position: center;
        background-attachment: fixed;
    }
    .container{
        width: 900px;
        box-shadow: 0px 0px 10px black;
    animation-name: floating;
    animation-duration: 3s;
    animation-iteration-count: infinite;
    animation-timing-function: ease-in-out;
}
 
@keyframes floating {
    0% { transform: translate(0,  0px); }
    50%  { transform: translate(0, 15px); }
    100%   { transform: translate(0, -0px); }   
}
    
    main{
        background-color: #c8c4cc;
        overflow-y: scroll;
        height: 600px;
    }
    main .right{
        background-color: #088484;
        border-right: solid #e6e4e7 4px;
        border-bottom: solid #e6e4e7 4px;
        border-top: solid #6d6575 4px;
        border-left: solid #6d6575 4px;
    }
    nav .links{
        background-color: #c8c4cc;
        text-align: center;
    }
    nav .top .left .logo{
        display: none;
    }
    nav .top{
        height: 10px;
        background-color: #0804ac;
        border-top: ridge #c8c4cc 10px;
        border-left: ridge #c8c4cc 10px;
        border-right: ridge #c8c4cc 10px;
        border-bottom: solid #c8c4cc 5px;
    }
    nav .top .center form{
        margin-top: -12px;
        text-align: left;
    }
    nav .top .right{
        display: none;
    }
    [id='q']{
        border: inset #c8c4cc;
    }
    FORM > BUTTON{
        border: outset #c8c4cc;
        background-color: #c8c4cc;
    }
    FORM > BUTTON:hover{
        border: inset #c8c4cc;
    }
    .profile h1{
        font-size: 15px;
        background-color: #0804ac;
        height: 30px;
        border: inset #c8c4cc;
        color: white;
        text-align: center;
    }
    .general-about{
        background-color: white;
        height: 190px;
        border-right: solid #e6e4e7 4px;
        border-bottom: solid #e6e4e7 4px;
        border-top: solid #6d6575 4px;
        border-left: solid #6d6575 4px;
    }
    
    nav .links a{
        border: outset 3px #c8c4cc;
        margin: -7px;
        color: black;
        text-shadow: none;
    }
    nav .links a:hover{
        border: inset 3px #c8c4cc;
        text-shadow: none;
    }
    
    .profile .mood{
        margin-top: 20px;
        margin-bottom: 15px;
        background-color:#c8c4cc ;
        height: 70px;
        border-left: solid #e6e4e7 4px;
        border-top: solid #e6e4e7 4px;
        border-bottom: solid #6d6575 4px;
        border-right: solid #6d6575 4px;
        text-align: center;
        
    }
    .profile .mood p{
        margin: 10px;
    }
    
    .profile .contact .heading{
        background-color: #c8c4cc;
        border: ridge gray 1px;
        
    }
    .profile .contact{
        background-color: #c8c4cc;
       border-left: solid #e6e4e7 4px;
        border-top: solid #e6e4e7 4px;
        border-bottom: solid #6d6575 4px;
        border-right: solid #6d6575 4px;
    }
    
    .profile .url-info{
           background-color: #c8c4cc;
       border-left: solid #e6e4e7 4px;
        border-top: solid #e6e4e7 4px;
        border-bottom: solid #6d6575 4px;
        border-right: solid #6d6575 4px;
        text-align: center;
        margin-top: 25px;
    }
    
    .icon{
        display: none;
    }
    .profile .table-section .heading{
        background-color: #c8c4cc;
        border: solid #c8c4cc;
    }
    .profile .table-section{
        background-color: #c8c4cc;
       border-left: solid #e6e4e7 4px;
        border-top: solid #e6e4e7 4px;
        border-bottom: solid #6d6575 4px;
        border-right: solid #6d6575 4px;
    }
    .details-table td{
        border-right: solid #e6e4e7 2px;
        border-bottom: solid #e6e4e7 2px;
        border-top: solid #6d6575 2px;
        border-left: solid #6d6575 2px;
        background: linear-gradient(white, lightgray);
        
    }
    .table-section .inner .details-table tbody tr td {
        background: linear-gradient(white, lightgray);
    }
    .details-table td *{
        color: black;
    }
    
    .profile .blurbs .heading{
        background-color: #0804ac;
        color: white;
        border: solid 3px #c8c4cc;
        border-bottom: inset #c8c4cc 10px;
        outline-style: solid;
        outline-color: #c8c4cc;
    }
    
    .profile .blurbs .inner{
        background-color: white;
         border-right: solid #e6e4e7 4px;
        border-bottom: solid #e6e4e7 4px;
        border-top: solid #6d6575 4px;
        border-left: solid #6d6575 4px;
        outline-style: solid;
        outline-color: #c8c4cc;
        overflow-y: scroll;
        height: 140px;
    }
    .profile .blurbs .section h4{
        color: black;
    }
    
    .profile .friends .heading{
        background-color: #0804ac;
        color: white;
        border: solid 3px #c8c4cc;
        border-bottom: inset #c8c4cc 10px;
        outline-style: solid;
        outline-color: #c8c4cc;
        margin-top: 50px;
    }
    .profile .friends .inner{
        background-color: white;
         border-right: solid #e6e4e7 4px;
        border-bottom: solid #e6e4e7 4px;
        border-top: solid #6d6575 4px;
        border-left: solid #6d6575 4px;
        outline-style: solid;
        outline-color: #c8c4cc;
        overflow-y: scroll;
        height: 170px;
    }
    
    DIV.blog-preview{
        background-color: white;
                border-right: solid #c8c4cc 4px;
        border-bottom: solid #e6e4e7 4px;
        border-left: solid #c8c4cc 4px;
        outline-style: solid;
        outline-color: #c8c4cc;
    }
    DIV.blog-preview > H4{
        background-color: #0804ac;
        font-size: 15px;
        text-align: center;
        color: white;
        border: solid 5px #c8c4cc;
        border-bottom: solid #c8c4cc 10px;
    }
    
    main:before {
	width: 99%;
	height: 150px;
	display: block;
	content: "";
	background-image: url('https://i.pinimg.com/originals/f2/ad/74/f2ad74cb95ddce6a744005b483895eef.gif');
	background-position:  center -140px;
	background-size: cover;
	margin-left: 5px;
	margin-bottom: 10px;
	  border-right: solid #e6e4e7 4px;
        border-bottom: solid #e6e4e7 4px;
        border-top: solid #6d6575 4px;
        border-left: solid #6d6575 4px;
	
}
@media{
	main:before{
		height: 160px;
	}
}

.comments-table td{
    background-color: white;
}
  :root {
    --light-orange: ;
       --even-lighter-blue: white;}
       
       .comments-table td *{
           border: none;
           background-color: white;
       }
       .count{
           color: darkblue;
       }
       
       a{
           color: black;
       }
       a:hover{
           color: darkblue;
       }

</style>

<style>
.profile-pic > img { display:none; }
.profile-pic:after { background-image: url("https://cdn.discordapp.com/attachments/1064462871947378729/1080402455575142400/ena_ane.gif"); display: inline-block; content:"" }
.blog-entry .profile-pic:after, .bulletin .profile-pic:after { background-size: cover; width: 110px; height: 110px; } /* blogs, bulletins */
.general-about .profile-pic:after { background-size: cover; width: 160px; height: 160px; 
    margin-left: 10px;
    margin-top: 10px;
    margin-bottom: 10px;
    border-right: solid #e6e4e7 2px;
        border-bottom: solid #e6e4e7 2px;
        border-top: solid #6d6575 2px;
        border-left: solid #6d6575 2px;
} 

footer{
background-color: transparent;
}

             ::-webkit-scrollbar {
    width: 10px;
    height: 10px;
    }

    ::-webkit-scrollbar-thumb {
    background: lightgray;
    border: outset;
    }

    ::-webkit-scrollbar-track {
    background: #808c84;
    border: outset;
    }
</style>

<style>
.profile .left h1:before {
background-image: url(https://cdn.discordapp.com/attachments/1064462871947378729/1080436392884178974/latest.png);
background-size: contain;
background-repeat: no-repeat;
background-position: center;
display: block;
height: 200px;
width: 200px;
content: "";
transform: rotate(4deg) translateX(-230px) translateY(-140px);
position: absolute;
z-index: 0;
pointer-events: none;
}

main .right:before{
background-image: url(https://cdn.discordapp.com/attachments/1064462871947378729/1080434674595283044/latest.png);
background-size: contain;
background-repeat: no-repeat;
background-position: center;
display: block;
height: 200px;
width: 200px;
content: "";
transform: rotate(4deg) translateX(550px) translateY(40px);
position: absolute;
z-index: 0;
pointer-events: none;
}

.profile .mood:before{
background-image: url(https://cdn.discordapp.com/attachments/1064462871947378729/1080404030636965900/ezgif-4-e4275e8561.gif);
background-size: contain;
background-repeat: no-repeat;
background-position: center;
display: block;
height: 300px;
width: 300px;
content: "";
transform: rotate(-4deg) translateX(-200px) translateY(-70px);
position: absolute;
z-index: 0;
pointer-events: none;
}
nav .links:before{
background-image: url(https://media.discordapp.net/attachments/1064462871947378729/1080403401638158386/FastFoodEnaSticker.png?width=406&height=406);
background-size: contain;
background-repeat: no-repeat;
background-position: center;
display: block;
height: 300px;
width: 300px;
content: "";
transform: rotate(-6deg) translateX(800px) translateY(-10px);
position: absolute;
z-index: 0;
pointer-events: none;
}
.profile .url-info:before{
background-image: url(https://cdn.discordapp.com/attachments/1064462871947378729/1080440475401601065/latest.png);
background-size: contain;
background-repeat: no-repeat;
background-position: center;
display: block;
height: 130px;
width: 150px;
content: "";
transform: rotate(0deg) translateX(750px) translateY(-230px);
position: absolute;
z-index: 0;
pointer-events: none;
}

.profile h1:after{
background-image: url(https://images-ext-2.discordapp.net/external/3bo0d2TQ-uyFjAa7s3xdRWjvyOhosBusSFuDlTYFfvY/http/31.media.tumblr.com/7993bc91c0b17173c9b4ffdd215ff1ed/tumblr_mlb0htyzfo1qe1uqko1_400.gif?width=314&height=314);
background-size: contain;
background-repeat: no-repeat;
background-position: center;
display: block;
height: 130px;
width: 150px;
content: "";
transform: rotate(0deg) translateX(-150px) translateY(-90px);
position: absolute;
z-index: 0;
pointer-events: none;
}

body::after {
content: " ";
display: block;
position: fixed;
top: 0;
left: 0;
bottom: 0;
right: 0;
background-image: url('https://i.pinimg.com/originals/6e/72/02/6e7202edee4832060cba3ac19863e70b.gif');
opacity: 2%;
z-index: 2;
pointer-events: none;
}
</style>





<style>* {cursor: url(https://ani.cursors-4u.net/cursors/cur-11/cur1074.cur), auto !important;}</style><a href="https://www.cursors-4u.com/cursor/2012/06/13/multicursor.html" target="_blank" title="Multicursor"><img src="https://cur.cursors-4u.net/cursor.png" alt="Multicursor" style="position:absolute; top: 0px; right: 0px;"/></a>

<style>

.profile .profile-info {
	background-color: white;
	border: ridge lightgray 3px;
	text-align:left;
	color: white;
	height: 20px;
}

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

reddd	1721730179 USING !! Report Comment
Tripleye_4	1720733701 holaaa, lo estoy usando y pude arreglar el fondo. Para arreglarlo tienen que poner en la parte inicial del codigo esto: body{ background-image: url(https://static.wikia.nocookie.net/enajoelg/images/e/e3/OverworldTemptationStairway.png/revision/latest?cb=20210521174752); desp no tienen q cambiar ndd PD: El layout esta hermosoooo Report Comment
ENA	1717845813 Using!! Report Comment
AIRY IS MY HUSBAND!!!	1715859085 HI I USED THIS THE ONLY PROBLEM IS THAT THE PFP THING DOESNT WORK FOR SOME REASON!! D: Report Comment
SillyzzRibbonzz	1713915429 using!!! Report Comment
tilapia	1708944572 HHHHAAAAAAIIIIIII SO. This is currently broken, the background images won't work for now coz discord decided to fuck everybody who used it as an image hosting platform. I'll fix this soon !! Report Comment
"kiweeip...-"	1705770176 Usando:] Report Comment
bblood1y	1705629703 using Report Comment
꒰୨୧◞ 。NANO / SKYLAR⠀.ᐟ	1703863522 using ^_^ Report Comment
Taco	1703449744 Using also is there a way to see all the information withouth scrolling in those windows? hope yall understand the question Report Comment
ƎNA	1701381801 using!!! Report Comment
⛧♱⋆ LOVESIXK ⋆♱⛧	1696621262 Using!!! Report Comment
꒰♡ Akko ˎˊ-	1690997395 starting my spacehey profile over, using!! Report Comment
Prixz0	1689815428 so sick and so good Report Comment
Vinny	1688927867 USING!!!!!!!!!!!!! <3 Report Comment
CrissCrossCannibal	1688360362 using!! Report Comment
DomTheBomb.Com	1688146784 using Report Comment
★ kangel ! ☆	1687314651 joyous day,,.,using Report Comment
DEC0⭑	1686950831 Usin! Report Comment