「MediaWiki:Citizen.css」の版間の差分
MediaWikiインターフェイスページ
その他の操作
編集の要約なし タグ: 手動差し戻し |
編集の要約なし |
||
| 1行目: | 1行目: | ||
/* | ```diff:citizen.css.txt | ||
/* | === | ||
/* University eSports Wiki - Home Page Specific Styles */ | |||
/* Scope everything under .uw-home to avoid affecting other pages */ | |||
/* | /* Home page full width */ | ||
.page-Home .mw- | body.page-Home .mw-body { | ||
max-width: none !important; | |||
padding-left: 0 !important; | |||
padding-right: 0 !important; | |||
} | } | ||
body.page-Home .mw-content-container { | |||
.page-Home | max-width: none !important; | ||
. | |||
} | } | ||
/* | /* Hero Section */ | ||
. | .uw-home-hero { | ||
position: relative; | |||
padding: 8rem 2rem; | |||
text-align: center; | |||
background: linear-gradient(135deg, #1a1a1a 0%, #2d2d2d 100%); | |||
color: #ffffff; | |||
overflow: hidden; | |||
margin-bottom: 4rem; | |||
} | } | ||
.uw-home-hero::before { | |||
. | content: ''; | ||
position: absolute; | |||
. | top: -50%; | ||
. | left: -50%; | ||
width: 200%; | |||
height: 200%; | |||
background: radial-gradient(circle, rgba(63,94,251,0.1) 0%, rgba(252,70,107,0.05) 100%); | |||
transform: rotate(15deg); | |||
z-index: 0; | |||
} | } | ||
.uw-home-hero-content { | |||
. | position: relative; | ||
z-index: 1; | |||
max-width: 900px; | |||
margin: 0 auto; | |||
} | } | ||
.uw-home-hero h1 { | |||
font-size: clamp(2.5rem, 8vw, 4rem); | |||
font-weight: 800; | |||
margin-bottom: 1.5rem; | |||
line-height: 1.1; | |||
color: #ffffff; | |||
border: none; | |||
} | } | ||
.uw-home-hero-subtitle { | |||
. | font-size: clamp(1.1rem, 3vw, 1.5rem); | ||
color: #cccccc; | |||
margin-bottom: 3rem; | |||
line-height: 1.6; | |||
} | } | ||
. | |||
.uw-home-hero-ctas { | |||
display: flex; | |||
gap: 1.5rem; | |||
justify-content: center; | |||
flex-wrap: wrap; | |||
} | |||
.uw-btn { | |||
display: inline-block; | |||
padding: 1rem 2.5rem; | |||
border-radius: 50px; | |||
font-weight: 700; | |||
text-decoration: none !important; | |||
transition: transform 0.2s ease, box-shadow 0.2s ease; | |||
} | |||
.uw-btn:hover { | |||
transform: translateY(-2px); | |||
box-shadow: 0 10px 20px rgba(0,0,0,0.2); | |||
} | } | ||
.uw-btn-primary { | |||
background: var(--color-primary, #36f); | |||
color: #ffffff !important; | |||
} | |||
.uw-btn-secondary { | |||
. | background: rgba(255,255,255,0.1); | ||
color: #ffffff !important; | |||
backdrop-filter: blur(10px); | |||
border: 1px solid rgba(255,255,255,0.2); | |||
. | |||
} | } | ||
/* | /* Card Section */ | ||
. | .uw-home-cards { | ||
display: grid; | |||
grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)); | |||
gap: 2rem; | |||
max-width: 1200px; | |||
margin: 0 auto 6rem; | |||
padding: 0 2rem; | |||
} | } | ||
.uw-card { | |||
display: block; | |||
background: var(--color-surface-2, #212121); | |||
border: 1px solid var(--color-border, #333); | |||
border-radius: 16px; | |||
overflow: hidden; | |||
text-decoration: none !important; | |||
transition: transform 0.3s cubic-bezier(0.34, 1.56, 0.64, 1), box-shadow 0.3s ease; | |||
color: inherit !important; | |||
} | |||
.uw-card:hover { | |||
. | transform: translateY(-8px); | ||
box-shadow: 0 20px 40px rgba(0,0,0,0.3); | |||
border-color: var(--color-primary); | |||
. | |||
} | } | ||
.uw-card-image { | |||
. | height: 200px; | ||
background: linear-gradient(45deg, #333, #444); | |||
display: flex; | |||
align-items: center; | |||
justify-content: center; | |||
font-size: 4rem; | |||
} | } | ||
.uw-card-body { | |||
.uw- | padding: 2rem; | ||
} | } | ||
.uw- | .uw-card-title { | ||
font-size: 1.5rem; | |||
font-weight: 700; | |||
margin-bottom: 0.5rem; | |||
} | } | ||
.uw- | .uw-card-text { | ||
color: var(--color-base--subtle, #999); | |||
line-height: 1.5; | |||
} | } | ||
.uw- | /* Contribute Section */ | ||
.uw-home-contribute { | |||
max-width: 1200px; | |||
margin: 0 auto 8rem; | |||
padding: 0 2rem; | |||
text-align: center; | |||
} | } | ||
.uw- | .uw-home-contribute h2 { | ||
font-size: 2.5rem; | |||
margin-bottom: 3rem; | |||
border: none; | |||
} | } | ||
.uw- | .uw-contribute-grid { | ||
. | display: grid; | ||
grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); | |||
gap: 1.5rem; | |||
} | |||
.uw- | .uw-contribute-item { | ||
background: var(--color-surface-1, #1a1a1a); | |||
padding: 2rem; | |||
border-radius: 12px; | |||
border: 1px dashed var(--color-border, #333); | |||
text-decoration: none !important; | |||
transition: background 0.2s ease, border-color 0.2s ease; | |||
} | } | ||
/* | .uw-contribute-item:hover { | ||
background: var(--color-surface-2, #212121); | |||
border-color: var(--color-primary); | |||
} | |||
.uw-contribute-icon { | |||
font-size: 2rem; | |||
margin-bottom: 1rem; | |||
display: block; | |||
} | |||
.uw-contribute-label { | |||
font-weight: 700; | |||
color: var(--color-base, #eee); | |||
} | |||
/* Mobile Adjustments */ | |||
@media (max-width: 768px) { | |||
.uw-home-hero { | |||
padding: 5rem 1.5rem; | |||
} | |||
.uw-btn { | |||
width: 100%; | |||
text-align: center; | |||
} | |||
.uw-home-cards { | |||
grid-template-columns: 1fr; | |||
} | |||
} | |||
2026年2月15日 (日) 23:21時点における版
```diff:citizen.css.txt
===
/* University eSports Wiki - Home Page Specific Styles */
/* Scope everything under .uw-home to avoid affecting other pages */
/* Home page full width */
body.page-Home .mw-body {
max-width: none !important;
padding-left: 0 !important;
padding-right: 0 !important;
}
body.page-Home .mw-content-container {
max-width: none !important;
}
/* Hero Section */
.uw-home-hero {
position: relative;
padding: 8rem 2rem;
text-align: center;
background: linear-gradient(135deg, #1a1a1a 0%, #2d2d2d 100%);
color: #ffffff;
overflow: hidden;
margin-bottom: 4rem;
}
.uw-home-hero::before {
content: '';
position: absolute;
top: -50%;
left: -50%;
width: 200%;
height: 200%;
background: radial-gradient(circle, rgba(63,94,251,0.1) 0%, rgba(252,70,107,0.05) 100%);
transform: rotate(15deg);
z-index: 0;
}
.uw-home-hero-content {
position: relative;
z-index: 1;
max-width: 900px;
margin: 0 auto;
}
.uw-home-hero h1 {
font-size: clamp(2.5rem, 8vw, 4rem);
font-weight: 800;
margin-bottom: 1.5rem;
line-height: 1.1;
color: #ffffff;
border: none;
}
.uw-home-hero-subtitle {
font-size: clamp(1.1rem, 3vw, 1.5rem);
color: #cccccc;
margin-bottom: 3rem;
line-height: 1.6;
}
.uw-home-hero-ctas {
display: flex;
gap: 1.5rem;
justify-content: center;
flex-wrap: wrap;
}
.uw-btn {
display: inline-block;
padding: 1rem 2.5rem;
border-radius: 50px;
font-weight: 700;
text-decoration: none !important;
transition: transform 0.2s ease, box-shadow 0.2s ease;
}
.uw-btn:hover {
transform: translateY(-2px);
box-shadow: 0 10px 20px rgba(0,0,0,0.2);
}
.uw-btn-primary {
background: var(--color-primary, #36f);
color: #ffffff !important;
}
.uw-btn-secondary {
background: rgba(255,255,255,0.1);
color: #ffffff !important;
backdrop-filter: blur(10px);
border: 1px solid rgba(255,255,255,0.2);
}
/* Card Section */
.uw-home-cards {
display: grid;
grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
gap: 2rem;
max-width: 1200px;
margin: 0 auto 6rem;
padding: 0 2rem;
}
.uw-card {
display: block;
background: var(--color-surface-2, #212121);
border: 1px solid var(--color-border, #333);
border-radius: 16px;
overflow: hidden;
text-decoration: none !important;
transition: transform 0.3s cubic-bezier(0.34, 1.56, 0.64, 1), box-shadow 0.3s ease;
color: inherit !important;
}
.uw-card:hover {
transform: translateY(-8px);
box-shadow: 0 20px 40px rgba(0,0,0,0.3);
border-color: var(--color-primary);
}
.uw-card-image {
height: 200px;
background: linear-gradient(45deg, #333, #444);
display: flex;
align-items: center;
justify-content: center;
font-size: 4rem;
}
.uw-card-body {
padding: 2rem;
}
.uw-card-title {
font-size: 1.5rem;
font-weight: 700;
margin-bottom: 0.5rem;
}
.uw-card-text {
color: var(--color-base--subtle, #999);
line-height: 1.5;
}
/* Contribute Section */
.uw-home-contribute {
max-width: 1200px;
margin: 0 auto 8rem;
padding: 0 2rem;
text-align: center;
}
.uw-home-contribute h2 {
font-size: 2.5rem;
margin-bottom: 3rem;
border: none;
}
.uw-contribute-grid {
display: grid;
grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
gap: 1.5rem;
}
.uw-contribute-item {
background: var(--color-surface-1, #1a1a1a);
padding: 2rem;
border-radius: 12px;
border: 1px dashed var(--color-border, #333);
text-decoration: none !important;
transition: background 0.2s ease, border-color 0.2s ease;
}
.uw-contribute-item:hover {
background: var(--color-surface-2, #212121);
border-color: var(--color-primary);
}
.uw-contribute-icon {
font-size: 2rem;
margin-bottom: 1rem;
display: block;
}
.uw-contribute-label {
font-weight: 700;
color: var(--color-base, #eee);
}
/* Mobile Adjustments */
@media (max-width: 768px) {
.uw-home-hero {
padding: 5rem 1.5rem;
}
.uw-btn {
width: 100%;
text-align: center;
}
.uw-home-cards {
grid-template-columns: 1fr;
}
}