MediaWiki:Common.css: Difference between revisions

← Older edit Newer edit →

@@ Line 649: / Line 649: @@
          width: 25%;
      }
+}
+/* === Layout === */
+.main-banner {
+  text-align: center;
+  padding: 1em;
+  background-color: #333;
+  color: red;
+}
+.banner-title {
+  font-size: 2em;
+  margin-top: 0.5em;
+}
+.search-area {
+  text-align: center;
+  background: #222;
+  padding: 0.5em;
+  margin-top: 1em;
+  color: white;
+}
+.intro-text {
+  max-width: 800px;
+  margin: 1em auto;
+  text-align: center;
+  color: white;
+}
+/* Info Boxes Row */
+.info-row {
+  display: flex;
+  flex-wrap: wrap;
+  justify-content: space-between;
+  gap: 1em;
+  margin: 2em auto;
+  max-width: 1000px;
+}
+.info-box {
+  flex: 1 1 300px;
+  background: #444;
+  color: white;
+  padding: 1em;
+}
+/* Lower section */
+.lower-row {
+  display: flex;
+  flex-wrap: wrap-reverse;
+  justify-content: space-between;
+  margin: 2em auto;
+  max-width: 1000px;
+  gap: 2em;
+}
+/* About box should appear first on small screens */
+.about-box {
+  flex: 1 1 250px;
+  background: #333;
+  color: white;
+  padding: 1em;
+  order: -1; /* Makes it appear first when wrapped */
+}
+/* Grid of links */
+.link-grid {
+  flex: 3 1 600px;
+  display: flex;
+  flex-wrap: wrap;
+  gap: 1em;
+}
+.link-tile {
+  flex: 1 1 120px;
+  background: #222;
+  color: white;
+  padding: 1em;
+  text-align: center;
+  min-width: 100px;
+}
+/* === Responsive tweaks === */
+@media (max-width: 768px) {
+  .info-row {
+    flex-direction: column;
+  }
+  .info-box {
+    flex: 1 1 auto;
+  }
+  .lower-row {
+    flex-direction: column;
+  }
 }