MediaWiki:Common.css

From Final Fantasy Hacktics Wiki
Revision as of 12:41, 31 July 2021 by Xifanie (talk | contribs)
Jump to navigation Jump to search

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.
/* CSS placed here will be applied to all skins */
.fftfont
{
	display: block;
	width: 20px;
	height: 28px;
	background-image: url('/font.png');
	background-repeat: no-repeat;
}

.noautonum .tocnumber { display: none; }

h1 { margin-top: 0.50em; }
h2 { margin-top: 0.45em; }
h3 { margin-top: 0.40em; }
h4 { margin-top: 0.35em; }
h5 { margin-top: 0.30em; }
h6 { margin-top: 0.25em; }

.map-table {
  margin:0 auto;
}
.map-screenshot-bev {
  position: absolute;
  z-index: -1;
  padding: 56px;
}
.map-screenshot-bev > img {
  transform: scale(200%) translate(25%, 25%); 
}
.map-row {
  height: 56px;
}
.map-cell {
  display: inline-block;
  float: left;
  font-size: 18px;
  font-family: Verdana;
  width: 56px;
  height: 56px;
  line-height: 56px;
  white-space: nowrap;
  outline-width: 2px;
  outline-offset: -2px;
  outline-color: #8E8A65;
  outline-style: dotted;
}
.map-cell.map-cell-number {
  background-color: #D1D6B3;
}
.map-cell-number {
  outline-style: solid;
}
.map-cell-empty {
  outline-width: 0;
}
.map-cell-grid {
  outline-color: #FFF;
  transition: background-color 250ms linear;
}
.map-cell-grid-data:hover {
  background-color: rgba(128,128,255,0.667);
}
.map-cell-grid-data.unwalkable:hover {
  background-color: rgba(255,0,0,0.667);
}
.map-cell-grid-data.unselectable:hover {
  background-color: rgba(0,0,0,0.667);
}
 

.angled-screenshots {
	display:flex;
	flex-direction: row;
	flex-wrap: wrap;
	justify-content: space-around;
	align-items: center;
	align-content: stretch;
	margin: 1em;
}

.angled-screenshot {
	position: relative;
	display: inline-block;
	background-color: #D1D6B3;
	border: 4px solid #8E8A65;
	margin: 1em;
}
.angled-screenshot span { 
	padding: 0.125em 0.5em;
	font-size: 24px;
  text-shadow: rgba(209, 214, 179, 0.9) 0.15em 0em 0.333em, rgba(209, 214, 179, 0.9) -0.143em -0.046em 0.333em, rgba(209, 214, 179, 0.9) 0.122em 0.087em 0.333em, rgba(209, 214, 179, 0.9) -0.09em -0.12em 0.333em, rgba(209, 214, 179, 0.9) 0.049em 0.142em 0.333em, rgba(209, 214, 179, 0.9) -0.003em -0.15em 0.333em;
}
.top-left {
	position: absolute;
	top: 0;
	left: 0;
}
.top-right {
	position: absolute;
	top: 0;
	right: 0;
}
.bottom-left {
	position: absolute;
	bottom: 0;
	left: 0;
}
.bottom-right {
	position: absolute;
	bottom: 0;
	right: 0;
}
.angled-screenshot-image img {
  padding: 8px;
}

.map-list {
	display: flex;
	flex-direction: row;
	flex-wrap: wrap;
	justify-content: space-around;
	align-items: baseline;
	align-content: space-around;
}

.map-list-entry {
  text-align: center;
  font-weight: bold;
  background-color: #D1D6B3;
  border: 2px solid #8E8A65;
  padding: 8px;
  margin: 1em;
}

.map-list-entry-name {
  display: block;
  text-align: center;
  margin-bottom: 8px
}