Christimas layout!!

Tags: christimas, red, santa, white

Description:

I made this layout using the christimas events codes... so... yeah, this is just a layout mashup. I don't know why the contacts area isn't showing, but if you hover over it with the mouse you'll see the text.

Preview:

click on the image for a larger preview

Code:

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

<style>

/* contact icons */
.contact .inner a img {
font-size: 0;
}
.contact .inner a img:before {
font-size: 1em;
display: block
}
.contact .inner .f-row:nth-child(1) .f-col:nth-child(1) a:before {
/* add to friends */
content: "✧"
}
.contact .inner .f-row:nth-child(1) .f-col:nth-child(2) a:before {
/* add to favorite */
content: "✧"
}
.contact .inner .f-row:nth-child(2) .f-col:nth-child(1) a:before {
/* send a message */
content: "✧"
}
.contact .inner .f-row:nth-child(2) .f-col:nth-child(2) a:before {
/* foward to friend*/
content: "✧"
}
.contact .inner .f-row:nth-child(3) .f-col:nth-child(1) a:before {
/* instant message */
content: "✧"
}
.contact .inner .f-row:nth-child(3) .f-col:nth-child(2) a:before {
/* block user */
content: "✧"
}
.contact .inner .f-row:nth-child(4) .f-col:nth-child(1) a:before {
/* add 2 group  */
content: "✧"
}
.contact .inner .f-row:nth-child(4) .f-col:nth-child(2) a:before {
/* report */
content: "✧"
}   





@keyframes spin{
  from{ transform:rotate(0deg); }
  to{ transform:rotate(-360deg); }
}
.general-about .profile-pic img{
  border-radius: 50%;
  animation: spin 7s infinite linear;
}


body{
 background-color: #f2f2ff;
opacity: 0.8;
background-image: linear-gradient(0deg, #f2f2ff 50%, #ff4444 50%);
background-size: 10px 10px;
}



.general-about .profile-pic img{
  clip-path: polygon(50% 0%, 67% 29%, 98% 35%, 75% 58%, 79% 91%, 50% 75%, 21% 91%, 25% 58%, 2% 35%, 30% 25%);
}



*{
  border-radius: 19px;
}
.profile .contact .heading, .profile .table-section .heading, .home-actions .heading{
  border-radius: 6px 6px 9px 9px;
}

.general-about .profile-pic img,
.comments-table,
.profile-info{
  border: 10px dashed #ee1b22;
}
.profile .blurbs .heading, .profile .friends .heading,
.profile .contact .heading, .profile .table-section .heading, .home-actions .heading{
  background: #ee1b22;
  color: white;
}
.profile .blurbs .heading, .profile .friends .heading a,
.profile .contact .heading, .profile .table-section .heading, .home-actions .heading a{
  color: white;
}
.profile .contact, .profile .url-info, .profile .table-section, .home-actions{
  border: 2px solid #ee1b22;
}

h1{
  background: url('https://s3-us-west-2.amazonaws.com/s.cdpn.io/191814/blue_glitter.gif') repeat;
  color: transparent;
  background-clip: text;
  font-size: 20em;
}


  :root {
        --logo-blue: #E61D1D;
        --darker-blue: #ffffff;
        --lighter-blue: #FD6767;
        --even-lighter-blue: #;
        --lightest-blue: #e32020;
        --dark-orange: #e32020;
        --light-orange: #e32020;
        --even-lighter-orange: #e32020;
        --green: #e32020;
    }



</style>



<blink>insert your info here</blink>

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