MediaWiki:Common.css: Difference between revisions
no edit summary
Arisepedia (talk | contribs) No edit summary Tag: Manual revert |
Arisepedia (talk | contribs) No edit summary |
||
| Line 1: | Line 1: | ||
/* MediaWiki:Common.css */ | /* MediaWiki:Common.css */ | ||
/* Main Page*/ | |||
#ca-viewsource { | |||
display: none; | |||
} | |||
/* Main Page */ | |||
body { | body { | ||
font-family: 'Arial', sans-serif; | font-family: 'Arial', sans-serif; | ||
| Line 49: | Line 54: | ||
background: #fc5351; | background: #fc5351; | ||
color: #ffffff; | color: #ffffff; | ||
} | |||
/* Featured Articles Section */ | |||
.featured-articles { | |||
background: #ffffff; | |||
border-radius: 15px; | |||
box-shadow: 0 10px 20px rgba(0, 0, 0, 0.15); | |||
padding: 20px; | |||
margin-bottom: 40px; | |||
overflow: hidden; | |||
} | |||
.featured-articles h2 { | |||
font-size: 2em; | |||
color: #6c0cec; | |||
border-bottom: 3px solid #e0e0e0; | |||
padding-bottom: 10px; | |||
margin-bottom: 20px; | |||
font-weight: 700; | |||
} | |||
.article-carousel { | |||
display: flex; | |||
overflow-x: auto; | |||
scroll-snap-type: x mandatory; | |||
scroll-behavior: smooth; | |||
-webkit-overflow-scrolling: touch; | |||
padding-bottom: 20px; | |||
} | |||
.article-carousel::-webkit-scrollbar { | |||
width: 10px; | |||
height: 10px; | |||
} | |||
.article-carousel::-webkit-scrollbar-thumb { | |||
background: #fc5351; | |||
border-radius: 10px; | |||
} | |||
.article-carousel::-webkit-scrollbar-track { | |||
background: #f1f1f1; | |||
border-radius: 10px; | |||
} | |||
.article-card { | |||
flex: 0 0 300px; | |||
margin-right: 20px; | |||
scroll-snap-align: start; | |||
background: #ffffff; | |||
border-radius: 10px; | |||
box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1); | |||
overflow: hidden; | |||
transition: transform 0.3s ease, box-shadow 0.3s ease; | |||
} | |||
.article-card:hover { | |||
transform: translateY(-5px); | |||
box-shadow: 0 6px 12px rgba(0, 0, 0, 0.2); | |||
} | |||
.article-card img { | |||
width: 100%; | |||
height: 150px; | |||
object-fit: cover; | |||
} | |||
.article-card h3 { | |||
font-size: 1.2em; | |||
color: #333; | |||
margin: 10px 15px; | |||
} | |||
.article-card p { | |||
font-size: 0.9em; | |||
color: #555; | |||
margin: 0 15px 15px; | |||
line-height: 1.4; | |||
} | |||
.article-card .read-more { | |||
display: inline-block; | |||
background: #fc5351; | |||
color: #ffffff; | |||
padding: 8px 15px; | |||
border-radius: 20px; | |||
text-decoration: none; | |||
font-size: 0.9em; | |||
font-weight: 600; | |||
margin: 0 15px 15px; | |||
transition: background 0.3s, color 0.3s; | |||
} | |||
.article-card .read-more:hover { | |||
background: #b03a30; | |||
} | } | ||
| Line 137: | Line 237: | ||
font-size: 1em; | font-size: 1em; | ||
padding: 10px 20px; | padding: 10px 20px; | ||
} | |||
.featured-articles h2 { | |||
font-size: 1.5em; | |||
} | |||
.article-card { | |||
flex: 0 0 250px; | |||
} | } | ||
.card h2 { | .card h2 { | ||
| Line 162: | Line 268: | ||
font-size: 0.9em; | font-size: 0.9em; | ||
padding: 8px 15px; | padding: 8px 15px; | ||
} | |||
.featured-articles h2 { | |||
font-size: 1.3em; | |||
} | |||
.article-card { | |||
flex: 0 0 200px; | |||
} | } | ||
.card h2 { | .card h2 { | ||
| Line 175: | Line 287: | ||
font-size: 0.9em; | font-size: 0.9em; | ||
} | } | ||
} | } | ||