MediaWiki:TemplatesShared.css

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.

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

/* -- infobox -- */
/* added width: 100% and fallback values on var() — edited by cauz */
.infobox {
  padding: 5px;
  margin: 20px 0 20px 0.6em;
  min-width: 15em;
  max-width: 20em;
  width: 100%; /* edited by cauz */
  font-family: Arial, sans-serif;
  float: right;
  clear: right;
}


.infobox-header {
  text-align: center;
  margin: 5px 0;
  padding: 5px;
  font-weight: bold;
}
.infobox-row {
    display: flex;
    padding: 0 3px;
    margin-bottom: 8px;
}

.infobox-label {
    flex: 1;
    font-weight: bold;
}

.infobox-value {
    flex: 1;
}

.infobox-section {
    margin-top: 10px;
}

.article-copyright img {
    width: 100px;
}

.NeartoDesktop .compass-table {
    width: 100%;
    margin: 0;
    text-align: center;
}

.NeartoDesktop .west-cell,
.NeartoDesktop .east-cell,
.NeartoDesktop .center-cell {
    width: 33%;
}

.NeartoDesktop .center-text {
    white-space: nowrap;
}

@media only screen and (min-width: 1001px) {
  .mobile-box {
    display: none;
  }
}

@media screen and (max-width: 600px) {
    .infobox {
        float: none !important;
        clear: both !important;
        display: block !important;
        width: 100% !important;
        max-width: 100% !important;
        margin: 1em 0 !important;
        box-sizing: border-box;
    }

    /* Make sure no surrounding text floats beside */
    .mw-parser-output > * {
        float: none !important;
        clear: both !important;
    }

}

@media screen and (max-width: 800px) {
    #mp-left, /* Corrected: Use commas to separate distinct IDs */
    #mp-right,
    #mp-upper {
        display: none !important; /* Added !important to ensure it overrides other rules */
    }
}

/* Shared Table Stuff */ 

.taerel-history-title-container {
  vertical-align: top;
  padding: 3px;
  margin-bottom: 1em; 
}

.taerel-history-title {
  height: 2.3em;
  text-align: center;
  font-weight: bold;
}

/* ========================= DESKTOP TABLE ========================= */
.taerel-history-table {
  width: 100%;
  border-collapse: collapse;
  margin-bottom: 1em;
}
.taerel-history-table th,
.taerel-history-table td {
  padding: 10px 12px;
  text-align: left;
  border-bottom: none;
}
.taerel-history-table th {
  font-weight: 600;
}

#mw-content-text > div.mw-content-ltr.mw-parser-output > div.taerel-history-wrapper > div.mw-collapsible.mw-made-collapsible {
margin-top: -2.64em;
margin-bottom: 3em;
}

.taerel-history-table th,
.taerel-history-table td {
  border-bottom: none; 
}

/* ========================= MOBILE ========================= */
@media screen and (max-width: 900px) {
  .taerel-history-table {
    display: block;
    width: 100%;
  }
  .taerel-history-table thead {
    display: block;
  }
  .taerel-history-table thead tr {
    display: block;
    padding: 14px 16px;
    margin-bottom: 8px;
  }
  .taerel-history-table thead th:first-child {
    display: block;
    font-weight: 600;
  }
  .taerel-history-table thead th:not(:first-child) {
    display: none;
  }
  .taerel-history-table tbody {
    display: block;
  }
  .taerel-history-table tr {
    display: block;
    width: 100%;
    margin-bottom: 16px;
    overflow: hidden;
    box-sizing: border-box;
  }
  .taerel-history-table td:first-child {
    display: block;
    width: 100%;
    padding: 14px 16px;
    font-weight: 600;
    box-sizing: border-box;
  }
  .taerel-history-table td:not(:first-child) {
    display: flex;
    align-items: flex-start;
    gap: 1em;
    padding: 12px 16px;
    box-sizing: border-box;
    word-break: break-word;
  }
  .taerel-history-table td:not(:first-child)::before {
    content: attr(data-label);
    font-weight: 600;
    flex-shrink: 0;
  }

.taerel-history-table th {
  display: none;
}
.taerel-history-table td:nth-of-type(1)::before {
display:none;
}

}
    .taerel-history-table td:last-child
 {
        padding-left: 1em !important;
        padding-top: 1em !important;
    }
}

/* -- infobox -- */
/* added width: 100% and fallback values on var() — edited by cauz */
.infobox {
  padding: 5px;
  margin: 20px 0 20px 0.6em;
  min-width: 15em;
  max-width: 20em;
  width: 100%; /* edited by cauz */
  font-family: Arial, sans-serif;
  float: right;
  clear: right;
}

.infobox-header {
  text-align: center;
  margin: 5px 0;
  padding: 5px;
  font-weight: bold;
}

/* -- article copyright -- */
.article-copyright {
  margin-bottom: 0.5em;
  margin-top: 10px;
  padding: 0 5px;
}

/* -- compass (desktop only, inside .NeartoDesktop) -- */
.NeartoDesktop .compass-container {
  display: block;
  margin: 0 5px;
  padding: 5px;
}

.NeartoDesktop .compass-header {
  padding: 0 5px;
  text-align: center;
}

/* -- mobile box -- */
.mobile-box {
  padding: 5px;
  margin-bottom: 10px;
  text-align: center;
}

.mobile-header {
  margin: 3px;
  text-align: center;
}

/* -- main page columns -- */
#mp-upper {
  width: 100%;
  padding: 8px;
}

#mp-left,
#mp-right {
  vertical-align: top;
  padding: 8px;
}

#mp-left  { width: 50%; }
#mp-right { width: 49%; }

#mp-left  .mp-h2,
#mp-right .mp-h2 {
  margin: 5px 0;
  padding: 0 5px;
  text-align: center;
}