MediaWiki:Common.css: Difference between revisions

From RevSpace
Jump to navigation Jump to search
No edit summary
No edit summary
 
(25 intermediate revisions by 2 users not shown)
Line 1: Line 1:
/* CSS placed here will be applied to all skins */
/* CSS placed here will be applied to all skins */
 
a:visited { color: green } /* Default dark purple blends into black text, making it hard to find the links again. */
#p-status {
    width: 80%;
    margin: auto;
    margin-bottom: 1em;
    text-align: center;
    font-size: smaller;
}


img[alt="Webhead.jpg"] { width: 100%; height: auto; }
img[alt="Webhead.jpg"] { width: 100%; height: auto; }
Line 20: Line 13:
strike, s { opacity: .7 }
strike, s { opacity: .7 }


#spacestatus {
pre, tt { border: 1px solid #aaa; background: #f4f4f4; }
    opacity: 0;
 
    border-radius: 3px;
#spacestatus { position: relative; top: -32px; left: 43px; border-radius: 3px; width: 80px; text-align: center; transform: rotate(-5deg); box-shadow: rgba(100,100,100,.6) 2px 2px 5px; }
    width: 80px;
#spacestatus.open { opacity: 1; background: lime; color: black; }
    text-align: center;
#spacestatus.closed { opacity: 1; background: red; color: white; }
    transform: rotate(-5deg);
#n {
    position: relative;
position: absolute; top: 15px; left: 5px; font-size: 80%; background: gray; border-radius: 3px; padding: 0 1ex ; text-align: center; color: white; transform: rotate(-2deg); box-shadow: rgba(100,100,100,.6) 2px 2px 5px;
    top: -32px;
}
    left: 43px;
#n a {
    box-shadow: rgba(100,100,100,.6) 2px 2px 5px;
display: inline; width: auto; height: auto;
color: white;
}
#n a:hover {
color: lime;
}
.spacestatus.spacestatus-kleur.open { color: green }
.spacestatus.spacestatus-kleur.closed { color: red }
 
#kiekjes { filter: saturate(130%) contrast(110%); }  /* Fake colors look better in thumbnails :P */
 
@keyframes spin {
    0% {
        transform: rotate(-0.8deg);
    }
    25% {
        transform:rotate(0.8deg);
    }
    50% {
        transform: rotate(-0.8deg);
    }
    75% {
        transform:rotate(0.8deg);
    }
    100% {
        transform:rotate(-0.8deg);
    }
}
}
#spacestatus.open {
 
     opacity: 1;
#tilting {
    background: lime;
     animation:spin 4s linear infinite;
    color: black;
}
}
#spacestatus.closed {
 
     opacity: 1;
.tilt {
    background: red;
     transform:rotate(0.5deg);
    color: white;
}
}

Latest revision as of 04:49, 23 January 2022

/* CSS placed here will be applied to all skins */
a:visited { color: green } /* Default dark purple blends into black text, making it hard to find the links again. */

img[alt="Webhead.jpg"] { width: 100%; height: auto; }

.editsection { display: none; }
h1:hover .editsection, h2:hover .editsection, h3:hover .editsection, h4:hover .editsection, h5:hover .editsection, h6:hover .editsection { display: inline; }

/* Effe iets leesbaardere tekst plx */
#nav h5, #nav div a { font-size: 9.5pt }
#nav div a { text-shadow: 0.5ex 0.5ex 1ex silver; }

strike, s { opacity: .7 }

pre, tt { border: 1px solid #aaa; background: #f4f4f4; }

#spacestatus { position: relative; top: -32px; left: 43px; border-radius: 3px; width: 80px; text-align: center; transform: rotate(-5deg); box-shadow: rgba(100,100,100,.6) 2px 2px 5px; }
#spacestatus.open { opacity: 1; background: lime; color: black; }
#spacestatus.closed { opacity: 1; background: red; color: white; }
#n {
	position: absolute; top: 15px; left: 5px; font-size: 80%; background: gray; border-radius: 3px; padding: 0 1ex		; text-align: center; color: white; transform: rotate(-2deg); box-shadow: rgba(100,100,100,.6) 2px 2px 5px;
}
#n a {
	display: inline; width: auto; height: auto;
	color: white;
}
#n a:hover {
	color: lime;
}
.spacestatus.spacestatus-kleur.open { color: green }
.spacestatus.spacestatus-kleur.closed { color: red }

#kiekjes { filter: saturate(130%) contrast(110%); }  /* Fake colors look better in thumbnails :P */

@keyframes spin {
    0% {
        transform: rotate(-0.8deg);
    }
    25% {
        transform:rotate(0.8deg);
    }
    50% {
        transform: rotate(-0.8deg);
    }
    75% {
        transform:rotate(0.8deg);
    }
    100% {
        transform:rotate(-0.8deg);
    }
}

#tilting {
    animation:spin 4s linear infinite;
}

.tilt {
    transform:rotate(0.5deg);
}