playground:style_style_toilet_door [Post-Platform Digital Publishing Toolkit]

This page is read only. You can view the source, but not change it. Ask your administrator if you think this is wrong.
<HTML>
<script>
    function fetch_request(url, callback){
        // fetching the pad
        fetch(`${url}`, {
            'method': 'GET',
            'mode': 'cors',
        })
        .then(response => response.text() )
        .then(css => inject_css(css) );
    }
    function inject_css(css){
        console.log('pad loaded!');
        let el = document.createElement('style');
        el.id = "etherstyle";
        el.innerText = css;
        document.head.appendChild(el);
    };
    fetch_request("/doku.php?id=stylesheet:style_style_style_toilet_door&&do=export_text", inject_css);
</script>

</HTML>



body {
    background: sienna;
    border: 1em inset brown;
}
article#content{
    overflow: hidden;
    background: burlywood;
    padding: 2em;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-around;
    gap: 0em;
    border: 1em inset sienna;
}
p {
   margin: -1em;
    display: inline-block;
    max-width: 16rem;
    color: black;
    font-size: 25px;
    text-align: center;
}

#navbar .right-column, .site-header, div#sidebar , .page-info{
display: none;
}
.site-name {
    color: transparent !important;
    background: linear-gradient(45deg, #9b9a9a, #ffffff, #898888);
    position: fixed;
    top: 27vh;
    bottom: 0;
    left: 20px;
    width: 30px;
    height: 320px;
        z-index: 1;
}
.site-name:after {
content:"occupied";
color: red;
    transform: rotate(90deg);
    position: absolute;
    left: -14px;

}
.left-column {
padding: 0;
}

p:nth-child(4n) {
    color: #00ed3c;
    font-size: 40px;
    -webkit-text-stroke: #00ed3c 0.18em;
    paint-order:  stroke;
    line-height: 1.35;
    font-family: cursive;
    transform: rotate(-2deg);
}
p:nth-child(8n) {
    color: deeppink;
    -webkit-text-stroke: deeppink 0.18em;
    font-size: 32px;
    transform: rotate(-12deg);
}
p:nth-child(4n+1) {
    background: linear-gradient(yellow, darkorange); 
    font-family: sans-serif;
    text-transform: uppercase;
    font-weight: bold;
    padding: 1em;
    border-radius: 40%;
    box-shadow: 0 0 1em 0 rgba(0,0,0,0.1);
    transform: rotate(18deg);
}
p:nth-child(8n+1) {
    background: radial-gradient(black, midnightblue); 
    color: white;
    text-decoration: underline;
    text-decoration-thickness: 0.2em;
    border-radius: 0;
    transform: rotate(-1deg);
}
p:nth-child(4n+2) {
    -webkit-text-stroke: wheat 0.5em;
   color: burlywood;
   font-weight: bold;
   paint-order:  stroke;
   transform: rotate(-6deg);
   line-height: 1.35;
   font-size: 20px;
   font-family: serif;
}
p:nth-child(8n+2) {
    -webkit-text-stroke: #daa35d 0.5em;
   color: burlywood;
   font-weight: normal;
   font-size: 30px;
   transform: rotate(12deg);
   letter-spacing: 0.25em;
}
p:nth-child(4n+3) {
   transform: scale(1, 7);
   letter-spacing: 6px;
   line-height: 0.5;
   font-weight: bold;
   filter: blur(1px);
   color: mediumblue;
}
p:nth-child(8n+3) {
   transform: scale(2, 1);
   color: white;
}


p:nth-child(5n)::after{
   content: '⟶'
}
p:nth-child(5n + 1)::after{
   content: '★★★'
}
p:nth-child(5n + 2)::before{
   content: '✗'
}
p:nth-child(5n + 3)::before{
   content: '✿'
}
p:nth-child(5n + 4)::after{
   content: '❤'
}


p:has(a):has(img){
    all: revert !important;
}

/*
p:nth-child(1) { background: #00ed3c; }
p:nth-child(2) { background: #d26bb7; }
p:nth-child(3) { background: #df721e; }
p:nth-child(4) { background: #91ff00; }
p:nth-child(5) { background: #e100ff; }
p:nth-child(6) { background: #9b89d6; }
p:nth-child(7) { background: #c3ff00; }
p:nth-child(8) { background: #df721e; }
p:nth-child(9) { background: #91ff00; }
p:nth-child(10) { background: #e100ff; }
p:nth-child(11) { background: #00ed3c; }
p:nth-child(12) { background: #d26bb7; }
p:nth-child(13) { background: #df721e; }
p:nth-child(14) { background: #91ff00; }
p:nth-child(15) { background: #e100ff; }
p:nth-child(16) { background: #9b89d6; }
p:nth-child(17) { background: #c3ff00; }
p:nth-child(18) { background: #df721e; }
p:nth-child(19) { background: #91ff00; }
p:nth-child(20) { background: #e100ff; }
*/