This CSS is for my old blog and not the current look!
I often get people who love the look of my blog.
So I figured I would share my css so you can hopefully edit and make your own version of it!
No worries if you don't and want to copy it exactly.... It will encourage me to update mine!
I have shared it before but then deleted it as it was too longer of a post...
So I figured make it into a button to show/hide my css!
To edit your css go to Edit blog and paste in the css!
I use a secondary blog to host images (the urls in my css)
html colors all start with # followed by 6 or 3 digits - these can be found by googling html color codes.
If you need any help message me and I will see what I can do!
It is nice to see blogs without the standard css!
/* Pink to blue gradient */
.comments, .pub-blog-title, .pub-blog-desc, .selections{
background: linear-gradient(
to right,
hsl(350, 100%, 88%),
hsl(204 100% 59%)
);
border: 5px solid #FFFFFF;
}
/* Hide top menu */
.showmenutop{
display: none !important;
}
/* Move dancing girl to bottom right */
.dropdown{
position: fixed;
bottom: 0;
right: 0;
width: 476px;
height: 524px;
}
/* Dispaly dancing girl on hover */
.dropdown:hover{
background-image: url(https://ocdn012.bdsmlr.com/uploads/photos/2022/01/10483208/bdsmlr-10483208-qxLKsGpnzR.gif);
}
/* Hide dancing girl on smaller screens */
@media screen and (max-width: 1201px) {
.dropdown{
display: none !important;
}
}
/* Change top bar to black and adjust size */
.topholder{
/*
bottom: 0 !important;
right: 0 !important;
top: auto !important;
*/
background-color: rgba(0, 0, 0, 0.9) !important;
width: 100%;
}
/* Make avatar Bigger */
.blog_image {
height: 200px !important;
width: 200px !important;
}
/* Make avatar smaller size on smaller screens */
@media screen and (max-width: 1201px) {
.blog_image{
height: 100px !important;
width: 100px !important;
}
}
/* Change Description font size */
#desci h3{
line-height: 60px;
font-size: 33px;
font-weight: 600;
}
/* Make corners rounder on title/comments/sidepost */
.pub-blog-title, .comments, .sidepostimage{
border-radius: 15px;
}
/* Make corners rounder on image container */
.image_container{
border-radius: 25px;
}
/* Pad out blog header to allow for bigger avatar */
.pub-blog-header{
padding: 10px !important;
}
/* Make corners rounder on description and selections */
.pub-blog-desc, .selections{
border-radius: 5px;
}
/* Set blog background to 2 cocks either side when not hovering on blog */
body{
background-image: url(https://ocdn012.bdsmlr.com/uploads/photos/2022/11/10483208/bdsmlr-10483208-CA2W0cAO9l.png);
/* Not sure if 3 lines below work or not to fix smaller screens the cocks going off side of screen */
background-repeat: no-repeat;
background-size: 100%;
width: 100% !important;
}
/* Set blog background to 2 girls either side */
body:hover{
background-image: url(https://bdsmlr.com/uploads/blogs/2022/11/9594479/blogbackground/9594479-wRIMgqpFLc1.png);
}
/* Make various objects pink */
.tag, .viewnotes, .date, .fas, .fal, .fa-cog{
color: pink !important;
}
/* Make avatar roll on bigger screens */
@media screen and (min-width: 1201px) {
@-webkit-keyframes rotating {
from{
-webkit-transform: rotate(0deg);
}
to{
-webkit-transform: rotate(360deg);
}
}
}
/* Avatar roll movement keyframes*/
@keyframes moveLogo{
0% {
transform: rotate(0deg);
left: -200px;
}
25% {
transform: rotate(90deg);
left: 0px;
}
50% {
transform: rotate(180deg);
left: 200px;
}
55% {
transform: rotate(180deg);
left: 200px;
}
70% {
transform: rotate(180deg);
left: 200px;
}
90% {
transform: rotate(-360deg);
left: -200px;
}
100% {
transform: rotate(-360deg);
left: -200px;
}
}
/* Apply above keyframes to image */
.blog_image{
animation-name: moveLogo;
animation-duration: 4s;
animation-iteration-count: infinite;
}
/* Change every other tag colour to blue */
.tag:nth-of-type(odd) {
color: #66d1ff !important;
}
/* Make heart symbol pump keyframes*/
@keyframes animateHeart {
0% {
transform: scale(1.0);
}
5% {
transform: scale(1.3);
}
10% {
transform: scale(1.0);
}
15% {
transform: scale(1.4);
}
50% {
transform: scale(1.0);
}
100% {
transform: scale(1.0);
}
}
/* Apply above keyframes to heart*/
.fa-heart{
animation: animateHeart 1.2s infinite;
}
/* Change colour of heart to red when someone likes the post*/
.likesheart{
color: red !important;
}
/* Remove original home button icon */
.fa-home::before{
all:unset !important;
}
/* Change home symbol to an image*/
.fa-home{
background-image: url(https://ocdn012.bdsmlr.com/uploads/photos/2021/10/10483208/bdsmlr-10483208-ndFBuR9qAo.png);
width: 366px;
height: 32px;
}
/* Change home symbol to an image (bbc - go on touch it) when hovered over*/
.fa-home:hover{
background-image: url(https://ocdn012.bdsmlr.com/uploads/photos/2022/01/10483208/bdsmlr-10483208-OWuo1b5ygi.png);
width: 366px;
height: 121px;
background-repeat: no-repeat;
background-size: 366px 121px;
}
/* Prevent people reporting/blocking/unfollowing etc - Shhhh! */
.fa-bars, .report, .unfollowpublic, .block {
display: none;
}
/* Scroll Bar */
::-webkit-scrollbar {
width: 18px;
}
/* Track */
::-webkit-scrollbar-track {
-webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.3);
-webkit-border-radius: 6px;
border-radius: 6px;
}
/* Handle */
::-webkit-scrollbar-thumb {
-webkit-border-radius: 6px;
border-radius: 6px;
background: #66d1ff;
-webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.5);
}
::-webkit-scrollbar-thumb:window-inactive {
background: #000;
}
Reblogged
Sent!
This blog contains adult content. In order to view it freely, please log in or register
and confirm you are 18 years or older