Template:LokiPage/base.css: Difference between revisions
Created page with "#loki-table { background-color: {{{page color}}}; border: 1px solid {{{page border}}}; border-radius: 7px; width: 100%; } #loki-table.skyline { padding: 5px; border-radius: revert; border: none; } #loki-table.headline { padding: 0; border-radius: revert; } .loki-table { {{ #switch: {{{page gradient|}}}|no=| background: linear-gradient(-80deg, rgba(128, 128, 128, .3), rgba(0, 0, 0, .3)); }} padding: 5px 5px 0; margin: 0px; } .loki-table.headlin..." |
Stripping text-shadow, CSS finally renders |
||
(17 intermediate revisions by the same user not shown) | |||
Line 1: | Line 1: | ||
<includeonly> | |||
{{#ifeq:{{{debug|0}}}|1| | |||
<table class="wikitable"> | |||
<tr> | |||
<td>page color</td><td>{{{page color|undefined}}}</td> | |||
</tr> | |||
<tr> | |||
<td>page border</td><td>{{{page border|undefined}}}</td> | |||
</tr> | |||
<tr> | |||
<td>cell color</td><td>{{{cell color|undefined}}}</td> | |||
</tr><tr> | |||
<td>cell text</td><td>{{{cell text|undefined}}}</td> | |||
</tr><tr> | |||
<td>link color</td><td>{{{link color|undefined}}}</td> | |||
</tr><tr> | |||
<td>header color</td><td>{{{header color|undefined}}}</td> | |||
</tr><tr> | |||
<td>header border</td><td>{{{header border|undefined}}}</td> | |||
</tr><tr> | |||
<td>header text</td><td>{{{header text|undefined}}}</td> | |||
</tr> | |||
</table> | |||
}} | |||
</includeonly> | |||
#loki-table { | #loki-table { | ||
background-color: {{{page color}}}; | background-color: {{{page color}}}; | ||
Line 5: | Line 31: | ||
width: 100%; | width: 100%; | ||
} | } | ||
#loki-table.skyline { | #loki-table.skyline { | ||
padding: 5px; | padding: 5px; | ||
Line 18: | Line 43: | ||
.loki-table { | .loki-table { | ||
padding: 5px 5px 0; | padding: 5px 5px 0; | ||
margin: 0px; | margin: 0px; | ||
Line 37: | Line 59: | ||
gap: 0; | gap: 0; | ||
} | } | ||
.loki-cell { | .loki-cell { | ||
border: 1px solid {{{cell border}}}; | border: 1px solid {{{cell border}}}; | ||
Line 98: | Line 119: | ||
width: 30%; | width: 30%; | ||
} | } | ||
.loki-cell-table { | .loki-cell-table { | ||
border-radius: 4px; | border-radius: 4px; | ||
color: {{{cell text}}}; | color: {{{cell text}}}; | ||
Line 124: | Line 141: | ||
padding: 5px 10px; | padding: 5px 10px; | ||
} | } | ||
.loki-cell a, .loki-cell a:visited, #content .loki-cell a.external, #content .loki-cell a.external:visited { | |||
.loki-cell a, .loki-cell a:visited, #content .loki-cell a.external, #content .loki-cell a.external:visited { color: {{{link color}}}; text-decoration: none; } | color: {{{link color}}}; | ||
.loki-cell a:hover, #content .loki-cell a.external:hover { color: {{{link hover}}}; text-decoration: none; } | text-decoration: none; | ||
} | |||
.loki-cell a:hover, #content .loki-cell a.external:hover { | |||
color: {{{link hover}}}; | |||
text-decoration: none; | |||
} | |||
.loki-cell a.new { color: #dd3333 } | .loki-cell a.new { color: #dd3333 } | ||
Line 139: | Line 160: | ||
text-align: center; | text-align: center; | ||
} | } | ||
.loki-header.headline { | .loki-header.headline { | ||
border-top: 1px solid #102f45; | border-top: 1px solid #102f45; | ||
Line 157: | Line 177: | ||
border: none; | border: none; | ||
} | } | ||
.loki-header.skyline { | .loki-header.skyline { | ||
font-family:Rock Salt; | font-family:Rock Salt; | ||
Line 168: | Line 187: | ||
border-bottom: 1px dashed #87CEFA; | border-bottom: 1px dashed #87CEFA; | ||
} | } | ||
#loki-table h2 { | #loki-table h2 { | ||
color: {{{header color}}}; | color: {{{header color}}}; | ||
Line 188: | Line 195: | ||
padding-right: 2em; | padding-right: 2em; | ||
text-align: right; | text-align: right; | ||
} | } | ||
<noinclude> | <noinclude> | ||
[[Category:Character Template]] | [[Category:Character Template]] | ||
</ | </noinclude> |
Latest revision as of 18:35, 21 April 2025
- loki-table {
background-color: {{{page color}}}; border: 1px solid {{{page border}}}; border-radius: 7px; width: 100%;
}
- loki-table.skyline {
padding: 5px; border-radius: revert; border: none;
}
- loki-table.headline {
padding: 0; border-radius: revert;
}
.loki-table {
padding: 5px 5px 0; margin: 0px;
}
.loki-table.headline {
padding: 0; background: none;
}
.loki-middle {
gap: 10px;
}
.loki-middle.headline {
gap: 0;
} .loki-cell {
border: 1px solid {{{cell border}}}; border-radius: 5px; background-color: {{{cell color}}}; margin-bottom: 0.5em; width: 100%; position: relative;
}
.loki-cell.queen {
text-align: left; vertical-align: top; padding: 10px; width: auto; border-radius: revert; border: none;
}
.loki-cell.skyline {
border: none; border-radius: revert; font-size:12pt;
}
.loki-cell.headline {
border: none; border-radius: revert; margin-bottom: 0;
}
.loki-cell.headline a {
color: #794D33;
}
.loki-cell-left {
vertical-align: top; width: 70%; padding-right: 5px;
}
.loki-cell-left.headline {
border-right: 1px dotted #102f45; padding: 0;
}
.loki-cell-top.skyline, .loki-cell-left.skyline, .loki-cell-right.skyline, .loki-cell-bottom.skyline {
border: 1px dashed #87CEFA; padding: 10px; margin-bottom: 0.5em; background-color: #000
}
.loki-cell-right.skyline {
border-radius: 20px;
}
.loki-cell-right {
vertical-align: top; width: 30%;
} .loki-cell-table {
border-radius: 4px; color: {{{cell text}}}; width: 100%;
}
.loki-cell-content {
color: {{{cell text}}};
}
.loki-cell-content.vintage {
padding: 0 10px;
}
.loki-cell-content.skyline {
padding: 1em 5px;
}
.loki-cell-content.headline {
font-family: Century Gothic, CenturyGothic, AppleGothic, sans-serif; padding: 5px 10px;
} .loki-cell a, .loki-cell a:visited, #content .loki-cell a.external, #content .loki-cell a.external:visited {
color: {{{link color}}}; text-decoration: none;
} .loki-cell a:hover, #content .loki-cell a.external:hover {
color: {{{link hover}}}; text-decoration: none;
} .loki-cell a.new { color: #dd3333 }
.loki-header {
background-color: {{{header color}}}; border-top-left-radius: 4px; border-top-right-radius: 4px; border: 1px solid {{{header border}}}; color: {{{header text}}}; font-weight: bold; text-align: center;
} .loki-header.headline {
border-top: 1px solid #102f45; border-bottom: 1px dotted #102f45; border-left: none; border-right: none; border-radius: revert; background: linear-gradient(to bottom, rgba(195, 210, 231, 1) 0%, rgba(195, 210, 231, 0.8) 33%, rgba(195, 210, 231, 0.65) 50%, rgba(195, 210, 231, 0.8) 67%, rgba(195, 210, 231, 1) 100%); font-size: 1.25em; font-family: Rockwell, Courier Bold, Courier, Georgia, Times, Times New Roman, serif; padding: 5px 0;
}
.loki-header.queen {
font-variant: small-caps; border-radius: revert; border: none;
} .loki-header.skyline {
font-family:Rock Salt; font-variant:small-caps; font-size:12pt; border-radius: revert; border-top: none; border-left: none; border-right: none; border-bottom: 1px dashed #87CEFA;
}
- loki-table h2 {
color: {{{header color}}}; font-family: Palatino Linotype, Book Antiqua, Palatino, serif; font-size: 125%; font-style: italic; font-weight: bold; padding-right: 2em; text-align: right;
}