/* Infobox button */
.infobox-button {
position: relative;
}
.infobox-extlink-button {
display: block;
padding: 10px 20px;
background: var( --color-primary );
border-radius: 0 0 12px 12px;
color: #fff;
}
.infobox-extlink-button-icon {
margin-right: 8px;
filter: invert( 1 );
}
/* Popup card */
.infobox-extlink-list {
position: absolute;
z-index: -1;
overflow: hidden;
width: 100%;
padding: 5px 0;
background: var( --color-surface-1 );
border-radius: var( --border-radius--medium );
box-shadow: var( --box-shadow-dialog );
opacity: 0;
text-align: left;
transition: transform 250ms ease, opacity 250ms ease;
visibility: hidden;
transform: translateY( -20px );
}
.infobox-extlink-list p {
margin-bottom: 0;
}
.infobox-button:hover .infobox-extlink-list {
z-index: 10;
opacity: 1;
visibility: visible;
transform: none;
}
.infobox-extlink-title {
display: block;
padding: 0 15px;
margin: 5px 0;
color: var( --color-base--subtle );
font-size: 0.8125rem;
font-weight: normal;
letter-spacing: 0.75px;
}
.infobox-extlink-list ul {
display: flex;
flex-wrap: wrap;
padding: 0 5px;
margin: 0 0 10px 0;
list-style: none;
}
.infobox-extlink a.external {
display: block;
/* Override external link and file icons */
padding: 5px 10px;
background-image: none;
border-radius: 4px;
transition: background 0.2s ease, color 0.2s ease;
}
.infobox-extlink a:hover {
background-color: var( --background-color-quiet--hover );
}
.infobox-extlink a:active {
background-color: var( --background-color-quiet--active );
}
.infobox-extlink-title:before {
position: absolute;
z-index: -1;
right: 20px;
display: block;
width: 120px;
height: 120px;
margin-top: 5px;
background-position: top right;
background-repeat: no-repeat;
background-size: contain;
opacity: 0.1;
}
.infobox-extlink-title-rsi:before {
/* TemplateStyles does not like internal link for some reason */
/*background-image: url("https://starcitizen.tools/images/4/40/RSItm.svg");*/
content: '';
}
.infobox-extlink-title-community:before {
/* TemplateStyles does not like internal link for some reason */
/*background-image: url("https://starcitizen.tools/images/3/3f/MadeByTheCommunity.svg");*/
content: '';
}
/* Dark mode */
html.skin-citizen-dark .infobox-extlink-title:before {
filter: invert( 1 );
}