Plantilla:Infobox/common.css
De Inkipedia
/* Gobbler container */ .infobox-gobbler { display: flex; float: right; gap: 4px; } /* Game buttons */ .infobox-game-button-list { display: flex; flex-direction: column; gap: 4px; } .infobox-game-button { border: 2px solid; border-radius: 4px; padding: 2px; text-align: center; width: 1.5em; } /* Main interface */ .infobox { border-radius: 4px; border-style: solid; border-width: 4px 1px; display: inline-flex; flex-direction: column; padding: 4px; row-gap: 4px; width: 300px; } .infobox-title { border-radius: 4px; border-style: solid; border-width: 1px 4px; font-size: 1.5em; font-weight: bold; padding: 8px 0; text-align: center; } .infobox-image { align-self: center; } /* Data table */ .infobox-table { align-items: center; display: grid; gap: 4px; grid-template-columns: max-content auto; } .infobox-label { border-radius: 4px 0 0 4px; border-style: solid; border-width: 1px 0 1px 4px; font-weight: bold; padding: 4px; } /* Light mode colors */ .infobox { box-shadow: 0 0 16px #ffffff inset; } .infobox.s, .infobox-title.s, .infobox-label.s, .infobox-game-button.s { background: rgba(170, 220, 0, 0.6); border-color: #aadc00; } .infobox-label.s { background: linear-gradient(90deg, rgba(170, 220, 0, 0.6), transparent); } .infobox.s2, .infobox-title.s2, .infobox-label.s2, .infobox-game-button.s2 { background: rgba(240, 60, 120, 0.6); border-color: #f03c78; } .infobox-label.s2 { background: linear-gradient(90deg, rgba(240, 60, 120, 0.6), transparent); } .infobox.s3, .infobox-title.s3, .infobox-label.s3, .infobox-game-button.s3 { background: rgba(235, 238, 61, 0.6); border-color: #ebee3d; } .infobox-label.s3 { background: linear-gradient(90deg, rgba(235, 238, 61, 0.6), transparent); } /* Adjustments for smallest layout size */ @media (width < 850px) { /* Present the game button list on the top and center it */ .infobox-gobbler { align-items: center; flex-direction: column; } /* Position the infobox/gobbler in the center and do not float it */ .infobox, .infobox-gobbler { float: none; } .infobox-game-button-list { flex-direction: row; } }