MediaWiki:Common.css: Difference between revisions

← Older edit

@@ Line 656: / Line 656: @@
 /* === Main Page Layout (scoped) === */
 .mainpage-wrapper .main-banner {
-  text-align: center;
+    text-align: center;
-  padding: 0.25em;
-}
-.mainpage-wrapper .banner-title {
-  font-size: 2em;
 }
 .mainpage-wrapper .search-area {
-	padding: 0.1em 0.25em;
      border-radius: var(--border-radius-base);
      cursor: pointer;
@@ Line 677: / Line 672: @@
 .mainpage-wrapper .intro-text {
-  text-align: center;
+    text-align: center;
-  padding: 0.25em;
 }
 .mainpage-wrapper .info-row {
-  display: flex;
+    display: flex;
-  gap: 1em;
+    gap: 1em;
+    margin: 1em;
 }
 .mainpage-wrapper .info-box {
    flex: 1 1 32%;
-  padding: 0.25em;
    display: flex;
    flex-direction: column;
+  margin: 0 !important;
 }
@@ Line 698: / Line 693: @@
 }
-.mainpage-wrapper .info-box pre {
+.mainpage-wrapper .info-box,.about-box,.intro-text,.search-area{
-  flex: 1 1 auto;
+	color: var(--color-emphasized);
-  margin: 0;
+    background-color: var(--color-surface-2);
-  padding: 0.25em;
+    border: var(--border-width-base) solid var(--border-color-base);
-  box-sizing: border-box;
+    overflow: auto;
+    border-radius: var(--border-radius-large);
+    padding: 1em;
+    margin: 1em;
+}
+/* The banner box */
+.main-banner {
+    position: relative;
+    height: 450px;
+    max-width: 2440px;          /* stop growing beyond image width */
+    margin: 1em auto;           /* centre the container */
+    overflow: hidden;           /* crop sides */
+    background-color: var(--color-surface-2);
+    border: var(--border-width-base) solid var(--border-color-base);
+    border-radius: var(--border-radius-large);
+    color: var(--color-emphasized);
+    padding: 0;
+}
+/* centre ANY img inside (not just mw-file-element) */
+.main-banner img {
+    position: absolute;
+    top: 0;
+    left: 50%;
+    transform: translateX(-50%);
+    height: 100%;
+    width: auto;
+    max-width: none;
 }
+.main-banner > a { display:block; height:100%; }
 .mainpage-wrapper .lower-row {
-  display: flex;
+	display: flex;
-  gap: 0.25em;
+    gap: 1em;
+    margin: 1em;
 }
 .mainpage-wrapper .about-box {
-     flex: 1 1 32%;
+     flex: 1 1 31.3%;
-     padding: 0.25em;
+     margin: 0 !important;
 }
 .mainpage-wrapper .link-grid {
-	display: flex;
+    display: flex;
      flex-wrap: wrap;
-     gap: 1em;
+     gap: 0.5em;
      flex: 1 1 65%;
-    padding: 0.25em;
-    padding-top: 0.5em;
      justify-content: center;
 }
@@ Line 778: / Line 804: @@
    text-decoration: underline;
 }
 /* === Mobile responsiveness === */
@@ Line 792: / Line 817: @@
      flex-direction: column;
    }
+}
+.github-badge-row {
+    display: flex;
+    flex-direction: row;
+    align-items: center;
+    gap: 1em;
+}
+.github-badge-title {
+  white-space: nowrap;
+}
+/* Light mode (default) */
+.patreon-logo-dark {
+  display: none;
+}
+.patreon-logo-light {
+  display: inline;
+}
+/* Dark mode (activated via root class) */
+:root.skin-theme-clientpref-night .patreon-logo-light {
+  display: none;
+}
+:root.skin-theme-clientpref-night .patreon-logo-dark {
+  display: inline;
 }