|
|
| (15 intermediate revisions by the same user not shown) |
| Line 1: |
Line 1: |
| /* ===================================================
| | a.external { |
| HymnRO Wiki - Cathedral Theme (Legacy Vector)
| | background: none !important; |
| =================================================== */
| | padding-right: 0 !important; |
| | |
| /* === GLOBAL BACKGROUND === */
| |
| body {
| |
| background: url('/wiki/images/b/b5/Banner.jpg') no-repeat center top fixed;
| |
| background-size: cover;
| |
| }
| |
| | |
| /* Regular pages use different background */
| |
| body:not(.page-Main_Page) {
| |
| background: linear-gradient(to bottom, rgba(20, 30, 50, 0.95), rgba(10, 15, 30, 0.98)),
| |
| url('/wiki/images/1/1f/Background.jpg') no-repeat center center fixed;
| |
| background-size: cover;
| |
| }
| |
| | |
| /* === COLOR VARIABLES === */
| |
| :root {
| |
| --gold: #E8C49B;
| |
| --gold-dark: #C9A46D;
| |
| --gold-light: #F5DFC5;
| |
| --dark-bg: rgba(20, 28, 46, 0.85);
| |
| --darker-bg: rgba(10, 15, 30, 0.95);
| |
| }
| |
| | |
| /* === MAIN CONTENT AREA === */
| |
| #content {
| |
| background: rgba(20, 28, 46, 0.7) !important;
| |
| backdrop-filter: blur(10px);
| |
| -webkit-backdrop-filter: blur(10px);
| |
| border: 1px solid rgba(232, 196, 155, 0.2) !important;
| |
| border-radius: 8px;
| |
| color: rgba(255, 255, 255, 0.9);
| |
| }
| |
| | |
| #bodyContent {
| |
| background: transparent !important;
| |
| }
| |
| | |
| /* === LEFT SIDEBAR (Navigation) === */
| |
| #mw-panel {
| |
| background: rgba(20, 28, 46, 0.7) !important;
| |
| backdrop-filter: blur(10px);
| |
| -webkit-backdrop-filter: blur(10px);
| |
| padding: 10px;
| |
| border-radius: 0 8px 8px 0;
| |
| border-right: 1px solid rgba(232, 196, 155, 0.2);
| |
| }
| |
| | |
| #mw-panel .portal {
| |
| background: transparent !important;
| |
| margin: 0 0 15px 0;
| |
| }
| |
| | |
| #mw-panel .portal h3 {
| |
| color: var(--gold) !important;
| |
| font-weight: 600;
| |
| border-bottom: 1px solid rgba(232, 196, 155, 0.3);
| |
| padding-bottom: 5px;
| |
| margin-bottom: 10px;
| |
| }
| |
| | |
| #mw-panel .portal .body {
| |
| background: transparent !important;
| |
| }
| |
| | |
| #mw-panel .portal .body ul {
| |
| list-style: none;
| |
| padding: 0;
| |
| margin: 0;
| |
| }
| |
| | |
| #mw-panel .portal .body li {
| |
| margin: 5px 0;
| |
| }
| |
| | |
| #mw-panel .portal .body a {
| |
| color: rgba(255, 255, 255, 0.8) !important;
| |
| text-decoration: none;
| |
| }
| |
| | |
| #mw-panel .portal .body a:hover {
| |
| color: var(--gold) !important;
| |
| }
| |
| | |
| /* === TOP HEADER BAR === */
| |
| #mw-head-base {
| |
| background: rgba(15, 20, 35, 0.95) !important;
| |
| border-bottom: 1px solid rgba(232, 196, 155, 0.2);
| |
| }
| |
| | |
| #mw-head {
| |
| background: transparent;
| |
| }
| |
| | |
| /* Logo area */
| |
| #p-logo {
| |
| background: transparent !important;
| |
| }
| |
| | |
| /* Navigation tabs (Read, Edit, View history) */
| |
| #left-navigation,
| |
| #right-navigation {
| |
| background: transparent;
| |
| }
| |
| | |
| .vectorTabs {
| |
| background: transparent !important;
| |
| }
| |
| | |
| .vectorTabs ul {
| |
| background: transparent !important;
| |
| }
| |
| | |
| .vectorTabs li {
| |
| background: transparent !important;
| |
| }
| |
| | |
| .vectorTabs li a {
| |
| color: rgba(255, 255, 255, 0.8) !important;
| |
| background: transparent !important;
| |
| }
| |
| | |
| .vectorTabs li a:hover {
| |
| color: var(--gold) !important;
| |
| }
| |
| | |
| .vectorTabs li.selected a {
| |
| color: var(--gold) !important;
| |
| background: rgba(232, 196, 155, 0.1) !important;
| |
| }
| |
| | |
| /* More dropdown */
| |
| .vectorMenu h3 {
| |
| background: transparent !important;
| |
| color: rgba(255, 255, 255, 0.8) !important;
| |
| }
| |
| | |
| .vectorMenu .menu {
| |
| background: rgba(20, 28, 46, 0.95) !important;
| |
| border: 1px solid rgba(232, 196, 155, 0.2) !important;
| |
| }
| |
| | |
| .vectorMenu .menu li a {
| |
| color: rgba(255, 255, 255, 0.8) !important;
| |
| }
| |
| | |
| .vectorMenu .menu li a:hover {
| |
| background: rgba(232, 196, 155, 0.1) !important;
| |
| color: var(--gold) !important;
| |
| }
| |
| | |
| /* Search box */
| |
| #simpleSearch {
| |
| background: rgba(20, 28, 46, 0.8) !important;
| |
| border: 1px solid rgba(232, 196, 155, 0.3) !important;
| |
| border-radius: 4px;
| |
| }
| |
| | |
| #simpleSearch input {
| |
| color: white !important;
| |
| background: transparent !important;
| |
| }
| |
| | |
| #simpleSearch input::placeholder {
| |
| color: rgba(255, 255, 255, 0.5);
| |
| }
| |
| | |
| #simpleSearch #searchButton {
| |
| background: transparent !important;
| |
| }
| |
| | |
| /* Personal tools (login, etc) */
| |
| #p-personal {
| |
| background: transparent;
| |
| }
| |
| | |
| #p-personal ul li {
| |
| background: transparent;
| |
| }
| |
| | |
| #p-personal ul li a {
| |
| color: rgba(255, 255, 255, 0.8) !important;
| |
| }
| |
| | |
| #p-personal ul li a:hover {
| |
| color: var(--gold) !important;
| |
| }
| |
| | |
| /* === PAGE TITLE === */
| |
| #firstHeading {
| |
| color: var(--gold);
| |
| border-bottom: 2px solid rgba(232, 196, 155, 0.3);
| |
| padding-bottom: 10px;
| |
| }
| |
| | |
| /* Hide title on main page */
| |
| body.page-Main_Page #firstHeading {
| |
| display: none;
| |
| }
| |
| | |
| /* === HEADINGS === */
| |
| #bodyContent h2,
| |
| #bodyContent h3,
| |
| #bodyContent h4 {
| |
| color: var(--gold);
| |
| border-bottom: 1px solid rgba(232, 196, 155, 0.2);
| |
| }
| |
| | |
| .mw-headline {
| |
| color: var(--gold);
| |
| }
| |
| | |
| /* === LINKS === */
| |
| #content a:not(.new) {
| |
| color: var(--gold);
| |
| text-decoration: none;
| |
| }
| |
| | |
| #content a:not(.new):hover {
| |
| color: var(--gold-light);
| |
| text-decoration: underline;
| |
| }
| |
| | |
| #content a.new {
| |
| color: #e07a7a;
| |
| }
| |
| | |
| /* External links */
| |
| #content a.external {
| |
| color: var(--gold);
| |
| }
| |
| | |
| /* === TABLE OF CONTENTS === */
| |
| #toc,
| |
| .toc {
| |
| background: rgba(20, 28, 46, 0.8) !important; | |
| border: 1px solid rgba(232, 196, 155, 0.2) !important;
| |
| padding: 15px;
| |
| border-radius: 8px;
| |
| }
| |
| | |
| #toc h2,
| |
| .toc h2 {
| |
| color: var(--gold);
| |
| }
| |
| | |
| #toc ul a,
| |
| .toc ul a {
| |
| color: rgba(255, 255, 255, 0.8);
| |
| }
| |
| | |
| #toc ul a:hover,
| |
| .toc ul a:hover {
| |
| color: var(--gold);
| |
| }
| |
| | |
| /* Hide TOC on main page */
| |
| body.page-Main_Page #toc,
| |
| body.page-Main_Page .toc {
| |
| display: none !important;
| |
| }
| |
| | |
| /* === TABLES === */
| |
| .wikitable {
| |
| background: rgba(20, 28, 46, 0.8) !important;
| |
| border: 1px solid rgba(232, 196, 155, 0.2) !important;
| |
| color: rgba(255, 255, 255, 0.9);
| |
| }
| |
| | |
| .wikitable th {
| |
| background: rgba(232, 196, 155, 0.15) !important;
| |
| color: var(--gold) !important;
| |
| border: 1px solid rgba(232, 196, 155, 0.2) !important;
| |
| }
| |
| | |
| .wikitable td {
| |
| border: 1px solid rgba(232, 196, 155, 0.1) !important;
| |
| background: transparent !important;
| |
| }
| |
| | |
| .wikitable tr:hover td {
| |
| background: rgba(232, 196, 155, 0.05) !important;
| |
| }
| |
| | |
| /* === FOOTER === */
| |
| #footer {
| |
| background: rgba(15, 20, 35, 0.9) !important;
| |
| border-top: 1px solid rgba(232, 196, 155, 0.2);
| |
| color: rgba(255, 255, 255, 0.6);
| |
| }
| |
| | |
| #footer a {
| |
| color: var(--gold) !important;
| |
| }
| |
| | |
| /* === MAIN PAGE CUSTOM ELEMENTS === */
| |
| | |
| /* Hero Section */
| |
| .hymnro-hero {
| |
| text-align: center;
| |
| padding: 40px 20px;
| |
| margin-bottom: 20px;
| |
| }
| |
| | |
| .hymnro-hero img {
| |
| max-width: 350px;
| |
| width: 100%;
| |
| height: auto;
| |
| filter: drop-shadow(0 0 30px rgba(232, 196, 155, 0.5));
| |
| }
| |
| | |
| .hymnro-tagline {
| |
| font-size: 1.3em;
| |
| color: rgba(255, 255, 255, 0.9);
| |
| margin-top: 15px;
| |
| text-shadow: 0 2px 10px rgba(0, 0, 0, 0.8);
| |
| font-style: italic;
| |
| }
| |
| | |
| /* Quick Links */
| |
| .hymnro-quick-links {
| |
| display: flex;
| |
| justify-content: center;
| |
| gap: 15px;
| |
| flex-wrap: wrap;
| |
| margin: 20px auto 30px;
| |
| }
| |
| | |
| .hymnro-btn {
| |
| display: inline-block;
| |
| background: linear-gradient(135deg, var(--gold), var(--gold-dark));
| |
| color: #1a1a2e !important;
| |
| padding: 10px 25px; | |
| border-radius: 25px;
| |
| font-weight: 600;
| |
| text-decoration: none !important;
| |
| transition: all 0.3s ease;
| |
| box-shadow: 0 4px 15px rgba(232, 196, 155, 0.3);
| |
| }
| |
| | |
| .hymnro-btn:hover {
| |
| transform: translateY(-2px);
| |
| box-shadow: 0 6px 20px rgba(232, 196, 155, 0.5);
| |
| filter: brightness(1.1);
| |
| }
| |
| | |
| .hymnro-quick-links a {
| |
| text-decoration: none !important;
| |
| }
| |
| | |
| /* Section Title */
| |
| .hymnro-section-title {
| |
| color: var(--gold);
| |
| font-size: 1.4em;
| |
| text-align: center;
| |
| margin-bottom: 20px;
| |
| text-shadow: 0 2px 10px rgba(0, 0, 0, 0.5);
| |
| }
| |
| | |
| .hymnro-section-title::after {
| |
| content: '';
| |
| display: block;
| |
| width: 80px;
| |
| height: 2px;
| |
| background: linear-gradient(90deg, transparent, var(--gold), transparent);
| |
| margin: 8px auto 0;
| |
| }
| |
| | |
| /* Navigation Grid */
| |
| .hymnro-nav-grid {
| |
| display: grid;
| |
| grid-template-columns: repeat(3, 1fr);
| |
| gap: 15px;
| |
| margin-bottom: 30px;
| |
| max-width: 900px;
| |
| margin-left: auto;
| |
| margin-right: auto;
| |
| }
| |
| | |
| /* Navigation Cards */
| |
| .hymnro-card {
| |
| background: rgba(20, 28, 46, 0.8);
| |
| backdrop-filter: blur(12px);
| |
| -webkit-backdrop-filter: blur(12px);
| |
| border: 1px solid rgba(232, 196, 155, 0.25);
| |
| border-radius: 12px;
| |
| padding: 20px 15px;
| |
| text-align: center;
| |
| transition: all 0.3s ease;
| |
| cursor: pointer;
| |
| }
| |
| | |
| .hymnro-card:hover {
| |
| transform: translateY(-5px);
| |
| border-color: var(--gold);
| |
| box-shadow: 0 10px 30px rgba(0, 0, 0, 0.4),
| |
| 0 0 20px rgba(232, 196, 155, 0.2);
| |
| background: rgba(30, 40, 60, 0.9);
| |
| }
| |
| | |
| .hymnro-card-title {
| |
| font-size: 1.2em;
| |
| color: var(--gold) !important;
| |
| font-weight: 600;
| |
| margin-bottom: 6px;
| |
| text-shadow: 0 2px 4px rgba(0, 0, 0, 0.5);
| |
| }
| |
| | |
| .hymnro-card-desc {
| |
| font-size: 0.85em;
| |
| color: rgba(255, 255, 255, 0.7);
| |
| line-height: 1.3;
| |
| }
| |
| | |
| /* Info Section - Two columns */
| |
| .hymnro-info-section {
| |
| display: flex;
| |
| gap: 20px;
| |
| max-width: 900px;
| |
| margin: 30px auto;
| |
| justify-content: center;
| |
| }
| |
| | |
| .hymnro-info-section .hymnro-info-box {
| |
| flex: 1;
| |
| max-width: 400px;
| |
| }
| |
| | |
| /* Info Box */
| |
| .hymnro-info-box {
| |
| background: rgba(20, 28, 46, 0.8);
| |
| backdrop-filter: blur(12px);
| |
| -webkit-backdrop-filter: blur(12px);
| |
| border: 1px solid rgba(232, 196, 155, 0.25);
| |
| border-radius: 12px;
| |
| padding: 20px;
| |
| margin-bottom: 20px;
| |
| }
| |
| | |
| .hymnro-info-box h3 {
| |
| color: var(--gold);
| |
| margin: 0 0 15px 0;
| |
| font-size: 1.1em;
| |
| text-align: center;
| |
| border-bottom: 1px solid rgba(232, 196, 155, 0.2);
| |
| padding-bottom: 10px;
| |
| }
| |
| | |
| .hymnro-info-item {
| |
| display: flex;
| |
| justify-content: space-between;
| |
| padding: 6px 0;
| |
| border-bottom: 1px solid rgba(232, 196, 155, 0.1);
| |
| font-size: 0.9em;
| |
| }
| |
| | |
| .hymnro-info-item:last-child {
| |
| border-bottom: none;
| |
| }
| |
| | |
| .hymnro-info-label {
| |
| color: rgba(255, 255, 255, 0.7);
| |
| }
| |
| | |
| .hymnro-info-value {
| |
| color: var(--gold);
| |
| font-weight: 600;
| |
| }
| |
| | |
| /* Footer */
| |
| .hymnro-footer {
| |
| text-align: center;
| |
| padding: 20px;
| |
| color: rgba(255, 255, 255, 0.5);
| |
| font-size: 0.9em;
| |
| }
| |
| | |
| /* === RESPONSIVE === */
| |
| @media screen and (max-width: 900px) {
| |
| .hymnro-nav-grid {
| |
| grid-template-columns: repeat(2, 1fr);
| |
| }
| |
|
| |
| .hymnro-info-section {
| |
| flex-direction: column;
| |
| align-items: center;
| |
| }
| |
|
| |
| .hymnro-info-section .hymnro-info-box {
| |
| max-width: 100%;
| |
| }
| |
| }
| |
| | |
| @media screen and (max-width: 500px) {
| |
| .hymnro-nav-grid {
| |
| grid-template-columns: 1fr;
| |
| }
| |
|
| |
| .hymnro-quick-links {
| |
| flex-direction: column;
| |
| align-items: center;
| |
| }
| |
| }
| |
| | |
| /* === EDIT PAGE FIXES === */
| |
| #editform textarea {
| |
| background: rgba(20, 28, 46, 0.9) !important;
| |
| color: white !important;
| |
| border: 1px solid rgba(232, 196, 155, 0.3) !important;
| |
| }
| |
| | |
| .editOptions {
| |
| background: transparent !important;
| |
| }
| |
| | |
| /* Buttons */
| |
| input[type="submit"],
| |
| button {
| |
| background: linear-gradient(135deg, var(--gold), var(--gold-dark)) !important;
| |
| color: #1a1a2e !important;
| |
| border: none !important;
| |
| padding: 8px 16px;
| |
| border-radius: 4px;
| |
| cursor: pointer;
| |
| font-weight: 600;
| |
| }
| |
| | |
| input[type="submit"]:hover,
| |
| button:hover {
| |
| filter: brightness(1.1);
| |
| }
| |
| | |
| /* Category links */
| |
| #catlinks {
| |
| background: rgba(20, 28, 46, 0.8) !important;
| |
| border: 1px solid rgba(232, 196, 155, 0.2) !important;
| |
| border-radius: 4px;
| |
| padding: 10px;
| |
| }
| |
| | |
| #catlinks a {
| |
| color: var(--gold) !important;
| |
| } | | } |
