MediaWiki:Common.css: Difference between revisions
Appearance
No edit summary |
No edit summary |
||
| Line 138: | Line 138: | ||
} | } | ||
/* Full-width book card */ | |||
/* | |||
.book-card { | .book-card { | ||
max-width: 900px | width: 100%; | ||
margin: | max-width: none; /* remove 900px limit */ | ||
margin: 1.5rem 0; | |||
padding: 1.5rem; | padding: 1.5rem; | ||
border-radius: 12px; | border-radius: 12px; | ||
| Line 150: | Line 150: | ||
flex-direction: column; | flex-direction: column; | ||
gap: 1.25rem; | gap: 1.25rem; | ||
box-sizing: border-box; | |||
} | } | ||
/* | /* Image bigger */ | ||
.book-card-image img { | .book-card-image img { | ||
width: 150px | width: 230px; /* was 150px */ | ||
height: auto; | height: auto; | ||
object-fit: cover; | object-fit: cover; | ||
| Line 168: | Line 162: | ||
} | } | ||
/* | /* (keep your existing .book-card-main, .book-card-text, etc.) */ | ||
.book-card- | |||
.book-card- | |||
/* Synopsis + Read more */ | |||
.book-card-synopsis { | .book-card-synopsis { | ||
font-size: 0.95rem; | font-size: 0.95rem; | ||
| Line 190: | Line 170: | ||
} | } | ||
.book-card-synopsis details { | |||
.book-card- | margin-top: 0.5rem; | ||
margin-top: 0. | |||
} | } | ||
.book-card-synopsis summary { | |||
.book- | cursor: pointer; | ||
display: inline-block; | |||
margin-top: 0.25rem; | |||
color: #1e7a34; | |||
font-weight: 500; | font-weight: 500; | ||
} | } | ||
.book-card-synopsis summary::marker { | |||
.book- | /* optional: hide default triangle if you don't like it */ | ||
/* content: ""; */ | |||
} | } | ||
.book- | .book-card-synopsis details[open] summary { | ||
color: #145323; | |||
} | } | ||
/* Mobile | /* Mobile tweak so big image still looks good */ | ||
@media (max-width: 768px) { | @media (max-width: 768px) { | ||
.book-card-main { | .book-card-main { | ||
flex-direction: column; | flex-direction: column; | ||
align-items: center; | align-items: center; | ||
} | } | ||
.book-card-image img { | .book-card-image img { | ||
width: | width: 260px; | ||
} | } | ||
Revision as of 09:39, 14 November 2025
/* ===== CryptoRootsMX – Vector (legacy) full tan theme ===== */
/* Header + footer */
#mw-head, #footer {
color:#2E2A26 !important;
}
/* Tabs (Read / Edit / View history) */
.vector-menu-tabs li a {
color: #017C74 !important;
}
.vector-menu-tabs li.selected a {
background: transparent !important;
border-bottom: 3px solid #017C74 !important;
color: #017C74 !important;
}
/* Headings & links */
h1, h2, h3, h4 { color:#502583 !important; font-family: "Georgia","Garamond",serif; }
a, a:visited { color:#017C74 !important; }
a:hover { color:#B39D68 !important; }
/* === CryptoRootsMX gem styles (WAF-safe) === */
.gem-grid { width:100%; background:#FAEEDC; border:1px solid #E6CFAE; text-align:center; }
/* shared cell formatting */
.gem-cell { padding:12px; vertical-align:top; }
.gem-cell img { border-radius:6px; padding:2px; background:#FAEEDC; }
/* frames by role */
.gem-emerald-cell img { border:4px solid #046307; } /* Confirmed Jews */
.gem-ruby-cell img { border:4px solid #7D2181; } /* Conquistadors & Settlers */
.gem-sapphire-cell img { border:4px solid #0B3C8D; } /* Saints */
/* titles underneath (optional color without extra HTML) */
.gem-title { display:block; margin-top:8px; font-weight:bold; color:#2E2A26; }
.gem-emerald-cell .gem-title { color:#046307; }
.gem-ruby-cell .gem-title { color:#7D2181; }
.gem-sapphire-cell .gem-title { color:#0B3C8D; }
/* subtle hover without shadows */
.gem-cell:hover img { opacity:0.95; outline:2px solid rgba(0,0,0,0.05); }
.gem-cell:hover img {
transform: scale(1.02);
transition: all 0.25s ease;
opacity: 0.95;
}
.gem-emerald-cell img { border: 4px solid #046307; box-shadow: 0 0 10px rgba(4,99,7,0.4); }
.gem-ruby-cell img { border: 4px solid #7D2181; box-shadow: 0 0 10px rgba(125,33,129,0.4); }
.gem-sapphire-cell img { border: 4px solid #0B3C8D; box-shadow: 0 0 10px rgba(11,60,141,0.4); }
/* Confirmed Surnames grid (wider cards) */
.surname-grid {
display: table;
width: 100%;
border-collapse: separate;
border-spacing: 12px 10px;
text-align: center;
}
.surname-cell {
background: #FAEEDC;
border: 1px solid #E6CFAE;
border-radius: 10px;
padding: 12px 16px;
font-weight: 500;
color: #502583;
font-family: 'Georgia', serif;
box-shadow: 1px 1px 3px rgba(0,0,0,0.05);
transition: transform 0.1s ease;
width: 160px; /* ← widen this to your liking */
min-width: 150px;
}
.surname-cell:hover {
transform: scale(1.05);
background: #F6EAD6;
}
.bookgrid {
width: 100%;
table-layout: fixed;
border-collapse: separate;
border-spacing: 10px 8px;
background: #f8efe4;
}
.bookgrid .book-cell {
width: 20%; /* 5 columns */
padding: 6px;
text-align: center;
background: #fdf7f2;
border-radius: 8px;
}
.bookgrid .book-cell img {
display: block;
margin: 0 auto;
border: 3px solid #6e337f;
border-radius: 6px;
}
.book-title {
display: block;
margin-top: 4px;
font-weight: bold;
color: #0d663a;
font-family: Georgia, serif;
line-height: 1.2em;
}
/* Category color accents */
.book-emerald-cell img { border-color: #1f8a5b; }
.book-ruby-cell img { border-color: #8a1f4f; }
.book-sapphire-cell img{ border-color: #1f4f8a; }
.book-amethyst-cell img{ border-color: #6e337f; }
.book-topaz-cell img { border-color: #b7791f; }
.mw-parser-output .book-header {
text-align: center !important;
margin: 12px auto 8px auto;
font-size: 2em;
font-weight: bold;
font-family: Georgia, "Times New Roman", serif;
color: #5a2a7a;
width: 100%;
border-bottom: 2px solid #d8c3e3;
padding-bottom: 4px;
}
/* Full-width book card */
.book-card {
width: 100%;
max-width: none; /* remove 900px limit */
margin: 1.5rem 0;
padding: 1.5rem;
border-radius: 12px;
border: 1px solid #ddd;
background: #fafafa;
display: flex;
flex-direction: column;
gap: 1.25rem;
box-sizing: border-box;
}
/* Image bigger */
.book-card-image img {
width: 230px; /* was 150px */
height: auto;
object-fit: cover;
border-radius: 8px;
box-shadow: 0 2px 6px rgba(0,0,0,0.12);
}
/* (keep your existing .book-card-main, .book-card-text, etc.) */
/* Synopsis + Read more */
.book-card-synopsis {
font-size: 0.95rem;
line-height: 1.5;
}
.book-card-synopsis details {
margin-top: 0.5rem;
}
.book-card-synopsis summary {
cursor: pointer;
display: inline-block;
margin-top: 0.25rem;
color: #1e7a34;
font-weight: 500;
}
.book-card-synopsis summary::marker {
/* optional: hide default triangle if you don't like it */
/* content: ""; */
}
.book-card-synopsis details[open] summary {
color: #145323;
}
/* Mobile tweak so big image still looks good */
@media (max-width: 768px) {
.book-card-main {
flex-direction: column;
align-items: center;
}
.book-card-image img {
width: 260px;
}
.book-card-text {
width: 100%;
}
}