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

Template:Sidebox/style.css: Difference between revisions

Template page
PenguinEncounter (talk | contribs)
m Add grid
PenguinEncounter (talk | contribs)
No edit summary
Line 13: Line 13:
}
}
.sidebox > .mw-collapsible > .mw-collapsible-toggle {
.sidebox > .mw-collapsible > .mw-collapsible-toggle {
grid-area: button;
display: block;
display: block;
float: none;
float: none;
Line 18: Line 19:
}
}
.sidebox > .mw-collapsible > .sidebox-header {
.sidebox > .mw-collapsible > .sidebox-header {
grid-area: headline;
padding: 10px;
padding: 10px;
}
}
.sidebox > .mw-collapsible > .sidebox-content {
.sidebox > .mw-collapsible > .sidebox-content {
grid-area: content;
padding: 10px;
padding: 10px;
background-color: var(--x-bg-2);
background-color: var(--x-bg-2);
}
}

Revision as of 23:12, 27 October 2024

.sidebox {
	display: grid;
	grid-template-columns: 1fr auto;
	grid-template-rows: auto 1fr;
	height: max-content;
	grid-template-areas: "headline button" "content content";
	float: right;
	padding: 0;
	width: 50vw;
	max-width: 400px;
	background-color: var(--x-bg);
	color: var(--x-color);
}
.sidebox > .mw-collapsible > .mw-collapsible-toggle {
	grid-area: button;
	display: block;
	float: none;
	margin-right: 10px;
}
.sidebox > .mw-collapsible > .sidebox-header {
	grid-area: headline;
	padding: 10px;
}
.sidebox > .mw-collapsible > .sidebox-content {
	grid-area: content;
	padding: 10px;
	background-color: var(--x-bg-2);
}