User:Mr Pie 5/common.css

From Official Temtem Wiki
Jump to navigation Jump to search

In other languages: EspañolFrançais


CSS and Javascript changes must comply with the wiki design rules.


Note: After saving, 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)
  • Internet Explorer: Hold Ctrl while clicking Refresh, or press Ctrl-F5
  • Opera: Go to Menu → Settings (Opera → Preferences on a Mac) and then to Privacy & security → Clear browsing data → Cached images and files.
/* image */
#koish-randomizer,
#koish-randomizer .body,
#koish-randomizer .parts-container {
  display:inline-block;
}

#koish-randomizer .parts-container {
  position:relative;
}

#koish-randomizer .overlays * {
  width:100%;
  height:100%;
  position:absolute;
  top:0;
  left:0;
}

#koish-randomizer p {
  margin:0;
}

#koish-randomizer .body {
  z-index:1;
}

#koish-randomizer .body-segments {
  z-index:2;
}

#koish-randomizer .body-segment > *{
  -webkit-mask-size:100%;
  mask-size:100%;
  -webkit-mask-position:center;
  mask-position:center;
}

#koish-randomizer .body-segment.front .base {
  -webkit-mask-image:url(/images/e/ef/M143_S1-C.png);
  mask-image:url(/images/e/ef/M143_S1-C.png); /* [[File:M143_S1-C.png]] */
}

#koish-randomizer .body-segment.front .shadow {
  -webkit-mask-image:url(/images/6/61/M143_S1-S.png);
  mask-image:url(/images/6/61/M143_S1-S.png); /* [[File:M143_S1-S.png]] */
}

#koish-randomizer .body-segment.mid .base {
  -webkit-mask-image:url(/images/5/52/M143_S2-C.png);
  mask-image:url(/images/5/52/M143_S2-C.png); /* [[File:M143_S2-C.png]] */
}

#koish-randomizer .body-segment.mid .shadow {
  -webkit-mask-image:url(/images/e/ec/M143_S2-S.png);
  mask-image:url(/images/e/ec/M143_S2-S.png); /* [[File:M143_S2-S.png]] */
}

#koish-randomizer .body-segment.back .base {
  -webkit-mask-image:url(/images/d/de/M143_S3-C.png);
  mask-image:url(/images/d/de/M143_S3-C.png); /* [[File:M143_S3-C.png]] */
}

#koish-randomizer .body-segment.back .shadow {
  -webkit-mask-image:url(/images/1/1d/M143_S3-S.png);
  mask-image:url(/images/1/1d/M143_S3-S.png); /* [[File:M143_S3-S.png]] */
}

#koish-randomizer .shadow {
  z-index:1;
}

#koish-randomizer .fins,
#koish-randomizer .whiskers {
  z-index:2;
}

/* interface */

#koish-randomizer label {
  padding:0 10px 0 5px;
}

#koish-randomizer fieldset > div {
  margin:5px 0;
}

.color-dropdown {
  display:none;
}

.color-dropdown-container {
  display:flex;
  flex-flow:row nowrap;
}

.custom-color-dropdown,
.custom-dropdown-display {
  flex:1 0 auto;
}

.custom-dropdown-display {
  position:relative;
}

.custom-color-dropdown {
  visibility:hidden;
  position:absolute;
  z-index:1;
  border:2px solid var(--wiki-content-border-color);
  width:100%;
  box-sizing:border-box;
}

.custom-color-dropdown > div {
  cursor:pointer;
}

.custom-dropdown-display:hover .custom-color-dropdown,
.custom-dropdown-display .custom-color-dropdown:hover {
  visibility:visible;
}