Style:Infobox
.mixin-floating-box();
margin: 0 0 .5em 1em;
width: 250px;
padding: 0;
border-collapse: collapse;
position: relative;
&:has(.infobox-links) {
margin-bottom: 45px;
}
>.name,
>.type {
background-color: var(--infobox-bgcolor,#000);
color: var(--infobox-fgcolor,#fff);
font-weight: bold;
text-align: center;
a,a:link,a:visited,a:hover,a:active {
color: var(--infobox-fgcolor,#fff);
}
}
>.image {
background-color: var(--infobox-imagebgcolor,#fff);
display: flex;
justify-content: center;
flex-direction: column;
align-items: center;
}
>.website {
text-align: center;
font-size: smaller;
}
.pf2e-trait-container {
padding: 0.25em 0.5em 0;
}
>.table,
>.table .tabber__panel>.table {
display: grid;
grid-template-columns: auto 1fr;
>* {
padding: 0.25em 0.5em 0;
}
>.key {
font-weight: bold;
}
>.works-by {
text-align: center;
font-size: smaller;
font-weight: bold;
}
>.full-width {
grid-column-end: span 2;
}
>.no-padding {
padding: 0;
}
>.footnote,
>.source {
border-top: 1px solid @menu-border-color-thin;
text-align: right;
font-size: 80%;
margin: 0.5em;
padding: 0;
font-style: italic;
}
>.source+.footnote {
border-top: none;
margin-top: -.5em;
}
}
@media @min-small-width {
float: right;
clear: right;
}
@media not @min-small-width {
width: 90%;
margin-left: auto;
margin-right: auto;
}
/*bookmark like links below*/
>.infobox-links {
position: absolute;
width: 100%;
display: flex;
right: 0;
padding: 0 .2em;
box-sizing: border-box;
flex-direction: row-reverse;
gap: .5em;
>.infobox-link {
background-color: @background-color;
width: 35px;
height: 30px;
display: flex;
justify-content: center;
align-items: center;
font-size: 20px;
line-height: 16px;
position: relative;
img {
filter: drop-shadow(0 0 2px #fff8);
padding-left: 12px;
}
>a,
>a:visited,
>a:hover {
color: #cbc18f;
text-decoration: none;
}
.edition {
position: absolute;
left: 3px;
top: 7px;
font-family: serif;
font-size: 20px;
text-shadow: #000 0 0 1px;
}
&::after {
@svg: escape('<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 10 5"><path style="fill:@{background-color}" d="M 0,0 H 10 V 5 L 5,1 L 0,5 Z"/></svg>');
content: url('data:image/svg+xml,@{svg}');
position: absolute;
top:27px;
width: 100%;
font-size: 10px;
}
}
}
/*specifically only for book releases*/
.infobox-book-releases {
grid-column: span 2;
margin-bottom: .5rem;
>.infobox-book-releases-title {
font-weight: bold;
}
>.name {
margin-left: .75em;
}
>.table {
font-size: 90%;
margin-left: 1.5rem;
margin-top: -.2rem;
line-height: 120%;
display: grid;
grid-template-columns: 2.9rem 1fr;
}
}
/*if a semamtic infobox without any content is called this styles the resulting banner*/
&.no-content {
padding: 10px;
width: 80%;
float: none;
margin: auto;
font-weight: bold;
> .title {
font-size: 150%;
color: DarkRed;
}
> a.new {
display: inline-block;
padding: .2rem .4rem;
border: 1px solid #a2a9b1;
background-color: #f8f9fa;
color: #202122;
border-radius: 2px;
text-decoration: none;
}
}