MediaWiki:Common.css: Difference between revisions

Newer edit →

@@ Line 1: / Line 1: @@
-/* CSS placed here will be applied to all skins */
+* {
+    box-sizing: border-box;
+}
+/* 1.40 vectore */
+.vector-menu-tabs .mw-list-item.vector-tab-noicon a {
+    border-bottom: none;
+    margin-top: 20px;
+}
+.vector-page-titlebar::after {
+    height: 0;
+}
+.vector-page-toolbar-container {
+	box-shadow: none;
+}
+/* For portals, added 2011-12-07 -bv
+   On wide screens, show these as two columns
+   On narrow and mobile screens, let them collapse into a single column */
+.mainpage-portals {
+	float: right;
+	width: 12.5%;
+	margin: 12px auto;
+}
+.portal-container-2 {
+	display: grid;
+	grid-gap: 15px;
+	grid-template-columns: repeat(2, auto);
+	grid-template-rows: auto;
+	width: 100%
+}
+.portal-container-3 {
+	display: grid;
+	grid-gap: 15px;
+	grid-template-columns: repeat(3, auto);
+	grid-template-rows: auto;
+	width: 100%
+}
+.portal-container-4 {
+	display: grid;
+	grid-gap: 15px;
+	grid-template-columns: repeat(4, auto);
+	grid-template-rows: auto;
+	width: 100%
+}
+.portal-container-5 {
+	display: grid;
+	grid-gap: 15px;
+	grid-template-columns: repeat(5, auto);
+	grid-template-rows: auto;
+	width: 100%
+}
+.portal-container-6 {
+	display: grid;
+	grid-gap: 15px;
+	grid-template-columns: repeat(6, auto);
+	grid-template-rows: auto;
+	width: 100%
+}
+.portal-container-7 {
+	display: grid;
+	grid-gap: 15px;
+	grid-template-columns: repeat(7, auto);
+	grid-template-rows: auto;
+	width: 100%
+}
+.portal-column-2-3 {
+	grid-column-end: span 2;
+}
+.portal-column-3-4 {
+	grid-column-end: span 3;
+}
+.portal-column-1-2,
+.portal-column-1-3,
+.portal-column-1-4,
+.portal-column-1-5,
+.portal-column-1-6,
+.portal-column-1-7 {
+	grid-column-end: span 1;
+}
+.portal-column-2-2 {
+	grid-column-end: span 2;
+}
+.portal-column-3-3 {
+	grid-column-end: span 3;
+}
+.portal-column-4-4 {
+	grid-column-end: span 4;
+}
+.portal-column-5-5 {
+	grid-column-end: span 5;
+}
+.portal-column-6-6 {
+	grid-column-end: span 6;
+}
+.portal-column-7-7 {
+	grid-column-end: span 7;
+}
+@media only screen and (max-width: 700px) {
+	.mainpage-portals {
+		width: 25%;
+	}
+    /* Decouple the columns on narrow screens */
+    .portal-container-2,
+    .portal-container-3,
+    .portal-container-4,
+    .portal-container-5,
+    .portal-container-6,
+    .portal-container-7 {
+		display: block;
+	}
+    .portal-column-1-2,
+    .portal-column-3-4,
+    .portal-column-1-3,
+    .portal-column-2-3,
+    .portal-column-2-2,
+    .portal-column-3-3,
+	.portal-column-4-4,
+	.portal-column-5-5,
+	.portal-column-6-6,
+	.portal-column-7-7 {
+        flo at: inherit;
+        wid th: 100%;
+        margin-top: 16px;
+        display: block !important;
+        text-align: center;
+    }
+    .portal-column-1-4 {
+		wid th: calc(50% - 16px);
+    }
+    .portal-column-1-6 {
+		wid th: calc(33.3% - 16px);
+    }
+    .portal-column-1-7 {
+	flo at: right;
+	wid th: calc(25% - 16px);
+    }
+}
+@media only screen and (max-width: 600px) {
+    .portal-column-1-4,
+    .portal-column-1-6,
+    .portal-column-1-5 {
+        float: inherit;
+        width: 100%;
+        margin: 0;
+        display: block !important;
+        text-align: center;
+    }
+}
 .mw-body h1, .mw-body h2, .mw-body h3, .mw-body h4, .mw-body #firstHeading,
 .mw-body .mw-editsection, .mw-body .mw-editsection-like,