MediaWiki:Group-user.css

From :: ChromeRivals Wiki ::
Revision as of 14:47, 20 February 2024 by Ranzu (talk | contribs)
Jump to navigation Jump to search

Note: After publishing, you may have to bypass your browser's cache to see the changes.

  • Firefox / Safari: Hold Shift while clicking Reload, or press either Ctrl-F5 or Ctrl-R (⌘-R on a Mac)
  • Google Chrome: Press Ctrl-Shift-R (⌘-Shift-R on a Mac)
  • Edge: Hold Ctrl while clicking Refresh, or press Ctrl-F5.
/* Heading */
.page-Test_Page #firstHeading	{
	display:none;
	}

/* Main picture content */
.MainPicture	{
	display:flex;
	justify-content:center;
	flex-direction:row;
	}
	
/* Image Logo */
.MainPicture a img	{
	-webkit-filter: drop-shadow(15px 15px 15px #222);
	filter: drop-shadow(20px 15px 15px #222);
	}

.MainPicture a img:hover	{
	-webkit-filter: drop-shadow(0px 0px 15px gray);
	}
	
/* Description content */
.MainDSC	{
	display:flex;
	flex-direction:column;
	align-items:center;
	}

/* Pedia content */
.MainPedia	{
	display:flex;
	justify-content:center;
	align-items:center;
	text-align:center;
	}
  
.PediaTable	{
	display:flex;
	justify-content:center;
	align-items:center;
	}

.Pedia {
	padding-left:2em;
	padding-right:2em;
	}

.PediaTable p img 	{
	-webkit-filter: drop-shadow(15px 15px 13px #222);
	filter: drop-shadow(15px 15px 13px #222);
	}

.PediaTable a img:hover	{
	-webkit-filter: drop-shadow(0px 0px 8px gray);
	}
	
/* Main content */
.MainLinks, 
.YouMAL	{
	display:flex;
	flex-wrap:wrap;
	flex-direction:row;
	align-items:center;
	justify-content:center;
	padding-left:10%;
	padding-right:10%;
	}

/* Paragraphs */
.MainLinks p, 
.Events p, 
.Other p, 
.YouMAL p, 
.Shops p, 
.Usefull p, 
.Discord p, 
.Social p {
	border:2px solid #808080;
	padding:3px 0 3px 5px;
	background-color:#445466; /*  #f0f0f0 */
	padding-right:7px;
	margin-right:4px;
	margin-left:4px;
	white-space:nowrap;
	}

/* Links Picture*/
.MainLinks p a:nth-child(1), 
.Other p a:nth-child(1), 
.Other p a span:nth-child(1), 
.YouMAL p a:nth-child(1),
.Usefull p a:nth-child(1), 
.Usefull p a span:nth-child(1), 
.Discord p a:nth-child(1), 
.Social p a span:nth-child(1)	{
	padding:8px 0 10px 0;
	border-left:5px solid transparent;
	margin-left:-5px
}

/* Links text*/
.MainLinks p a:nth-child(2), 
.Other p a:nth-child(2), 
.Other p a span:nth-child(2), 
.YouMAL p a:nth-child(2),
.Usefull p a, 
.Usefull p a span, 
.Discord p a, 
.Social p a span	{
	color:white!important;
	padding:8px 0 10px 0;
	border-right:5px solid transparent;
	margin-right:-7px;
	}

/* Links EVENTS  picture - because different size picture*/
.Events p a:nth-child(1) {
	padding:12px 0 14px 0;
	border-left:5px solid transparent;
	margin-left:-5px
	}

/* Links EVENTS  text - because different size picture */
.Events p a:nth-child(2) {
	color:white!important;
	padding:12px 0 14px 0;
	border-right:5px solid transparent;
	margin-right:-7px
	}

/* Paragraphs HOVER */
.MainLinks p:hover, .Events p:hover, .Other p:hover, .YouMAL p:hover,.Usefull p:hover, .Discord p:hover, .Social p:hover	{
	background-color: #808080;   /*  #C3C3C3 */
	cursor: pointer;
	border:2px solid #4F4F4F;  
	color:white!important;
	}
	
.Shops p:hover	{
	cursor: pointer;
	border:2px solid black;  
	background-color: #2b314b;
	}
	
/* MainLinks: Rules - Other - Paragraphs ACTIVE */
.MainLinks p:active, .Events p:active, .Other p:active, .YouMAL p:active, .Shops p:active, .Usefull p:active, .Discord p:active, .Social p:active	{
	background-color: #C7C7C7;
	cursor: pointer;
	border:2px solid #595959;
	color:white!important;
	}

.YouMAL a:active, .Discord a:active {
	color:white!important;
	}

.Shops p:active	{
	cursor: pointer;
	border:2px solid #4e6271; 
	background-color: gray;
	}

/* Grid box: Gears, Events, Other */


/* Gears */
/* Gears, Events, Other Box */
.G_E_O-Box{
	display:flex;
	flex-wrap:wrap;
	justify-content:space-around;
	flex-direction:row;
	padding-left:10%;
	padding-right:10%;
	}

/* Gears */
.G_E_O-Box .Gears{
	flex-wrap:wrap;
	display:flex;
	align-items:center;
	flex-direction:column;
	justify-content:center;
	width: 480px;
	height:480px;
	}

.G_E_O-Box .Gears img{
	border:2px solid #808080;
	margin:0.5em;
	min-width:220px;
}
	
/* Gears hover info*/
.hideMainPage	{
	display: none;
	}

.HoverHide:hover + .hideMainPage	{
	display: block;;
	}

/* Hover over image to see text */
.ContainerMainPage	{
	position: relative;
	width: auto;
	}

.OverlayMainPage	{
	position: absolute;
	top: 0;
	bottom: 0;
	left: 0;
	right: 0;
	height: 100%;
	width: 100%;
	opacity: 0;
	transition: .5s ease;
	background-color: rgba(0, 0, 0, 0.3);
	pointer-events: none;
	}

.ContainerMainPage:hover .OverlayMainPage	{
	opacity: 1;
	}

.HoverImgPainPage	{
	color: white;
	font-size: 1.875em;
	position: absolute;
	text-align: center;
	top: 50%;
	left: 50%;
	width:100%;
	transform: translate(-50%, -50%);
	-ms-transform: translate(-50%, -50%);
	}

.Gears .ContainerMainPage:active {
	background-color: #7e9496;
	}
	
/* Shops */
.Shops	{
	display:grid;
	padding-left:10%;
	padding-right:10%;
	align-content:center;
	justify-content:space-around;
	grid-template-columns:auto auto auto auto auto auto;
	grid-template-columns: repeat(auto-fill, 16em);
	}


/* Shops Paragraph */
.Shops p {
	text-align:center;
	line-height:3em;
	font-weight:600;
	padding-left:2em;
	padding-right:2em;
	color:#ffffff;
	background-blend-mode:overlay;
	}
	
/* Shops Link */
.Shops a {
  color:white!important;
}

.Shops p a {
	display:block;
	border-top:3px solid transparent;
	margin-top:-3px;
	border-bottom:3px solid transparent;
	margin-bottom:-3px;
	border-left:28px solid transparent;
	margin-left:-28px;
	border-right:28px solid transparent;
	margin-right:-28px;
	}

/* Shops Images */
.Shops p:nth-child(1) { 
	background-image:url("/images/1/17/War_Point_Shop.png");
	background-size:cover;
	background-position-y:45%;}
.Shops p:nth-child(2) { 
	background-image:url("/images/5/53/Gear_Shop.png");
	background-size:cover;
  background-position-y:44%;}
.Shops p:nth-child(3) { 
	background-image:url("/images/7/75/Parts_Shop.png");
	background-size:cover;
	background-position-y:62%;}
.Shops p:nth-child(4) { 
	background-image:url("/images/5/56/WeaponShop.png");
	background-size:cover;
	background-position-y:63%;}
.Shops p:nth-child(5) { 
	background-image:url("/images/9/9a/Card_Shop.png");
	background-size:cover;
	background-position-y:33%;}
.Shops p:nth-child(6) { 
	background-image:url("/images/d/dc/FFA_Shop.png");
	background-size:cover;
	background-position-y:45%;}
.Shops p:nth-child(7) { 
	background-image:url("/images/b/b6/Boss_Token_Shop.png");
	background-size:cover;
	background-position-y:35%;}
.Shops p:nth-child(8) { 
	background-image:url("/images/5/57/Gold_Coin_Shop.png");
	background-size:cover;
	background-position-y:25%;}
.Shops p:nth-child(9) { 
	background-image:url("/images/0/0b/Killmark_Shop.png");
	background-size:cover;
	background-position-y:34%;}
.Shops p:nth-child(10) { 
	background-image:url("/images/b/b9/Weapon_Contour_Shop.png");
	background-size:cover;
	background-position-y:46%;}
.Shops p:nth-child(11) { 
	background-image:url("/images/5/5c/Armor_Contour_Shop.png");
	background-size:cover;
	background-position-y:55%;}
.Shops p:nth-child(12) { 
	background-image:url("/images/e/e4/Custom_Cosmetics_Shop.png");
	background-size:cover;
	background-position-y:35%;}
.Shops p:nth-child(13) { 
	background-image:url("/images/b/b9/Weapon_Effect_Shop.png");
	background-size:cover;
	background-position-y:35%;}
.Shops p:nth-child(14) { 
	background-image:url("/images/e/e1/Aquarium.png");
	background-size:cover;
	background-position-y:75%;}
.Shops p:nth-child(15) { 
	background-image:url("/images/4/41/Infinity_Field_Vendor.png");
	background-size:cover;
	background-position-y:45%;}
.Shops p:nth-child(16) { 
	background-image:url("/images/4/47/Event_Shop.png");
	background-size:cover;
	background-position-y:45%;}
.Shops p:nth-child(17) { 
	background-image:url("/images/d/d2/Skill_Shop.png");
	background-size:cover;
	background-position-y:55%;}
.Shops p:nth-child(18) { 
	background-image:url("/images/1/11/CRP_Shop.png");
	background-repeat: no-repeat;
	background-size: 55%;
	background-position: 7em;
	}

.Social{
	display:flex;
	flex-wrap:wrap;
	justify-content:center;
	}

/* Social  */
.Social p img{
	width:2em;
	padding-right:7px;
	}

/* Usefull, Discord */
.U_D-Box	{
	display:flex;
	justify-content:center;
	flex-direction:row;
	flex-wrap:wrap;
	}

.U_D-Box .Useful{
	padding-left:3em;
	padding-right:3em;
	text-align:center!important;
	}
	
.U_D-Box .Discord	{
	text-align:center;
	}
	
/* Padding on small pictures */
.MainLinks img, .Events img, .Other img, .YouMAL img{
	padding-right:0.5em;
	padding-right:0.5em;
	}

/* Title, main headers */
.Title, .Pedia span, .Shops.Title {
	display:flex;
	justify-content:center;
	align-items:center;
	font-weight: bold;
	filter: drop-shadow(0 0 3px gray);
	}
	
/* Shadows */
.MainLinks p,
.G_E_O-Box .Events p,
.G_E_O-Box .Other p,
.YouMAL p,
.Social p,
.Shops p {
	box-shadow:0px 0px 50px -25px black;
	}

.G_E_O-Box .Gears .ContainerMainPage	{
	box-shadow:0px 0px 50px -25px black;
	}

.U_D-Box .Discord p,
.U_D-Box .Usefull p
	{
	box-shadow:0px 0px 50px -14px black;
	}	
	
/* Pciture sizes */
@media screen and (max-width: 850px) {
.Gears  {transform:scale(0.95); transition: .2s ease-in-out;}}

@media screen and (max-width: 800px) {
.Gears  {transform:scale(0.90); transition: .2s ease-in-out; }}

@media screen and (max-width: 750px) {
.Gears  {transform:scale(0.85); transition: .2s ease-in-out; }}

@media screen and (max-width: 700px) {
.Gears  {transform:scale(0.80); transition: .2s ease-in-out; }}
  
@media screen and (max-width: 650px) {
.Gears  {transform:scale(0.75); transition: .2s ease-in-out; }}

@media screen and (max-width: 600px) {
.Gears  {transform:scale(0.70); transition: .2s ease-in-out; }}

@media screen and (max-width: 550) {
.Gears  {transform:scale(0.65); transition: .2s ease-in-out; }}

@media screen and (max-width: 500) {
.Gears  {transform:scale(0.60); transition: .2s ease-in-out; }}

@media screen and (max-width: 450) {
.Gears  {transform:scale(0.55); transition: .2s ease-in-out; }}

@media screen and (max-width: 400) {
.Gears  {transform:scale(0.50); transition: .2s ease-in-out; }}
/* Borders */
/* Border Pedia Top 
.PediaTable	{
	border-top: 1px solid white;
	border-left: 1px solid white;
	border-right: 1px solid white;
	margin-left:20%;
	margin-right:20%;
	padding-left:1em;
	padding-right:1em;
	border-top-left-radius: 3em;
	border-top-right-radius: 3em;
	}

/* Border Pedia Bottom 
.MainPedia	{
	border-bottom: 1px solid white;
	border-left: 1px solid white;
	border-right: 1px solid white;
	margin-left:25%;
	margin-right:25%;
	padding-left:5em;
	padding-right:5em;
	border-bottom-left-radius: 3em;
	border-bottom-right-radius: 3em;
	box-shadow: 0 30px 40px rgba(0,0,0,.1);
	}

/* Border You might also like Top 
.YouMAL.Title	{
	border-top: 1px solid white;
	border-left: 1px solid white;
	border-right: 1px solid white;
	margin-left:17%;
	margin-right:17%;
	padding-top:0.5em;
	padding-bottom:0.5em;
	border-top-left-radius: 3em;
	border-top-right-radius: 3em;
	}

/* Border Shops Top 
.Shops.Title  {
	border-top: 1px solid white;
	border-left: 1px solid white;
	border-right: 1px solid white;
	margin-left:16%;
	margin-right:16%;
	padding-top:0.5em;
	padding-bottom:0.5em;
	border-top-left-radius: 3em;
	border-top-right-radius: 3em;
	}
	
*/



























/* CSS placed here will affect registered users only */
/* Some useless for me stuff in edit box */
#wpSummaryLabel,.editCheckboxes , #editpage-copywarn	{
	display:none;
	}
	
/* Edit box */
#wpTextbox1{
  height:900px
}

/* Edit option below edit box */
.editOptions	{
	background-color: transparent;
	border:none;
	padding-bottom:0;
	margin-bottom:0;
	}

/* Edit buttons */
.editButtons	{
	position:fixed;
	bottom:1em;
	z-index:50;
	}

/* Show changes */
.diff-deletedline, .diff-addedline	{
	color:black
	}

/* Search button in edit box */	
.group-search	{
	position:fixed;
	background-color: #f8f9fa;
	border: 1px solid #a2a9b1;
	transform:scale(.9);
	bottom:0.965em;
	left:51em;
	z-index:50;
	}
	
#wikiEditor-section-main > div.group.group-codeeditor-style > span:nth-child(4){
	position:fixed;
	background-color: #f8f9fa;
	border: 1px solid #a2a9b1;
	bottom:1em;
	right:82em;
	z-index:50;
	}
Retrieved from "https://wiki.chromerivals.net/index.php?title=MediaWiki:Group-user.css&oldid=13608"