MediaWiki:Vector.css: Difference between revisions

Revision as of 20:39, 6 June 2025 view source Admin (talk | contribs) ← Older edit		Revision as of 20:41, 6 June 2025 view source Admin (talk | contribs) Newer edit →
Line 3:		Line 3:
	/* Make clickable text on links invisible. */		/* Make clickable text on links invisible. */
	li#n-discord {		li#n-discord {
	color: transparent; /* Ensure the text is hidden while keeping the link functional */		color: #f6f6f6;
			visibility: visible;
			font-size: 0em; /* This hides the text content, but we'll keep it hidden */
	}		}
	/* Display an icon on hover */		/* Define the background for both hover and non-hover states in a single rule to avoid duplication */
	#n-discord:hover::after, #n-discord::after {		#n-discord::after {
	content: '';		content: '';
	display: inline-block;		display: inline-block;
	width: 36px;		width: 36px;
	height: 36px;		height: 36px;
	background: url('https://certified.wiki/images/icons/discord_logo_icon.png');		background: url('https://certified.wiki/images/icons/discord_logo_icon.png') no-repeat center / contain;
	background-repeat: no-repeat;
	background-size: contain;
	}		}
	/* Ensure the hover state applies to the element */		/* Style for hover state */
	#n-discord:hover::after {		#n-discord:hover::after {
	background-image: url('https://certified.wiki/images/icons/discord_logo_icon.png'); /* This should be redundant but kept for clarity */		/* No need to redefine the entire rule, just ensure the style is correct */
	}		}
			/* Remove redundant rules and ensure specificity if needed */
			li#n-discord {
			font-size: 0em; /* Hidden text */
			padding: 10px;
			}

Revision as of 20:41, 6 June 2025

/* All CSS here will be loaded for users of the Vector skin */

/* Make clickable text on links invisible. */
li#n-discord {
    color: #f6f6f6;
    visibility: visible;
    font-size: 0em; /* This hides the text content, but we'll keep it hidden */
}

/* Define the background for both hover and non-hover states in a single rule to avoid duplication */
#n-discord::after {
    content: '';
    display: inline-block;
    width: 36px;
    height: 36px;
    background: url('https://certified.wiki/images/icons/discord_logo_icon.png') no-repeat center / contain;
}

/* Style for hover state */
#n-discord:hover::after {
    /* No need to redefine the entire rule, just ensure the style is correct */
}

/* Remove redundant rules and ensure specificity if needed */
li#n-discord {
    font-size: 0em; /* Hidden text */
    padding: 10px;
}






/* Make clickable text on links invisible. */
li#n-facebook {
color:#f6f6f6;
visibility: visible;
font-size:0em;
}

#n-facebook:hover ::after, #n-facebook ::after {
content: '';
display: inline-block;
width: 35px;
height: 35px;

background: url('https://certified.wiki/images/icons/facebook_logo_icon.png');
}

/* Every image need to have its own rule defined. */
#n-facebook::after{
background: url('https://certified.wiki/images/icons/facebook_logo_icon.png');
}

#n-facebook:hover ::after {
background: url('https://certified.wiki/images/icons/facebook_logo_icon.png');
}


#n-facebook:hover ::after, #n-facebook ::after{
background-repeat: no-repeat;
background-size: contain;
}

#mw-panel .portal .body li#n-facebook {
font-size:0em;
padding:10px;
}




body { background-color: #e8e1d5; }

#p-navigation { background-color: #e8e1d5; }

#mw-head { background-color: #e8e1d5; }
#mw-head-base { background-color: #e8e1d5; }
#mw-panel { background-color: #e8e1d5; }
#p-logo { background-color: #e8e1d5; }

#p-tb { background-color: #e8e1d5; }
#p-tb-label { background-color: #e8e1d5; }

.mw-body { border: 1px solid #000000; }

#content { background-color: #ded5ba; }
#bodyContent { background-color: #ded5ba; }
#firstHeading { background-color: #ded5ba; }

#catlinks { background-color: #e8e1d5; }
#p-tb .body { background-color: #e8e1d5; }

#footer { 
 background-color: #ded5ba;
 min-height: 100px; 
 top: 10px;
 border-bottom: 1px solid #000000;
 border-left: 1px solid #000000;
 border-right: 1px solid #000000;
}


/* Top menu tabs */

.vector-menu-tabs, .vector-menu-tabs a, #mw-head .vector-menu-dropdown h3 {
    background-image: linear-gradient(to bottom,#ded5ba 0,#ded5ba 100%); }

.vector-menu-tabs li {
    background-image: linear-gradient(to top,#ded5ba 0,#ded5ba 1px,#ded5ba 100%); }

.vector-menu-tabs .selected {
    background: #ded5ba; }

.vector-menu-tabs .selected a, .vector-menu-tabs .selected a:visited {
    color: #331c8c; }

.vector-menu-tabs { border-top: 1px solid #000000; border-left: 1px solid #000000; border-right: 1px solid #000000;}



/* Dropdown menu */

.vector-menu-dropdown .vector-menu-content {
    background-color: #e8e1d5;
    border: 1px solid #000000; }