Template:MainPage/Patch/styles.css: Difference between revisions
Template page
More actions
Created page with ".event-banner { position: relative; width: 100%; height: 120px; border-radius: 8px; overflow: hidden; margin: 20px 0; } .banner-bg { width: 100%; height: 100%; object-fit: cover; } .banner-overlay { position: absolute; top: 0; left: 0; right: 0; bottom: 0; display: flex; justify-content: space-between; align-items: center; padding: 20px 30px; background: linear-gradient(90deg, rgba(0,0,0,0.6) 0%, rgba(0,0,0,0) 100%); z-index: 2;..." |
No edit summary |
||
| Line 2: | Line 2: | ||
position: relative; | position: relative; | ||
width: 100%; | width: 100%; | ||
height: 120px; | min-height: 120px; | ||
border-radius: 8px; | border-radius: 8px; | ||
overflow: hidden; | overflow: hidden; | ||
| Line 8: | Line 8: | ||
} | } | ||
.banner-bg { | .banner-bg-wrapper { | ||
position: absolute; | |||
top: 0; | |||
left: 0; | |||
width: 100%; | |||
height: 100%; | |||
z-index: 1; | |||
} | |||
.banner-bg-wrapper img { | |||
width: 100%; | width: 100%; | ||
height: 100%; | height: 100%; | ||
object-fit: cover; | object-fit: cover; | ||
display: block; | |||
} | } | ||
| Line 24: | Line 34: | ||
align-items: center; | align-items: center; | ||
padding: 20px 30px; | padding: 20px 30px; | ||
z-index: 2; | z-index: 2; | ||
} | } | ||
| Line 36: | Line 45: | ||
.banner-title { | .banner-title { | ||
font-family: Barlow, sans-serif; | font-family: Barlow, sans-serif; | ||
font-size: | font-size: 28px; | ||
font-weight: 700; | font-weight: 700; | ||
color: white; | color: white; | ||
| Line 53: | Line 62: | ||
} | } | ||
.live | .live-badge { | ||
font-family: Barlow, sans-serif; | font-family: Barlow, sans-serif; | ||
font-size: 13px; | font-size: 13px; | ||
font-weight: 600; | font-weight: 600; | ||
color: white; | color: white; | ||
padding: | padding: 6px 12px; | ||
border-radius: | border-radius: 6px; | ||
background: rgba(46, 204, 113, 0.9); | |||
background: rgba( | |||
} | } | ||
.version-badge { | .version-badge { | ||
background: rgba(255, 255, 255, 0. | font-family: Barlow, sans-serif; | ||
font-size: 14px; | |||
font-weight: 600; | |||
color: white; | |||
padding: 6px 12px; | |||
border-radius: 6px; | |||
background: rgba(255, 255, 255, 0.15); | |||
border: 1px solid rgba(255, 255, 255, 0.3); | |||
} | } | ||
Revision as of 05:42, 2 January 2026
.event-banner {
position: relative;
width: 100%;
min-height: 120px;
border-radius: 8px;
overflow: hidden;
margin: 20px 0;
}
.banner-bg-wrapper {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
z-index: 1;
}
.banner-bg-wrapper img {
width: 100%;
height: 100%;
object-fit: cover;
display: block;
}
.banner-overlay {
position: absolute;
top: 0;
left: 0;
right: 0;
bottom: 0;
display: flex;
justify-content: space-between;
align-items: center;
padding: 20px 30px;
z-index: 2;
}
.banner-text-left {
display: flex;
flex-direction: column;
gap: 5px;
}
.banner-title {
font-family: Barlow, sans-serif;
font-size: 28px;
font-weight: 700;
color: white;
}
.banner-subtitle {
font-family: Barlow, sans-serif;
font-size: 14px;
color: rgba(255, 255, 255, 0.9);
}
.banner-text-right {
display: flex;
gap: 10px;
align-items: center;
}
.live-badge {
font-family: Barlow, sans-serif;
font-size: 13px;
font-weight: 600;
color: white;
padding: 6px 12px;
border-radius: 6px;
background: rgba(46, 204, 113, 0.9);
}
.version-badge {
font-family: Barlow, sans-serif;
font-size: 14px;
font-weight: 600;
color: white;
padding: 6px 12px;
border-radius: 6px;
background: rgba(255, 255, 255, 0.15);
border: 1px solid rgba(255, 255, 255, 0.3);
}