Report Blog Entry
Hey, I am only new to coding so most of this code has been copied from ♡ emo doll ♡'s post from their profile layout, I coded it so it had the exact same style. The code for it and other links for stamps and buttons I use for my blog posts are also below.
━━━━━━━━⊱⋆⊰━━━━━━━━
Pixels - Stamps - Buttons
━━━━━━━━⊱⋆⊰━━━━━━━━
Here's the code :)
<style>
/*page background */
body {
background:url('https://pbs.twimg.com/media/FA8CyU_XMAMQqZ4?format=jpg&name=240x240');
}
</style>
<style> @import url('https://fonts.googleapis.com/css2?family=Playwrite+IN:wght@100..400&display=swap'); </style>
<style>
@import url(https://fonts.googleapis.com/css2?family=Playwrite+IN:wght@100..400&display=swap");
body{font-family: "Playwrite IN" ;}
</style>
<style>
/* cursors (source: http://www.rw-designer.com/cursor-set/littlebunny2-mimidestino) */
a:hover{
cursor: url('https://64.media.tumblr.com/798fb85e8334ad49beadcec5e2422e1d/e607e0ffc52ca267-19/s75x75_c1/637b1c8f639ed9cb92f23b481633f804843cfa8c.gifv'), auto; /*link select*/
}
* {
cursor: url('http://www.rw-designer.com/cursor-extern.php?id=94536'), auto; /*normal select*/
}
</style>
<style>
/* This is the loading image when someone clicks on your profile.
You can search for 'transparent loading screen gif' on google or giphy.com and select one that fits your style.
The background-size code will change the size of it. Remember to test it out on your phone/tablet
and change the background-size in the mobile code.*/
body:before {
content: " ";
height: 100vh;
width: 100vw;
display: block;
position: fixed;
top: 0;
left: 0;
z-index: 100;
background-image: url('https://64.media.tumblr.com/tumblr_m54k7efWWw1qid2nw.gif');
background-size: 10%;
background-repeat: no-repeat;
background-position:center;
background-color: #FEF1F0;
animation: yourAnimation 2s ease 0s 1 normal forwards;
pointer-events: none;
}
@keyframes yourAnimation { 0.0%{ opacity: 1;} 75%{ opacity: 1; } 100%{ opacity: 0;} }
</style>
<style>
a:hover{text-decoration: underline;}
h2, h3, h4, h5{color: black !important;} /* headings*/
a{color: black !important; } /* color of links */
p, b, .count {color: black !important;} /* color of text */
.profile .friends .person p{color: #e2a99c !important;} /* color of names and friends counter */
nav label{color: black !important;} /* color of search */
.section h4 {color: #c2c9a7 !important;} /* aboutme & want2meet headings */
.blurbs .heading {display:none;} /* hides the blurbs title. if you want it to show, replace with the code: color: var(--headers) !important; */
nav .top{
background-color: transparent !important;
border: none;
margin: 30px 0;
color: black;
}
.logout-btn, .logout-form {
font-family: hearts;
text-decoration: underline;
background-color: none !important;
border: none !important;
color: black !important;
display: inline-block;
font-size: 1.1em !important;
}
nav .links{
background-color: transparent !important;
border: 10px solid black;
border-image: url("https://foollovers.com/mat/baf/frill/fr32-015-a.gif") 9 fill round;
font-family: hearts;
text-align: center;
margin-bottom: 10px !important;
}
nav .top a, nav .links a{
background: transparent !important;
color: black;
text-shadow: none !important;
text-decoration: none !important;
font-size: 1.5em;
}
/* this is the line that appears between links in the nav bar and footer.
you can add an emoji or symbol instead of the default line it has */
nav .links li:not(:last-child)::after,
footer .links li:not(:last-child)::after{
content: " ♡ " !important;
color: black;
}
/* this is the spacehey logo color. to change the color refer to https://codepen.io/sosuke/pen/Pjoqqp and replace the filter property values */
nav img.logo{
filter: invert(61%) sepia(7%) saturate(2917%) hue-rotate(315deg) brightness(111%) contrast(90%);
width: 165px !important;
height: 42px;
}
/* this is the white lacey container where your profile is */
main{
background-color: white;
background-image: url('https://colorate.azurewebsites.net/SwatchColor/FFFFFF');
background-size: 100%100%;
background-repeat: no-repeat;
border: 9px solid;
border-image: url("https://64.media.tumblr.com/6f0c2efb2b0902a5907c60c9d1dcad9e/9b9e0ed89a039867-11/s75x75_c1/90da82e9674eafbcc1f84f71303f353726a700b5.pnj") 8 fill round;
overflow-y: scroll;
margin: auto;
background-color: white;
}
/* this is your name/username. this text has a floating effect */
h1{
text-shadow: -1px 0 #7e6446, 0 1px #7e6446, 1px 0 #7e6446, 0 -1px #7e6446, 0 0;
color: white;
font-family: "hearts";
font-style: italic;
font-size:30px!important;
font-weight: bold;
text-align: center;
text-transform: lowercase;
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); }
}
<style>
table.comments-table {
border-style: outset;
border-color: #fffff5;
border-width: 3px;
}
</style>
<style>
:root {--lighter-blue: #DADFCA;
--even-lighter-blue: #DADFCA;
--lightest-blue: #ffffff;
}
p {
font-family: hearts;
color: black;
}
.count {
color: black;
}
.article .edit-info .author-details h4, a, label, .blog-entry .comments .heading h4, .logout-btn {
font-family: hearts;
color: white;
}
button {
font-family: hearts;
}
.blog-entry .kudos-btn {
font-family: hearts;
text-shadow: 0px 0px 4px white;
}
main .left, main .right {
color: white;
}
.blog-entry .content {
padding: 10px;
font-family: hearts;
}
p.links a:first-child .icon{
content: url(“https://64.media.tumblr.com/88694b5a758177b52d13115cf79dab24/a5298507ea808b46-1a/s75x75_c1/de1715a7aa85f649f8a2a5e5047fbd76a511e01a.gifv”);
width: 25px;
height: auto;
}
p.links a:nth-child(2) .icon {
content: url(“https://64.media.tumblr.com/0028010ab259ecf1758c02cd8c14340e/a5298507ea808b46-bf/s75x75_c1/738768a18f22a119f16299885034ab3488bb9331.gifv”);
width: 25px;
height: auto;
}
p.links a:last-child .icon, table.comments-table td .icon {
content: url(“https://64.media.tumblr.com/0d833bcf894926ce772863319327de68/af968488e6254a95-49/s75x75_c1/ea0b38e8862ec03e696653da00cdd2aee6c495fc.gifv”);
width: 25px;
height: auto;
}
footer {
background-color: transparent;
color: #ffffff;
}
nav .links {
background-color: rgba(0, 0, 0, 0.3);
font-family: hearts;
color: #ffffff;
font-size: max(11px) !important;
}
nav .links a {
text-shadow: 0 0 5px #000000 !important;
font-size: max(11px) !important;
}
.comments-table{
display: block;
height: auto;
overflow-y: scroll;
Border-radius: 15px;
text-shadow: 0px 0px 4px #000000, 0 0 25px #000000, 0 0 3px #000000;
box-shadow: 0px 0px 15px #ffffff;
}
.comments-table td{
padding: 10px;
}
.comments-table .pinned{
color: white;
text-shadow: 0px 0px 4px black;
font-family: ' hearts ';
}
img {
border-radius: 12px;
box-shadow: 0px 0px 12px white;
}
nav .top .left img {
border: none !important;
box-shadow: none !important;
}
.icon {
border: none !important;
box-shadow: none !important;
}
.blog-entry .profile-pic img {
box-shadow: none !important;
}
</style>
<style>
/* fonts */
@font-face { font-family: "hearts"; src: url('https://dl.dropbox.com/s/1479f8x52y3z5u4/rainyhearts.ttf'); }
</style>
Comments
Displaying 1 of 1 comments ( View all | Add Comment )
Domy_yo
Hello, sorry for the inconvenience, but I don't know ANYTHING about codes and I wanted to use yours (because is really cute), but there are some images with problems in the code and I don't know how to fix it, could you help me?