More actions
Note: After publishing, 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 / Edge: Hold Ctrl while clicking Refresh, or press Ctrl-F5
- Opera: Press Ctrl-F5.
/* From https://starcitizen.tools/Module:Infobox/styles.css Licenced under Creative Commons Attribution-ShareAlike license. */ .infobox { /* In case if tooltips go out of boundary */ overflow: visible; width: 100%; max-width: 400px; margin-top: 0; margin-bottom: var( --space-md ); background: var( --color-surface-2 ); border-radius: var( --border-radius--medium ); border-spacing: 0; font-size: 0.875rem; text-align: left; display: block; } /* Table elements */ .infobox tbody { display: flex; flex-wrap: wrap; } .infobox tr { display: flex; box-sizing: border-box; flex-direction: column; padding: 0 10px; margin-top: 10px; } .infobox th, .infobox td { padding: 0 5px; } /* Infobox column */ .infobox .infobox-nocol { width: 100%; flex-direction: row; } .infobox .infobox-nocol th { width: 30%; } .infobox .infobox-nocol td { width: 70%; } .infobox .infobox-col1 { width: 100%; } .infobox .infobox-col2 { width: 50%; } .infobox .infobox-col3 { width: calc( 100% / 3 ); } .infobox .infobox-col4 { width: 25%; } .infobox-data { min-width: 25%; } /* Infobox image */ .infobox .infobox-image { overflow: hidden; padding: 0; margin-top: 0; border-radius: var( --border-radius--medium ) var( --border-radius--medium ) 0 0; } .infobox-image td { padding: 0; } .infobox-image--light .image { background: #eaecf0; } .infobox-image--dark .image { background: #2b2f36; } .infobox-image .image:hover img { transform: scale( 1.1 ); } .infobox-image img { display: block; max-width: 100%; background: var( --background-color-quiet--hover ); } /* Neutral background for all transprent SVG */ .infobox-image img[ src$='.svg' ] { background: #eaecf0; } /* Infobox title */ .infobox .infobox-title { width: 100%; margin-top: 20px; margin-bottom: 5px; color: var( --color-base--emphasized ); font-size: var( --font-size-h3 ); line-height: var( --line-height-xs ); } /* Infobox indicator */ .infobox .infobox-indicator { margin-top: 0; padding: 0; } /* Infobox subtitle */ .infobox .infobox-subtitle { /* Cancel infobox-title bottom margin */ margin-top: -5px; margin-bottom: 5px; } .infobox .infobox-indicator th, .infobox .infobox-subtitle th { display: none; } /* Infobox header */ .infobox .infobox-header { width: 100%; padding-top: 15px; border-top: 1px solid; border-color: var( --border-color-base ); margin-top: 15px; color: var( --color-base--emphasized ); line-height: var( --line-height-xs ); font-size: 1rem; } /* Infobox value */ .infobox-data th { color: var( --color-base--subtle ); font-size: 0.8125rem; font-weight: normal; letter-spacing: 0.75px; } .infobox-data td { font-weight: 600; } .infobox-data ul, .infobox-data ol { margin-top: 0; } /* Infobox button */ .infobox .infobox-button-bar { width: 100%; padding: 0; margin-top: 25px; text-align: center; } .infobox-button-bar th { padding: 0; } /* Collapsible toggle */ .infobox tr:first-of-type .mw-collapsible-toggle { position: relative; display: none; float: none; } .infobox tr:first-of-type .mw-collapsible-toggle .mw-collapsible-text { position: absolute; right: 0; display: block; padding: 5px 15px; background: var( --color-destructive ); border-radius: 0 var( --border-radius--medium ); color: #fff; } .infobox tr:first-of-type .mw-collapsible-toggle .mw-collapsible-text:hover { background: var( --color-destructive--hover ); } .infobox tr:first-of-type .mw-collapsible-toggle .mw-collapsible-text:active { background: var( --color-destructive--active ); } .infobox tr:first-of-type .mw-collapsible-toggle-collapsed .mw-collapsible-text { background: var( --color-primary ); } .infobox tr:first-of-type .mw-collapsible-toggle-collapsed .mw-collapsible-text:hover { background: var( --color-primary--hover ); } .infobox tr:first-of-type .mw-collapsible-toggle-collapsed .mw-collapsible-text:active { background: var( --color-primary--active ); } .infobox tr:first-of-type .mw-collapsible-toggle:before, .infobox tr:first-of-type .mw-collapsible-toggle:after { content: none; } @media only screen and ( max-width: 720px ) { .infobox { margin-right: auto; margin-left: auto; } .infobox tr:first-of-type .mw-collapsible-toggle { display: block; } }