Toggle menu
Toggle preferences menu
Toggle personal menu
Not logged in
Your IP address will be publicly visible if you make any edits.

Template:Knowledge Base/styles.css: Difference between revisions

Template page
Updated General Info Images
No edit summary
(21 intermediate revisions by 2 users not shown)
Line 1: Line 1:
.mw-parser-output a.external::after {
.kb-container {
display: none !important;
display: block;
text-align: center;
}
}


.grid-container {
.console-image img {
display: grid;
max-width: 200px;
grid-template-columns: repeat(4, 1fr);
height: auto;
gap: 15px;
padding: 15px;
}
}


.grid-item {
@media screen and (min-width: 851px) {
text-align: left;
.kb-container {
}
display: grid;
b
grid-auto-columns: minmax(0, 1fr);
.grid-item h3 {
}
min-height: 50px;
display: flex;
.kb-console1 { grid-column: 1; }
align-items: end;
.kb-console2 { grid-column: 2; }
justify-content: left;
.kb-console3 { grid-column: 3; }
text-align: left;
.kb-console4 { grid-column: 4; }
flex-grow: 1;
font-size: 17px;
.kb-console1,
margin: 0 0 10px;
.kb-console2,
.kb-console3,
.kb-console4 {
border-right: 1px solid #a2a9b1;
}
.kb-console1 {
border-left: 1px solid #a2a9b1;
}
.console-header      { grid-row: 1; }
.console-image      {
grid-row: 2;
display: flex;
justify-content: center;
align-items: center;
}
.console-guide-link  { grid-row: 3; }
}
}


.grid-item .image-container {
@media screen and (min-width: 202px) and (max-width: 850px) {
width: 100%;
height: 180px;
.console-image img {
background-size: contain;
max-width: 100px;
background-repeat: no-repeat;
height: auto;
background-position: center;
}
}


@media (max-width: 1024px) {
.kb-container {
.grid-container {
display: grid;
grid-template-columns: repeat(3, 1fr);
grid-auto-columns: minmax(100px, 1fr);
}
}
}
 
.kb-console1 { grid-column: 1; }
@media (max-width: 600px) {
.kb-console2 { grid-column: 2; }
.grid-container {
.kb-console3 { grid-column: 3; }
grid-template-columns: repeat(2, 1fr);
.kb-console4 { grid-column: 4; }
.kb-console1,
.kb-console2,
.kb-console3,
.kb-console4 {
border-right: 1px solid #a2a9b1;
}
.kb-console1 {
border-left: 1px solid #a2a9b1;
}
.console-header      { grid-row: 1; }
.console-image      {
grid-row: 2;
display: flex;
justify-content: center;
align-items: center;
}
}
}
.console-guide-link  { grid-row: 3; }
 
.gameboy {
    background-image: url('https://hacksguidewiki.sfo3.digitaloceanspaces.com/hardwarewiki/Dmg.png');
}
 
.gameboy-pocket {
    background-image: url('https://hacksguidewiki.sfo3.digitaloceanspaces.com/hardwarewiki/Pocket.png');
}
 
.gameboy-color {
    background-image: url('https://hacksguidewiki.sfo3.digitaloceanspaces.com/hardwarewiki/Color.png');
}
 
.gameboy-advance {
    background-image: url('https://hacksguidewiki.sfo3.digitaloceanspaces.com/hardwarewiki/Advance.png');
}
 
.gameboy-advance-sp {
    background-image: url('https://upload.wikimedia.org/wikipedia/commons/0/0e/DefaultImage.png');
}
 
.gameboy-micro {
    background-image: url('https://upload.wikimedia.org/wikipedia/commons/0/0e/DefaultImage.png');
}
 
.nintendo-ds {
    background-image: url('https://upload.wikimedia.org/wikipedia/commons/0/0e/DefaultImage.png');
}
 
.nintendo-ds-lite {
    background-image: url('https://upload.wikimedia.org/wikipedia/commons/0/0e/DefaultImage.png');
}
 
.nintendo-dsi {
    background-image: url('https://hacksguidewiki.sfo3.digitaloceanspaces.com/hardwarewiki/Dsi.png');
}
 
.nintendo-dsi-xl {
    background-image: url('https://upload.wikimedia.org/wikipedia/commons/0/0e/DefaultImage.png');
}
 
.nintendo-3ds {
    background-image: url('https://upload.wikimedia.org/wikipedia/commons/0/0e/DefaultImage.png');
}
 
.nintendo-3ds-xl {
    background-image: url('https://upload.wikimedia.org/wikipedia/commons/0/0e/DefaultImage.png');
}
 
.nintendo-2ds {
    background-image: url('https://upload.wikimedia.org/wikipedia/commons/0/0e/DefaultImage.png');
}
 
.new-nintendo-3ds {
    background-image: url('https://upload.wikimedia.org/wikipedia/commons/0/0e/DefaultImage.png');
}
 
.new-nintendo-3ds-xl {
    background-image: url('https://upload.wikimedia.org/wikipedia/commons/0/0e/DefaultImage.png');
}
 
.new-nintendo-2ds-xl {
    background-image: url('https://upload.wikimedia.org/wikipedia/commons/0/0e/DefaultImage.png');
}
 
.nintendo-switch {
    background-image: url('https://upload.wikimedia.org/wikipedia/commons/0/0e/DefaultImage.png');
}
 
.nintendo-switch-lite {
    background-image: url('https://upload.wikimedia.org/wikipedia/commons/0/0e/DefaultImage.png');
}
 
.nintendo-switch-oled {
    background-image: url('https://upload.wikimedia.org/wikipedia/commons/0/0e/DefaultImage.png');
}
 
.atari-lynx {
    background-image: url('https://upload.wikimedia.org/wikipedia/commons/0/0e/DefaultImage.png');
}
 
.atari-lynx-ii {
    background-image: url('https://upload.wikimedia.org/wikipedia/commons/0/0e/DefaultImage.png');
}
 
.wonderswan {
    background-image: url('https://upload.wikimedia.org/wikipedia/commons/0/0e/DefaultImage.png');
}
 
.wonderswan-color {
    background-image: url('https://upload.wikimedia.org/wikipedia/commons/0/0e/DefaultImage.png');
}
 
.wonderswan-crystal {
    background-image: url('https://upload.wikimedia.org/wikipedia/commons/0/0e/DefaultImage.png');
}
 
.neo-geo-pocket {
    background-image: url('https://upload.wikimedia.org/wikipedia/commons/0/0e/DefaultImage.png');
}
 
.neo-geo-pocket-color {
    background-image: url('https://upload.wikimedia.org/wikipedia/commons/0/0e/DefaultImage.png');
}
 
.sega-game-gear {
    background-image: url('https://upload.wikimedia.org/wikipedia/commons/0/0e/DefaultImage.png');
}
 
.turboexpress {
    background-image: url('https://upload.wikimedia.org/wikipedia/commons/0/0e/DefaultImage.png');
}
 
.empty {
    background-image: url('https://upload.wikimedia.org/wikipedia/commons/0/0e/DefaultImage.png');
}
 
.toolrec {
    background-image: url('https://upload.wikimedia.org/wikipedia/commons/0/0e/DefaultImage.png');
}
 
.batteries {
    background-image: url('https://hacksguidewiki.sfo3.digitaloceanspaces.com/hardwarewiki/Battery-Icon.jpg');
}
 
.screws {
    background-image: url('https://hacksguidewiki.sfo3.digitaloceanspaces.com/hardwarewiki/Screws-Icon.jpg');
}
}

Revision as of 02:23, 16 March 2025

.kb-container {
	display: block;
	text-align: center;
}

.console-image img {
	max-width: 200px;
	height: auto;
}

@media screen and (min-width: 851px) {
	.kb-container {
		display: grid;
		grid-auto-columns: minmax(0, 1fr);
	}
	
	.kb-console1 { grid-column: 1; }
	.kb-console2 { grid-column: 2; }
	.kb-console3 { grid-column: 3; }
	.kb-console4 { grid-column: 4; }
	
	.kb-console1,
	.kb-console2, 
	.kb-console3,
	.kb-console4 {
		border-right: 1px solid #a2a9b1;
	}
	
	.kb-console1 {
		border-left: 1px solid #a2a9b1;
	}
	
	.console-header      { grid-row: 1; }
	.console-image       {
		grid-row: 2;
		display: flex;
		justify-content: center;
		align-items: center;
	}
	.console-guide-link  { grid-row: 3; }
}

@media screen and (min-width: 202px) and (max-width: 850px) {
	
	.console-image img {
		max-width: 100px;
		height: auto;
	}

	.kb-container {
		display: grid;
		grid-auto-columns: minmax(100px, 1fr);
	}
	
	.kb-console1 { grid-column: 1; }
	.kb-console2 { grid-column: 2; }
	.kb-console3 { grid-column: 3; }
	.kb-console4 { grid-column: 4; }
	
	.kb-console1,
	.kb-console2, 
	.kb-console3,
	.kb-console4 {
		border-right: 1px solid #a2a9b1;
	}
	
	.kb-console1 {
		border-left: 1px solid #a2a9b1;
	}
	
	.console-header      { grid-row: 1; }
	.console-image       {
		grid-row: 2;
		display: flex;
		justify-content: center;
		align-items: center;
	}
	.console-guide-link  { grid-row: 3; }
}