Difference between revisions of "MediaWiki:Common.css"
Jump to navigation
Jump to search
(14 intermediate revisions by the same user not shown) | |||
Line 23: | Line 23: | ||
.map-screenshot-bev { | .map-screenshot-bev { | ||
position: absolute; | position: absolute; | ||
+ | z-index: -1; | ||
padding: 56px; | padding: 56px; | ||
} | } | ||
Line 33: | Line 34: | ||
.map-cell { | .map-cell { | ||
display: inline-block; | display: inline-block; | ||
− | font-size: | + | float: left; |
+ | font-size: 18px; | ||
font-family: Verdana; | font-family: Verdana; | ||
width: 56px; | width: 56px; | ||
Line 41: | Line 43: | ||
outline-width: 2px; | outline-width: 2px; | ||
outline-offset: -2px; | outline-offset: -2px; | ||
− | outline-color: | + | outline-color: #8E8A65; |
outline-style: dotted; | outline-style: dotted; | ||
} | } | ||
.map-cell.map-cell-number { | .map-cell.map-cell-number { | ||
− | background-color: | + | background-color: #D1D6B3; |
+ | } | ||
+ | .map-cell-number { | ||
+ | outline-style: solid; | ||
+ | } | ||
+ | .map-cell-empty { | ||
+ | outline-width: 0; | ||
+ | } | ||
+ | .map-cell-grid { | ||
+ | outline-color: #D1D6B3; | ||
+ | transition: background-color 250ms linear; | ||
+ | color: #FFF; | ||
+ | text-shadow: rgba(0, 0, 0, 0.75) 0.05em 0em 0.15em, rgba(0, 0, 0, 0.75) -0.048em -0.015em 0.15em, rgba(0, 0, 0, 0.75) 0.041em 0.029em 0.15em, rgba(0, 0, 0, 0.75) -0.03em -0.04em 0.15em, rgba(0, 0, 0, 0.75) 0.016em 0.047em 0.15em, rgba(0, 0, 0, 0.75) -0.001em -0.05em 0.15em; | ||
+ | } | ||
+ | .map-cell-grid-data.low, .map-cell-grid-data.high { | ||
+ | height: 28px; | ||
+ | line-height: 28px; | ||
+ | } | ||
+ | .map-cell-grid:hover .map-cell-grid-data { | ||
+ | background-color: rgba(128,128,255,0.667); | ||
+ | } | ||
+ | .map-cell-grid:hover .map-cell-grid-data.unwalkable { | ||
+ | background-color: rgba(255,0,0,0.667); | ||
+ | } | ||
+ | .map-cell-grid:hover .map-cell-grid-data.unselectable { | ||
+ | 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 | ||
} | } |
Latest revision as of 14:12, 31 July 2021
/* 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: #D1D6B3; transition: background-color 250ms linear; color: #FFF; text-shadow: rgba(0, 0, 0, 0.75) 0.05em 0em 0.15em, rgba(0, 0, 0, 0.75) -0.048em -0.015em 0.15em, rgba(0, 0, 0, 0.75) 0.041em 0.029em 0.15em, rgba(0, 0, 0, 0.75) -0.03em -0.04em 0.15em, rgba(0, 0, 0, 0.75) 0.016em 0.047em 0.15em, rgba(0, 0, 0, 0.75) -0.001em -0.05em 0.15em; } .map-cell-grid-data.low, .map-cell-grid-data.high { height: 28px; line-height: 28px; } .map-cell-grid:hover .map-cell-grid-data { background-color: rgba(128,128,255,0.667); } .map-cell-grid:hover .map-cell-grid-data.unwalkable { background-color: rgba(255,0,0,0.667); } .map-cell-grid:hover .map-cell-grid-data.unselectable { 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 }