MediaWiki:Common.css: Difference between revisions

Latest revision as of 23:02, 2 September 2026

/* CSS placed here will be applied to all skins */

```css
/* CHHHP Homepage */

.chhhp-home {
    max-width: 1200px;
    margin: 0 auto;
    padding: 30px 20px 60px;
    text-align: center;
}

.chhhp-wordmark {
    font-family: Georgia, serif;
    font-size: 42px;
    font-weight: bold;
    color: #111;
    margin-bottom: 8px;
}

.chhhp-tagline {
    font-size: 16px;
    color: #666;
    margin-bottom: 30px;
}

.chhhp-hub {
    display: grid;
    grid-template-columns: 240px 1fr 240px;
    align-items: center;
    gap: 30px;
    margin-bottom: 35px;
    gap: 10px;
    column-gap: 0px;
}

.chhhp-logo {
    text-align: center;
}

.chhhp-logo img {
    max-width: 100%;
    height: auto;
}

.chhhp-nav {
    display: flex;
    flex-direction: column;
    gap: 14px;
}

.chhhp-nav a {
    color: #3366cc !important;
    text-decoration: none;
    font-size: 18px;
    font-weight: 600;
    line-height: 1.4;
}

.chhhp-nav a:hover {
    text-decoration: underline;
    color: #447ff5 !important;
}

.chhhp-intro {
    max-width: 900px;
    margin: 0 auto 40px auto;
    font-size: 18px;
    line-height: 1.7;
}

.chhhp-featured {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 20px;
    margin-top: 30px;
}

.chhhp-card {
    background: #f8f9fa;
    border: 1px solid #d8dde3;
    border-radius: 6px;
    padding: 20px;
    text-align: left;
}

.chhhp-card h2 {
    margin-top: 0;
    border-bottom: 1px solid #d8dde3;
    padding-bottom: 10px;
    font-size: 1.3em;
}

.chhhp-card a {
    color: #3366cc;
    font-weight: bold;
    text-decoration: none;
}

.chhhp-card a:hover {
    text-decoration: underline;
}

@media (max-width: 1000px) {

    .chhhp-hub {
        grid-template-columns: 1fr;
    }

    .chhhp-nav {
        max-width: 400px;
        margin: 0 auto;
    }

    .chhhp-featured {
        grid-template-columns: 1fr;
    }

    .chhhp-wordmark {
        font-size: 32px;
    }
}
```

@@ Line 31: / Line 31: @@
      gap: 30px;
      margin-bottom: 35px;
+    gap: 10px;
+    column-gap: 0px;
+}
+.chhhp-logo {
+    text-align: center;
 }
@@ Line 41: / Line 47: @@
      display: flex;
      flex-direction: column;
-     gap: 12px;
+     gap: 14px;
 }
-.chhhp-button a {
+.chhhp-nav a {
-    display: block;
+     color: #3366cc !important;
-    padding: 14px 18px;
+     text-decoration: none;
-    background: #111;
+     font-size: 18px;
-     color: #fff !important;
-     text-decoration: none !important;
-     border-radius: 10px;
      font-weight: 600;
-     font-size: 16px;
+     line-height: 1.4;
-    border: 2px solid #111;
-    transition: all .2s ease;
-    box-shadow: 0 3px 8px rgba(0,0,0,.12);
-}
-.chhhp-button a:hover {
-    background: #c59d2f;
-    border-color: #c59d2f;
-    color: #000 !important;
-    transform: translateY(-2px);
-    box-shadow: 0 6px 16px rgba(0,0,0,.20);
 }
-.chhhp-search {
+.chhhp-nav a:hover {
-    margin: 30px 0;
+     text-decoration: underline;
-}
+     color: #447ff5 !important;
-.chhhp-search-form {
-     display: flex;
-    justify-content: center;
-     gap: 8px;
-    max-width: 650px;
-    margin: 0 auto;
-}
-.chhhp-search-input {
-    flex: 1;
-    padding: 14px 16px;
-    font-size: 17px;
-    border: 2px solid #111;
-    border-radius: 8px;
-    min-width: 300px;
-}
-.chhhp-search-button {
-    padding: 14px 24px;
-    font-size: 17px;
-    font-weight: bold;
-    background: #111;
-    color: white;
-    border: 2px solid #111;
-    border-radius: 8px;
-    cursor: pointer;
-    transition: all .2s ease;
-}
-.chhhp-search-button:hover {
-    background: #c59d2f;
-    color: #000;
-    border-color: #c59d2f;
 }
@@ Line 120: / Line 78: @@
 .chhhp-card {
-     background: #f8f8f8;
+     background: #f8f9fa;
-     border: 1px solid #ddd;
+     border: 1px solid #d8dde3;
-     border-radius: 12px;
+     border-radius: 6px;
      padding: 20px;
      text-align: left;
-    box-shadow: 0 2px 6px rgba(0,0,0,.05);
 }
 .chhhp-card h2 {
      margin-top: 0;
-     border-bottom: 1px solid #ddd;
+     border-bottom: 1px solid #d8dde3;
      padding-bottom: 10px;
+    font-size: 1.3em;
 }
 .chhhp-card a {
+    color: #3366cc;
      font-weight: bold;
+    text-decoration: none;
+}
+.chhhp-card a:hover {
+    text-decoration: underline;
 }
@@ Line 155: / Line 119: @@
      .chhhp-wordmark {
          font-size: 32px;
-    }
-    .chhhp-search-form {
-        flex-direction: column;
-    }
-    .chhhp-search-input {
-        min-width: auto;
      }
 }
 ```