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)
add some space
 
(3 intermediate revisions by the same user not shown)
Line 1: Line 1:
.sidebox {
.sidebox {
float: right;
padding: 0;
box-sizing: border-box;
width: 100%;
max-width: 400px;
background-color: var(--x-bg);
color: var(--x-color);
margin: 10px;
}
.sidebox > .mw-collapsible {
display: grid;
display: grid;
grid-template-columns: 1fr auto;
grid-template-columns: 1fr auto;
Line 5: Line 15:
height: max-content;
height: max-content;
grid-template-areas: "headline button" "content 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 {
.sidebox > .mw-collapsible > .mw-collapsible-toggle {
grid-area: button;
display: block;
display: block;
float: none;
float: none;
Line 18: Line 23:
}
}
.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);
}
.sidebox .sidebox-content p {
margin: 0;
}
}

Latest revision as of 01:19, 29 October 2024

.sidebox {
	float: right;
	padding: 0;
	box-sizing: border-box;
	width: 100%;
	max-width: 400px;
	background-color: var(--x-bg);
	color: var(--x-color);
	margin: 10px;
}
.sidebox > .mw-collapsible {
	display: grid;
	grid-template-columns: 1fr auto;
	grid-template-rows: auto 1fr;
	height: max-content;
	grid-template-areas: "headline button" "content content";
}
.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);
}

.sidebox .sidebox-content p {
	margin: 0;
}