MediaWiki:Common.css: Difference between revisions

From Puella Magi Wiki
Jump to navigation Jump to search
(A couple more minor improvements to the tab view)
(Fix the issue of links, inline elements, and other things showing through an inline spoiler)
Line 81: Line 81:
  * ------------------------------------------------------------- */
  * ------------------------------------------------------------- */


.inline-spoilers, .inline_spoilers a, .inline_spoilers a:visited {
.inline-spoilers {
   /*background: #222;
   /*background: #222;
   color: #222;*/
   color: #222;*/
Line 90: Line 90:
   border-right:  1px solid #b3b3b3;
   border-right:  1px solid #b3b3b3;
   padding: 2px;
   padding: 2px;
}
.inline-spoilers * {
  visibility: hidden;
}
}


.inline-spoilers:hover {
.inline-spoilers:hover {
   color: black;
   color: inherit;
}
 
.inline-spoilers:hover * {
  visibility: inherit;
}
}



Revision as of 23:19, 18 August 2023

/* -------------------------------------------------------------
 * Runes fonts
 * -------------------------------------------------------------*/

@font-face {
  font-family: MadokaRunes;
  src: url(/w/resources/assets/fonts/runes.ttf?1335354297);
}

@font-face {
  font-family: MadokaMusical;
  src: url(/w/resources/assets/fonts/runesmusical.ttf?1335354297);
}


/* -------------------------------------------------------------
 * TODO table
 * -------------------------------------------------------------*/

table.todo {
  width: 100%;
}

table.todo td:first-child {
  width: 70px;
  text-align: center;
  font-weight: bold;
  font-size: 11px;
}

table.todo td:nth-child(2),
table.todo td:nth-child(3) {
  width: 70px;
  font-size: 11px;
  text-align: center;
}

table.todo td.waiting {
  background: #eee;
  font-weight: normal;
  color: #999;
}

table.todo td.working {
  background: #FFE5CC;
  color: #B44723;
}

table.todo td.working ~ td {
  background: #FFF9EF;
}

table.todo td.partial {
  background: #6E9591;
  color: #fff;
}

table.todo td.partial ~ td {
  background: #D9F2F5;
}

table.todo td.done {
  background: #3c3;
  color: #fff;
}

table.todo td.done ~ td {
  background: #E4FFE3;
}

/* -------------------------------------------------------------
 * Allow highlighting a section or similar target
 * ------------------------------------------------------------- */

.hilite-target:target {
  background-color: #ffa;
}

/* -------------------------------------------------------------
 * Inline spoilers tag
 * ------------------------------------------------------------- */

.inline-spoilers {
  /*background: #222;
  color: #222;*/
  background: white;
  color: white;
  border-bottom: 1px solid #b3b3b3;
  border-left:   1px solid #b3b3b3;
  border-right:  1px solid #b3b3b3;
  padding: 2px;
}

.inline-spoilers * {
  visibility: hidden;
}

.inline-spoilers:hover {
  color: inherit;
}

.inline-spoilers:hover * {
  visibility: inherit;
}

/* -------------------------------------------------------------
 * Tabbed interface
 * ------------------------------------------------------------- */

div.tabs {
  min-height:15em;
  position:relative;
  line-height:1;
  margin-top:1.5em;
  z-index:0;
}

div.tabs > div {
  display:inline;
  scroll-margin-top:1em;
}

div.tabs > div > a {
  color:#222;
  font-size:110%;
  font-weight:bold;
  text-decoration:none;
  background:linear-gradient(#ddd,#fff);
  padding:0.7em;
  border:0.1em outset #bbb;
  border-top-left-radius:0.5em;
  border-top-right-radius:0.5em;
  border-bottom:0.1em solid #fff
}

div.tabs > div:not(:target):not(.default) > a {
  border-bottom:none;
  background:#999;
}

div.tabs > div:target > a,
div.tabs > div.default > a {
  padding-bottom:0.154em;
  position:relative;
  z-index:1;
}

div.tabs > div > div {
  position:absolute;
  background:#fff;
  left:0;
  top:1.3em;
  bottom:0;
  right:0;
  overflow:auto;
  padding:0.3em;
  border:0.1em outset #bbb;
  border-top-right-radius:0em;
  border-top-right-radius:0.3em;
  border-bottom-left-radius:0.3em;
  border-bottom-right-radius:0.3em;
}

div.tabs > div:not(:target):not(.default) > div {
  z-index:-2;
}

div.tabs > div:target > div,
div.tabs > div.default > div {
  z-index:0;
}

div.tabs :target, div.tabs .default {
  outline:none;
}

/* -------------------------------------------------------------
 * HAXX
 * ------------------------------------------------------------- */

.pm-character-box-hack .mw-collapsible-toggle {
  margin-top: 30px;
  margin-right: 10px;
}