MediaWiki:Common.css: Difference between revisions
no edit summary
Arisepedia (talk | contribs) No edit summary Tag: Reverted |
Arisepedia (talk | contribs) No edit summary Tag: Manual revert |
||
| Line 1: | Line 1: | ||
/* MediaWiki:Common.css */ | /* MediaWiki:Common.css */ | ||
/* Main Page*/ | |||
body { | |||
font-family: 'Arial', sans-serif; | |||
color: #333; | |||
background-color: #f9f9f9; | |||
margin: 0; | |||
padding: 0; | |||
} | |||
/* | /* Hero Section */ | ||
. | .hero { | ||
background: | background: #fc5351; | ||
border-radius: | color: #ffffff; | ||
box-shadow: 0 | padding: 60px 20px; | ||
border-radius: 20px; | |||
box-shadow: 0 12px 24px rgba(0, 0, 0, 0.15); | |||
text-align: center; | |||
margin-bottom: 40px; | margin-bottom: 40px; | ||
} | } | ||
. | .hero h1 { | ||
font-size: | font-size: 2.5em; | ||
font-weight: 700; | font-weight: 700; | ||
margin: 0; | |||
} | } | ||
. | .hero p { | ||
font-size: 1.25em; | |||
margin: 20px 0; | |||
font-weight: 300; | |||
} | } | ||
. | .hero a { | ||
display: inline-block; | |||
background: | background: #ffffff; | ||
border-radius: | color: #fc5351; | ||
padding: 15px 30px; | |||
border-radius: 30px; | |||
text-decoration: none; | |||
font-size: 1.2em; | |||
transition: | font-weight: 600; | ||
margin-top: 20px; | |||
transition: background 0.3s, color 0.3s; | |||
border: 2px solid #fc5351; | |||
} | } | ||
. | .hero a:hover { | ||
background: #fc5351; | |||
color: #ffffff; | |||
} | } | ||
. | /* Info Cards */ | ||
.card { | |||
background: #ffffff; | |||
border-radius: 15px; | |||
border | box-shadow: 0 10px 20px rgba(0, 0, 0, 0.15); | ||
margin-bottom: | padding: 20px; | ||
border: 1px solid #e0e0e0; | |||
margin-bottom: 20px; | |||
} | } | ||
. | .card h2 { | ||
font-size: 2em; | |||
color: #6c0cec; | |||
border-bottom: 3px solid #e0e0e0; | |||
padding-bottom: 10px; | |||
margin-bottom: 20px; | |||
font-weight: 700; | |||
} | } | ||
. | .card p { | ||
font-size: 1.2em; | font-size: 1.2em; | ||
color: #555; | |||
line-height: 1.6; | |||
} | } | ||
. | /* CTA Section */ | ||
.cta { | |||
background: #f4f4f4; | |||
color: #333; | |||
padding: 40px; | |||
border-radius: 15px; | |||
box-shadow: 0 10px 20px rgba(0, 0, 0, 0.15); | |||
text-align: center; | |||
margin-top: 40px; | |||
} | } | ||
. | .cta h2 { | ||
font-size: 2.2em; | |||
font-size: | font-weight: 700; | ||
color: #fc5351; | |||
margin: 0; | |||
} | } | ||
. | .cta p { | ||
font-size: 1.2em; | |||
margin-top: 15px; | |||
font-size: | |||
} | } | ||
. | .cta a { | ||
color: #fc5351; | |||
font-weight: 600; | |||
text-decoration: underline; | |||
transition: color 0.3s; | |||
} | } | ||
.cta a:hover { | |||
. | color: #b03a30; | ||
} | } | ||
. | /* Footer */ | ||
background: | .footer { | ||
text-align: center; | |||
padding: 20px; | |||
background: #ffffff; | |||
border-top: 1px solid #ddd; | |||
margin-top: 40px; | |||
box-shadow: 0 -2px 4px rgba(0, 0, 0, 0.1); | |||
} | } | ||
. | .footer p { | ||
margin: 0; | |||
color: #777; | |||
font-size: 1.1em; | |||
} | } | ||
. | /* Media Queries */ | ||
@media (max-width: 768px) { | |||
.hero h1 { | |||
font-size: 1.8em; | |||
} | |||
.hero p { | |||
font-size: 1em; | |||
} | |||
.hero a { | |||
font-size: 1em; | |||
padding: 10px 20px; | |||
} | |||
.card h2 { | |||
font-size: 1.5em; | |||
} | |||
.card p { | |||
font-size: 1em; | |||
} | |||
.cta h2 { | |||
font-size: 1.8em; | |||
} | |||
.cta p { | |||
font-size: 1em; | |||
} | |||
} | } | ||
@media (max-width: 480px) { | |||
. | .hero h1 { | ||
font-size: 1.5em; | |||
} | } | ||
.hero p { | |||
font-size: 0.9em; | |||
} | |||
.hero a { | |||
font-size: 0.9em; | |||
padding: 8px 15px; | |||
} | |||
.card h2 { | |||
font-size: 1.3em; | |||
} | |||
.card p { | |||
font-size: 0.9em; | |||
} | |||
.cta h2 { | |||
font-size: 1.5em; | |||
} | } | ||
.cta p { | |||
font-size: 0.9em; | |||
} | } | ||
} | } | ||
#ca-viewsource { | |||
display: none; | |||
} | } | ||