[Refresh]
[Bottom] [Index] [Archive]
Sort by:
Image size:
R:7 / I:2
we work
R:51 / I:37
temp css testing
I'm going to use this thread for testing temporary board theme things instead of relying on a post that gets buried and forgotten about inside the sticky
<----style>
@keyframes kf {
0% { background-position: 0% 0%;}
100% { background-position: 2000% 0%;}
}
#lowercontents, .page-details, .main-sections.thread-window {
background-image: url(https://haiji.kissu.moe/test/src/1705911877267.png);
background-repeat: repeat;
animation-timing-function:linear;
background-attachment:fixed;
background-size: cover;
animation-name: kf;
animation-duration: 50000s;
animation-iteration-count: infinite;
}
<----/style>
@keyframes bday {
0% { background-position: 0% 0%;}
100% { background-position: 50000% 0%;}
}
#lowercontents, .page-details, .main-sections.thread-window {
background-image: url(https://haiji.kissu.moe/test/src/1701400052587.png);
background-repeat: repeat;
animation-timing-function:linear;
background-attachment:fixed;
background-size: cover;
animation-name: bday;
animation-duration: 50000s;
animation-iteration-count: infinite;
}
:root{
--mascot-override: url(/test/src/1701399055382.png);
--mascot-width: 300px;
--mascot-height: auto;
}
@keyframes mascot {
0% {
transform: scale(0.7);
rotate: 0deg;
filter: hue-rotate(0deg);
}
50% {
transform: scale(2);
rotate: 40000deg;
filter: hue-rotate(36000deg);
}
transform: scale(0.7);
rotate: 0deg;
filter: hue-rotate(0deg);
}
.mascot-img {
content: var(--mascot-override) !important; /* !important should be used here because we want to remove other people's mascots for our own temporary ones */
animation-timing-function:linear;
animation-name: mascot;
animation-duration: 10000s;
animation-iteration-count: infinite;
width: var(--mascot-width) !important;
height: var(--mascot-height) !important; /* maybe there's a way to remove these two lines...*/
z-index: -0;
border: 0px solid #0000;
background-repeat: repeat;
}
@supports not selector(:read-only) { /* Browsers at palemoon's version need this */
.mascot-img {
background-image: var(--mascot-override);
}
div.post.reply, .reply > .post-contents {
background-image: url(https://haiji.kissu.moe/secret/src/1696337408892.gif);
background-position: top right !important;
background-repeat: no-repeat !important;
padding-bottom: 5px;
padding-right: 115px;
min-height: 110px;
position:relative
}
#lowercontents, .main-contents {
background-image: url(https://haiji.kissu.moe/secret/src/1696337366737.gif);
background-position: right;
background-repeat: no-repeat;
background-attachment: fixed;
cursor: url(/secret/src/1696338171951.png), auto !important;
}
CAN YOU FEEL THE SUNSHINE?
<##style>
@keyframes zunda {
0% { background-position: 9000% 0%; }
100% { background-position: 0% 50000%;}
}
body {
background-image:url(/test/src/1696895217336.jpg);
background-attachment:fixed;
background-position:center;
background-repeat: no-repeat;
background-size: cover;
}
#uppercontents {
z-index: 90;
}
#lowercontents::before, .main-contents::before {
background-image: url(https://haiji.kissu.moe/secret/src/1696337366737.gif);
background-position: right;
background-repeat: repeat;
background-size: 5%;
background-attachment: fixed;
animation-name: zunda;
animation-duration: 20s;
animation-iteration-count: infinite;
position: fixed;
z-index: -2;
content: " ";
width: 50vw;
height: 50vh;
top: 0;
left:0;
opacity: 0.7;
}
#lowercontents {
z-index: 1;
position: relative;
}
R:1 / I:0
Testing
R:7 / I:1
R:2 / I:2
[Refresh]
[Top] [Index][Archive]