Jump to content

MediaWiki:Common.css

From WikiGence

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.
/* ==========================================
   WIKIGENCE SIDEBAR ICONS
   Vector 2022 Compatible
========================================== */

/* Common */

.vector-pinnable-element .vector-menu-content-list li > a{
    position:relative;
    display:block;
    padding:6px 10px 6px 40px;
    border-radius:8px;
    transition:background .2s ease,color .2s ease;
}

.vector-pinnable-element .vector-menu-content-list li > a::before{
    content:"";
    position:absolute;
    left:10px;
    top:50%;
    transform:translateY(-50%);
    width:20px;
    height:20px;
    background-repeat:no-repeat;
    background-position:center;
    background-size:18px 18px;
    flex-shrink:0;
}

/* ==========================
   OUR SERVICES
========================== */
/* Main Menu */

#n-Main-Page > a::before{
    background-image:url("/images/sidebar/home.svg");
}

#n-Recent-changes > a::before{
    background-image:url("/images/sidebar/recent.svg");
}

#n-Random-page > a::before{
    background-image:url("/images/sidebar/random.svg");
}

#n-Help-about-WikiGence > a::before{
    background-image:url("/images/sidebar/about.svg");
}

/*     Services       */

#n-Google-Knowledge-Panel > a::before{
    background-image:url("/images/sidebar/gkp.svg");
}

#n-Article-Publishing-\26-PR > a::before{
    background-image:url("/images/sidebar/article.svg");
}

#n-Wikipedia-Consultation > a::before{
    background-image:url("/images/sidebar/wikipedia.svg");
}

#n-Online-Reputation-Management > a::before{
    background-image:url("/images/sidebar/reputation.svg");
}

#n-Personal-Brand-Visibility > a::before{
    background-image:url("/images/sidebar/brand.svg");
}

#n-Business-Entity-Development > a::before{
    background-image:url("/images/sidebar/business.svg");
}

#n-Press-Release-Distribution > a::before{
    background-image:url("/images/sidebar/press.svg");
}

#n-Entity-Verification > a::before{
    background-image:url("/images/sidebar/verify.svg");
}

#n-Brand-Authority > a::before{
    background-image:url("/images/sidebar/authority.svg");
}

#n-Digital-Presence-Management > a::before{
    background-image:url("/images/sidebar/digital.svg");
}

/* ==========================
   RESOURCES
========================== */

#n-Contact-Us > a::before{
    background-image:url("/images/sidebar/contact.svg");
}

#n-Help-Center > a::before{
    background-image:url("/images/sidebar/help.svg");
}

#n-About-WikiGence > a::before{
    background-image:url("/images/sidebar/about.svg");
}

#n-FAQ > a::before{
    background-image:url("/images/sidebar/faq.svg");
}

/* ===========================
   GENERAL
=========================== */

#t-whatlinkshere > a::before{
    background-image:url("/images/sidebar/links.svg");
}

#t-recentchangeslinked > a::before{
    background-image:url("/images/sidebar/related.svg");
}

#t-upload > a::before{
    background-image:url("/images/sidebar/upload.svg");
}

#t-specialpages > a::before{
    background-image:url("/images/sidebar/special.svg");
}

#t-permalink > a::before{
    background-image:url("/images/sidebar/link.svg");
}

#t-info > a::before{
    background-image:url("/images/sidebar/info.svg");
}

#t-cite > a::before{
    background-image:url("/images/sidebar/cite.svg");
}


/* ===========================
   PRINT / EXPORT
=========================== */

#coll-create_a_book > a::before{
    background-image:url("/images/sidebar/book.svg");
}

#coll-download-as-rl > a::before{
    background-image:url("/images/sidebar/pdf.svg");
}

#t-print > a::before{
    background-image:url("/images/sidebar/print.svg");
}

/* ==========================
   Hover Effect
========================== */

.vector-pinnable-element .vector-menu-content-list li > a{
    transition:color .2s ease;
}

.vector-pinnable-element .vector-menu-content-list li > a:hover{
    background:#eef4ff;
    color:#123d96;
    text-decoration:none;
}

.vector-pinnable-element .vector-menu-content-list li > a:hover::before{
    transform:translateY(-50%) scale(1.08);
}
/*main code here */
/* =========================
   WIKIGENCE PREMIUM HERO
   ========================= */

.page-Main_Page .mw-parser-output{
max-width:1350px !important;
margin:0 auto !important;
}

.wg-hero{
background:linear-gradient(180deg,#f7faff 0%,#ffffff 100%);
border:1px solid #d8e3f3;
border-radius:20px;
padding:35px;
margin:20px auto;
box-shadow:0 8px 25px rgba(0,0,0,.05);
}

.wg-hero-top{
text-align:center;
margin-bottom:35px;
}

.wg-hero-top h2{
font-size:48px;
font-weight:800;
line-height:1.1;
color:#123d96;
margin:0 0 15px;
}

.wg-hero-top h1{
font-size:38px;
font-weight:800;
line-height:1.1;
color:#123d96;
margin:0 0 15px;
}

.wg-hero-top p{
max-width:900px;
margin:auto;
font-size:17px;
line-height:1.7;
color:#5a6270;
}

/* SERVICES */

.wg-services{
display:grid;
grid-template-columns:repeat(3,minmax(0,1fr));
gap:18px;
margin-top:25px;
}

.wg-service-card{
display:flex;
align-items:center;
gap:18px;
background:#fff;
border:1px solid #e5eaf3;
border-radius:18px;
padding:22px;
box-shadow:0 3px 12px rgba(0,0,0,.04);
transition:.3s;
}

.wg-service-card:hover{
transform:translateY(-4px);
box-shadow:0 10px 25px rgba(0,0,0,.08);
}

.wg-service-icon{
width:72px;
height:72px;
border-radius:50%;
display:flex;
align-items:center;
justify-content:center;
font-size:34px;
flex-shrink:0;
}

.icon-green{background:#eaf8ee;}
.icon-blue{background:#edf4ff;}
.icon-purple{background:#f4efff;}
.icon-orange{background:#fff3e8;}
.icon-pink{background:#fff0f5;}
.icon-cyan{background:#eafcff;}

.wg-service-text{
flex:1;
}

.wg-service-text h3{
margin:0 0 8px;
font-size:20px;
font-weight:700;
line-height:1.3;
color:#173f99;
word-break:normal;
overflow-wrap:break-word;
}

.wg-service-text p{
margin:0;
font-size:15px;
line-height:1.7;
color:#5b6572;
}

/* CONTACT */

.wg-contact-grid{
display:grid;
grid-template-columns:repeat(3,minmax(0,1fr));
gap:18px;
margin-top:20px;
}

.wg-contact-card{
display:flex;
align-items:center;
gap:16px;
background:#fff;
border:1px solid #e5eaf3;
border-radius:18px;
padding:18px;
box-shadow:0 3px 12px rgba(0,0,0,.04);
}

.wg-contact-text{
display:flex;
flex-direction:column;
}

.wg-contact-text strong{
font-size:18px;
font-weight:700;
margin-bottom:4px;
}

.wg-contact-text span{
font-size:15px;
}

.wg-contact-text small{
font-size:13px;
color:#666;
margin-top:4px;
}

/* BUTTONS */

.wg-cta-buttons{
text-align:center;
margin:30px 0;
}

.wg-cta-buttons a{
display:inline-block;
margin:8px;
padding:16px 40px;
border-radius:40px;
font-size:18px;
font-weight:700;
text-decoration:none !important;
}

.wg-cta-buttons a:first-child{
background:#3366ff;
color:#fff !important;
}

.wg-cta-buttons a:last-child{
background:#181d25;
color:#fff !important;
}

/* NOTE */

.wg-note{
background:#fff;
border:1px solid #dbe5f5;
border-radius:14px;
padding:20px;
margin-top:10px;
font-size:14px;
line-height:1.8;
text-align:center;
color:#555;
}

/* DESKTOP WIDTH FIX */

.vector-feature-zebra-design-enabled .mw-page-container{
max-width:1900px !important;
}

.vector-feature-zebra-design-enabled .mw-content-container{
max-width:1600px !important;
}

/* TABLET */

@media (max-width:1200px){

.wg-services{
grid-template-columns:repeat(2,1fr);
}

.wg-contact-grid{
grid-template-columns:repeat(2,1fr);
}

}

/* MOBILE */

@media (max-width:768px){

.wg-hero{
padding:20px;
}

.wg-hero-top h1{
font-size:34px;
}

.wg-hero-top p{
font-size:17px;
line-height:1.6;
}

.wg-services,
.wg-contact-grid{
grid-template-columns:1fr;
}

.wg-service-card,
.wg-contact-card{
padding:16px;
}

.wg-service-icon{
width:60px;
height:60px;
font-size:28px;
}

.wg-service-text h3{
font-size:20px;
}

}

/* old here down */

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

/* Logo */
.vector-header-start .mw-logo {
	min-width:10rem !important;
}
.vector-header-start .mw-logo img {
	width: 10rem !important;
	height: auto !important;
}
.vector-header-start .mw-logo span {
	display:none !important;
}

/* InfoBox */

.infobox {
  border: 2px solid #aaa;
  background-color: #f9f9f9;
  padding: 5px;
  float: right;
  margin: 0 0 1em 1em;
  width: 250px;
  font-size: 90%;
  line-height: 1.4em;
}
.infobox th {
  background-color: #efefef;
  text-align: left;
  padding: 4px;
}
.infobox td {
  padding: 4px;
}

.page-Main_Page main header,
.page-Main_Page main .page-heading {
	display: none !important;
}

.page-Main_Page .catlinks {
	display: none !important;
}

.main-page-layout {
	display: flex;
    flex-direction: row;
	gap: 4px;
}

.main-page-column {
display:flex;
flex-direction: column;
gap:4px;
}

.image-flex-basis {
	flex-basis:150px;
}

@media screen and (max-width: 767px){
    .main-page-layout{
       flex-direction:column;
   }

    .image-flex-basis {
	   flex-basis:350px;
   }
}


/* Top Section code */

/******** WIKIGENCE PREMIUM HERO ********/



/* end end end */
Retrieved from "https://wikigence.org/index.php?title=MediaWiki:Common.css&oldid=9957"