Jump to content

MediaWiki:Common.css

From Once Human Guide
Revision as of 23:38, 28 February 2026 by Thisisme (talk | contribs)

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.
/* CSS placed here will be applied to all skins */
.navimg img {
    display: block;
    margin: 0 auto;
}

.main-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 40px; /* SAME spacing between rows */
    text-align: center;
    margin-top: 40px;
}

.main-card img {
    display: block;
    margin: 0 auto 15px auto; /* Controls space under image */
}

.card-title {
    font-size: 20px;
    font-weight: bold;
}

.navtable{
  border: none;
  text-align: center;
  margin: 0 auto;
  border-collapse: collapse;
}

.navcell{
  padding: 0 26px 18px 26px; /* keeps the row tight */
  vertical-align: top;
}

.navimg img{
  display:block;
  margin:0 auto;
}

/* FIX: equal box height so none of the 4 “drops” */
.navicon{
  display:flex;
  align-items:flex-end;   /* bottom-align icons in the row */
  justify-content:center;
  width: 210px;           /* keeps each column consistent */
}

.navicon--row1{
  height: 160px;          /* uniform row-1 height */
}

.navicon--row2{
  height: 210px;          /* uniform row-2 height */
}

/* label directly under the photo */
.navlabel{
  margin-top: 8px;
  line-height: 1.05;
  font-weight: 800;
}

.navlabel--tight{
  margin-top: 4px;        /* tighter for row 1 like you want */
}

.navicon--empty,
.navlabel--empty{
  visibility:hidden;
}
/* keeps each icon+label spacing consistent */
.navcell{
  padding: 0 22px;
  vertical-align: top;
}

/* remove baseline weirdness + center images */
.navimg img{
  display:block;
  margin:0 auto;
}

/* consistent gap between image and label */
.navlabel{
  margin-top: 10px;
  line-height: 1.1;
  font-weight: 700;
}

/* center the 3-item second row */
.navrow3{
  display:flex;
  justify-content:center;
  gap: 70px;
}

.navitem{
  text-align:center;
}


.navtable{
  border: none;
  text-align: center;
  margin: 0 auto;
  border-collapse: collapse;
}

.navcell{
  padding: 0 26px 18px 26px; /* keeps the row tight */
  vertical-align: top;
}

.navimg img{
  display:block;
  margin:0 auto;
}

/* FIX: equal box height so none of the 4 “drops” */
.navicon{
  display:flex;
  align-items:flex-end;   /* bottom-align icons in the row */
  justify-content:center;
  width: 210px;           /* keeps each column consistent */
}

.navicon--row1{
  height: 160px;          /* uniform row-1 height */
}

.navicon--row2{
  height: 210px;          /* uniform row-2 height */
}

/* label directly under the photo */
.navlabel{
  margin-top: 8px;
  line-height: 1.05;
  font-weight: 800;
}

.navlabel--tight{
  margin-top: 4px;        /* tighter for row 1 like you want */
}

.navicon--empty,
.navlabel--empty{
  visibility:hidden;
}