MediaWiki:Common.css: Difference between revisions

From Morloch Wiki
Jump to navigation Jump to search
No edit summary
No edit summary
 
(90 intermediate revisions by 2 users not shown)
Line 1: Line 1:
/* CSS placed here will be applied to all skins */
@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;600&display=swap');


/**************************/
/***************************/
/* Customize Top and Side */
/* Define Infobox Style  */
/**************************/
/***************************/


.WikiaPageHeader details {
.infobox {
  /*background-color: #101010;*/
    border: 1px solid #aaaaaa;
  background-image: -moz-linear-gradient(center top , #070707 0%, #101010 100%);
    background-color: #f9f9f9;
}
    color: black;
.WikiaArticle h2 {
    margin-bottom: 0.5em;
  border-bottom: 1px solid #404040;
    margin-left: 1em;
}
    padding: 0.2em;
.WikiaArticle div.tright, .WikiaArticle div.tleft {
    float: right;
  border: 1px solid #404040;
    clear: right;
}
.WikiaArticleCategories {
background: transparent;
background-image: -moz-linear-gradient(top, #181818 50%, #0B0B0B 100%);
background-image: -webkit-gradient(linear, 0% 0%, 0% 100%, color-stop(50%, #181818), color-stop(100%, #0B0B0B));
border: 1px solid #404040;
clear: both;
line-height: 1.8em;
padding: 10px;
margin: 10px;
}
.WikiaRail .module, .WikiaRail #RIGHT_SKYSCRAPER {
background-image: -moz-linear-gradient(top, #1D1D1D 60%, #0B0B0B 100%);
background-image: -webkit-gradient(linear, 0% 0%, 0% 100%, color-stop(60%, #1D1D1D), color-stop(100%, #0B0B0B));
border: 1px solid #202020;
margin-bottom: 10px;
padding: 16px 8px 8px;
position: relative;
}
/*** SIDEBAR ***/
.WikiaSearch input[type="text"] {
  background-color: #000000;
  background-image: -moz-linear-gradient(center top , #202020 0%, #000000 40%);
  color: #B0B0B0;
}
.WikiaSearch .autocomplete div:hover {
  background: #300300 !important;
}
#WikiaSpotlightsModule header {
  background-color: #00004E ;
  background-image: -moz-linear-gradient(left center , #00004E 0pt, #350300 50%, #00004E 100%);
  border-top: 5px solid #00004E ;
}
#WikiaSpotlightsModule .banner-corner-left {
  border-color: #00004E #00004E transparent transparent;
  left: 0;
}
#WikiaSpotlightsModule .banner-corner-right {
  border-color: #00004E transparent transparent #00004E ;
  right: 0;
}
#WikiaSpotlightsModule {
  background-image: -moz-linear-gradient(center top , black 60%, #0C0C0C 100%);
}
}


/************************/
/* Modernize MediaWiki */
/*** Set Backgr Image ***/
 
/************************/
:root {
{
    --primary-color: #3b82f6;
background-repeat: no-repeat;
    --text-color: #1e293b;
background-color: white;
    --bg-color: #f8fafc;
    --border-color: #e2e8f0;
    --content-bg: #ffffff;
    --header-bg: #f1f5f9;
}
}
.mediawiki {background-image: url();
}
body #bodycontent {
background-color: background-image: url();
}
/************************/
/*** Map Marking Code ***/
/************************/
.mapmark {position: relative; width: 500px; height: 350px;}


.wrap {
  white-space: pre-wrap;
}
/*** LINK HOVERING ***/
/****************************/
/*UNVISITED LINKS */
a,
.color2 a {
color: #388aaf;
}
a: hover,
.color2 a:hover {
/* VISITED LINKS */
color: #2081ad;
text-decoration: none;
text-shadow: #2dbdff 0 0 8px;
}
a: visited,
.color2 a:visited {
color: #2081ad;
text-decoration: none;
}
a: visited: hover,
.color2 a:visited:hover {
/* NEW LINKS */
color: #388aaf;
text-decoration: none;
text-shadow: #2dbdff 0 0 8px;
}
a.new {
color: #871611 !important;
}
a.new: hover,
.color2 a.new:hover {
color: #388aaf!important;
text-decoration: none;
text-shadow: #2dbdff 0 0 8px !important;
}
/* Map Marker */
body {
body {
    font-family: 'Inter', -apple-system, BlinkMacSystemFont, "Segoe UI", Helvetica, Arial, sans-serif !important;
    background-color: var(--bg-color) !important;
    color: var(--text-color) !important;
}
}


.pin {
#content, .mw-body {
  width: 30px;
    font-family: 'Inter', sans-serif !important;
  height: 30px;
    border-radius: 8px !important;
  border-radius: 50% 50% 50% 0;
    border: 1px solid var(--border-color) !important;
  background: #00cae9;
    box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06) !important;
  position: absolute;
    background-color: var(--content-bg) !important;
  transform: rotate(-45deg);
    margin-top: 1em !important;
  left: 50%;
    padding: 1.5em !important;
  top: 50%;
  margin: -20px 0 0 -20px;
}
}
.pin:after {
 
  content: "";
.portlet, .pBody {
  width: 14px;
    border-radius: 6px !important;
  height: 14px;
  margin: 8px 0 0 8px;
  background: #e6e6e6;
  position: absolute;
  border-radius: 50%;
}
}


.bounce {
.pBody {
  animation-name: bounce;
    background-color: var(--content-bg) !important;
  animation-fill-mode: both;
    border: 1px solid var(--border-color) !important;
  animation-duration: 1s;
}
}


.pulse {
.wikitable {
  background: #d6d4d4;
    border-collapse: collapse !important;
  border-radius: 50%;
    border-radius: 8px !important;
  height: 14px;
    overflow: hidden !important;
  width: 14px;
    border: 1px solid var(--border-color) !important;
  position: absolute;
    width: 100% !important;
  left: 50%;
    margin: 1em 0 !important;
  top: 50%;
  margin: 11px 0px 0px -12px;
  transform: rotateX(55deg);
  z-index: -2;
}
}
.pulse:after {
 
  content: "";
.wikitable th {
  border-radius: 50%;
    background-color: var(--primary-color) !important;
  height: 40px;
    color: #ffffff !important;
  width: 40px;
    padding: 12px 8px !important;
  position: absolute;
    text-align: left !important;
  margin: -13px 0 0 -13px;
  animation: pulsate 1s ease-out;
  animation-iteration-count: infinite;
  opacity: 0;
  box-shadow: 0 0 1px 2px #00cae9;
  animation-delay: 1.1s;
}
}


@keyframes pulsate {
.wikitable td {
  0% {
     padding: 10px 8px !important;
     transform: scale(0.1, 0.1);
     border: 1px solid var(--border-color) !important;
     opacity: 0;
}
  }


  50% {
.wikitable tr:nth-child(even) {
    opacity: 1;
     background-color: #f1f5f9 !important;
  }
 
  100% {
    transform: scale(1.2, 1.2);
     opacity: 0;
  }
}
}


@keyframes bounce {
a {
  0% {
     color: var(--primary-color) !important;
    opacity: 0;
    transform: translateY(-2000px) rotate(-45deg);
  }
 
  60% {
    opacity: 1;
    transform: translateY(30px) rotate(-45deg);
  }
 
  80% {
     transform: translateY(-10px) rotate(-45deg);
  }
 
  100% {
    transform: translateY(0) rotate(-45deg);
  }
}
}

Latest revision as of 16:13, 1 March 2026

@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;600&display=swap');

/***************************/
/* Define Infobox Style  */
/***************************/

.infobox {
    border: 1px solid #aaaaaa;
    background-color: #f9f9f9;
    color: black;
    margin-bottom: 0.5em;
    margin-left: 1em;
    padding: 0.2em;
    float: right;
    clear: right;
}

/* Modernize MediaWiki */

:root {
    --primary-color: #3b82f6;
    --text-color: #1e293b;
    --bg-color: #f8fafc;
    --border-color: #e2e8f0;
    --content-bg: #ffffff;
    --header-bg: #f1f5f9;
}

body {
    font-family: 'Inter', -apple-system, BlinkMacSystemFont, "Segoe UI", Helvetica, Arial, sans-serif !important;
    background-color: var(--bg-color) !important;
    color: var(--text-color) !important;
}

#content, .mw-body {
    font-family: 'Inter', sans-serif !important;
    border-radius: 8px !important;
    border: 1px solid var(--border-color) !important;
    box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06) !important;
    background-color: var(--content-bg) !important;
    margin-top: 1em !important;
    padding: 1.5em !important;
}

.portlet, .pBody {
    border-radius: 6px !important;
}

.pBody {
    background-color: var(--content-bg) !important;
    border: 1px solid var(--border-color) !important;
}

.wikitable {
    border-collapse: collapse !important;
    border-radius: 8px !important;
    overflow: hidden !important;
    border: 1px solid var(--border-color) !important;
    width: 100% !important;
    margin: 1em 0 !important;
}

.wikitable th {
    background-color: var(--primary-color) !important;
    color: #ffffff !important;
    padding: 12px 8px !important;
    text-align: left !important;
}

.wikitable td {
    padding: 10px 8px !important;
    border: 1px solid var(--border-color) !important;
}

.wikitable tr:nth-child(even) {
    background-color: #f1f5f9 !important;
}

a {
    color: var(--primary-color) !important;
}