MediaWiki:Common.css: Difference between revisions

From Comprehensible Input Wiki
Content added Content deleted
No edit summary
No edit summary
 
(19 intermediate revisions by the same user not shown)
Line 1: Line 1:
/* CSS placed here will be applied to all skins */
/* CSS placed here will be applied to all skins */


@import url("/wiki/Mediawiki:Datatables.css?ctype=text/css&action=raw");
/* Main Page - Getting started box */

#starting {
/* Info boxes */
border-style: solid;
.ciw-info-box, #starting, #summary_link, #mhthanks, #ciw-key-div, #newUrlDiv, #c-notice, #library-info, #lib-list-header{
border-style: solid;
border-color: green;
border-color: green;
padding: 10px;
padding: 10px 13px;
width: 80%;
width: fit-content;
margin:28px auto;
margin:28px auto;
border-radius: 10px;
border-radius: 10px;
Line 12: Line 14:
}
}


#summary_link, #mhthanks, #lib-list-header {
/* Main Page - Summary info */
#summary_link {
border-style: solid;
border-color: green;
padding: 10px;
width: 80%;
margin: 28px auto;
border-radius: 10px;
background-color: lightyellow;
text-align: center;
text-align: center;
}
}


#ciw-key-div, #newUrlDiv {
#mhthanks {
border-style: solid;
border-color: green;
padding: 10px;
width: 50%;
margin: 28px auto;
border-radius: 10px;
background-color: lightyellow;
text-align: center;
}

/* Key template */
#ciw-key-div {
width:max-content;
margin:auto;
margin:auto;
border-style: solid;
border-color: green;
padding: 10px;
border-radius: 10px;
background-color: lightyellow;
}
}


Line 55: Line 31:
}
}


#vidHolder {
/* New URL box */
box-shadow: rgba(0, 0, 0, 0.25) 0px 0.0625em 0.0625em, rgba(0, 0, 0, 0.25) 0px 0.125em 0.5em, rgba(255, 255, 255, 0.1) 0px 0px 0px 1px inset;
#newUrlDiv {
margin: auto;
width:max-content;
width: min-content;
margin:auto;
padding: 10px;
border-style: solid;
float: right;
border-color: green;
margin-left: 30px;
padding: 10px;
margin-bottom: 30px;
border-radius: 10px;
background-color: lightyellow;
}
}


@media only screen and (max-width:800px) {
/* Modal popup to redirect */
#vidHolder {
.modalDialog {
float:none;
position: fixed;
margin: auto;
font-family: Arial, Helvetica, sans-serif;
}
top: 0;
right: 0;
bottom: 0;
left: 0;
background: rgba(0,0,0,0.8);
z-index: 99999;
opacity:0;
transition: opacity 400ms ease-in;
pointer-events: none;
}
}


.random-active {
.modalDialog:target {
display: block;
opacity:1;
pointer-events: auto;
}
}


.random-hidden {
.modalDialog > div {
display: none;
position: relative;
width: 50%;
height:auto;
margin: 10% auto;
padding: 5px 20px 13px 20px;
border-radius: 10px;
background: #fff;
background: linear-gradient(#fff, #999);
}
}


.nextbutton-image:hover {
.modalDialog img {
background: #ededed;
width:100%;
height:auto;
cursor: pointer;
}

.close {
background: #606061;
color: #fff;
line-height: 25px;
position: absolute;
right: -12px;
text-align: center;
top: -10px;
width: 24px;
text-decoration: none;
font-weight: bold;
border-radius: 12px;
box-shadow: 1px 1px 3px #000;
}
}


.nextbutton-image {
.close:hover {
width: 45px;
background: #00d9ff;
}
}

Latest revision as of 18:44, 10 May 2023

/* CSS placed here will be applied to all skins */

@import url("/wiki/Mediawiki:Datatables.css?ctype=text/css&action=raw");

/* Info boxes */
.ciw-info-box, #starting, #summary_link, #mhthanks, #ciw-key-div, #newUrlDiv, #c-notice, #library-info, #lib-list-header{
    border-style: solid;
	border-color: green;
	padding: 10px 13px;
	width: fit-content;
	margin:28px auto;
	border-radius: 10px;
	background-color: lightyellow;
}

#summary_link, #mhthanks, #lib-list-header {
	text-align: center;
}

#ciw-key-div, #newUrlDiv {
  margin:auto;
}

/* MediaWiki:Searchmenu-new - Input box */
#searchinputbox br {
	display:none;
}
 
#searchinputbox .mw-inputbox-centered > form {
	width: min-content;
}

#vidHolder {
	box-shadow: rgba(0, 0, 0, 0.25) 0px 0.0625em 0.0625em, rgba(0, 0, 0, 0.25) 0px 0.125em 0.5em, rgba(255, 255, 255, 0.1) 0px 0px 0px 1px inset;
	margin: auto;
	width: min-content;
	padding: 10px;
	float: right;
	margin-left: 30px;
	margin-bottom: 30px;
}

@media only screen and (max-width:800px) {
 #vidHolder {
   float:none;
   margin: auto;
 }
}

.random-active {
	display: block;
}

.random-hidden {
	display: none;
}

.nextbutton-image:hover {
    background: #ededed;
    cursor: pointer;
}

.nextbutton-image {
	width: 45px;
}