requested shopkins layout

Tags: shopkins, pink, cartoon, food

Description:

someone requested i do a shopkins layout and i had nothing better to do so i did it!! i was able to finish this really fast compared to my other layouts, i think i'm getting more efficient at coding!! if anything is off/malfunctions tell me and i will edit it!! i would love it if you left a comment if you're going to use this layout, but no obligation to do so ^^ if you have any requests for a layout (or just a general theme), lmk and i will prob make it :D

Preview:

click on the image for a larger preview

Code:

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

<br/>
<!-- (c) Layout created by Jay (https://layouts.spacehey.com/ratl0rd) -->
<a href="https://layouts.spacehey.com/ratl0rd">
         <img alt="credit" src="https://i.imgur.com/tz98QFT.gif" width="150&quot;" height="20"/></a>

<style>
nav .top div {
color: rgba(255, 86, 179, 1) !important;
}
div.right{
color: rgba(255, 86, 179, 1) !important;
}
label {
color: rgba(255, 86, 179, 1) !important;
}
nav .top .right {
margin-top: 70px !important;
margin-right: 90px !important;
text-align: center !important;

}
.links{
    background-color: rgba(255, 86, 179, 0.5) !important;
    border-radius: 180px !important;
}
.top{
background-image: url('https://i.imgur.com/iToWHlN.jpg') !important;
background-attachment: scroll !important;
background-repeat: no-repeat !important;
background-position: center !important;
background-size: cover !important;
border-radius: 12px 12px 12px 12px;
padding: 0px 0px 200px !important;
margin: 15px 0px 15px !important;

}
nav .top .center form {
margin-top: 30px !important;
margin-right: -30px !important;
text-align: right !important;
width: 120% !important;
color: rgba(255, 86, 179, 1) !important;
}
footer{
background-image: url('https://i.imgur.com/PSQkc4t.png') !important;
background-attachment: scroll !important;
background-repeat: no-repeat !important;
background-position: bottom center !important;
background-size: cover !important;
border-radius: 12px 12px 12px 12px;
}
    body{
    background-image: url('https://i.imgur.com/SijH23k.png') !important;
    background-attachment: scroll !important;
    background-repeat: repeat !important;
    background-position: center !important; 
    background-size: 200px !important;
    background-opacity: 80%;
    }
main{
background-color: transparent !important;
}
.general-about .profile-pic img{

-webkit-mask-image: url(https://i.imgur.com/bAxhHPN.png);

-webkit-mask-size: 100%;

-webkit-mask-repeat: no-repeat;

-webkit-mask-position: center;

position:relative;

transform:scale(1.025,1.025);

top:-0.25em;

}
</style>
<style>
    .contact .heading, .friends .heading, .blurbs .heading, .blog-preview h4, .table-section .heading{
        
    background-color: rgba(255, 86, 179, 1) !important;
    border-radius: 180px !important;

    }
.logo {

content:url("https://i.imgur.com/TO3s405.png"); 
height: 68px !important; 
width: 150px !important;
transform: scale(1.3) translateX(25px) translateY(10px);

}
</style>
<style>
.contact, .url-info, .table-section{
border: none !important;
}
</style>
<style>
@font-face {
font-family: 'Magica';
src: url(https://static.tumblr.com/p6yopnt/Qkiqnu0r5/theheart.ttf);
}
 
.magica {
font-family: magica;
font-size: 40px;
}
</style>
 
<div class="magica"> 
<style>
@import url('https://static.tumblr.com/p6yopnt/Qkiqnu0r5/theheart.ttf');
body{font-family: 'Magica';}
</style>
<style>
body{

font family: magica !important;
font-size: 21px !important;

}
</style>
<style>
a{

font-family: magica !important;
color: white;


}
a:hover{

font-family: magica !important;
color: white;

}
a:visited{

font-family: magica !important;
color: white;

}
a:hover, a:active, a, p, .section {
    font-family: var(--magica) !important;
    color: white !important;
}
h2, h3, h4, h5, DIV.mood > P:nth-child(1) > B, P:nth-child(2) > B {
    font-family: "magica";
    color: white !important;
    text-align: center !important;

}
:root { --mainfont: "magica" }
</style>
<style>

h1{

font-family: magica !important;
color: white;

}
nav .links li:not(:last-child)::after, footer .links li:not(:last-child)::after{
content: "☆" !important;
color: rgba(255, 86, 179, 1) !important;
}
.count{
color: rgba(255, 86, 179, 1) !important;
}
button.logout-btn{
    font-family: var(--magica) !important;
}
.profile .left h1:before {
    background-image: url(https://i.imgur.com/rSrUZTZ.png);
    background-repeat: no-repeat;
    background-position: center;
    display: block;
    background-size: 100px;
    height: 100px;
    width: 100px;
    content: " ";
    transform: scale(4) translateX(-3em) translateY(5em);
    position: fixed;
}
.table-section td, .contact, .blog-preview, .blurbs, .friends-grid, .comments-table td{
background-color: rgba(255, 86, 179, 0.5) !important;
border-radius: 8px !important;
}
.profile .friends .person img:not(.icon) {
    border-radius: 180px;
}
li.active .icon { 
    content:url('https://i.imgur.com/5eAjCMw.png');
}
</style>
</div>
<style>* {cursor: url(https://cur.cursors-4u.net/food/foo-3/foo258.ani), url(https://cur.cursors-4u.net/food/foo-3/foo258.png), auto !important;}</style><a href="https://www.cursors-4u.com/cursor/2011/11/15/happy-apple.html" target="_blank" title="Happy Apple"><img src="https://cur.cursors-4u.net/cursor.png" alt="Happy Apple" style="position:absolute; top: 0px; right: 0px;"/></a>

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

tabby

1682683156

if you have the time, could you pls maybe make an 80s vampire/horror vibe layout?? :0

Report Comment

oooo that's a super cool idea!!! i'll absolutely do that, that sounds fun :DD

by Jay; 1682724002; Report

just finished it!! lmk if it was anything like what you were thinking :> https://layouts.spacehey.com/ratl0rd

by Jay; 1682905378; Report