Template:DiscordBanner/styles.css
Appearance
.lumi-discord-banner {
width: 100%;
max-width: 650px;
margin: 28px auto;
overflow: hidden;
background: #5865f2;
color: #ffffff;
border-radius: 0;
box-sizing: border-box;
}
.lumi-discord-main {
display: flex;
align-items: center;
justify-content: space-between;
gap: 20px;
padding: 32px 28px;
min-height: 150px;
}
.lumi-discord-icon,
.lumi-discord-game-logo {
flex: 0 0 90px;
text-align: center;
}
.lumi-discord-icon img,
.lumi-discord-game-logo img {
display: block;
max-width: 100%;
height: auto;
}
.lumi-discord-content {
flex: 1;
min-width: 0;
}
.lumi-discord-title {
font-size: 1.6em;
font-weight: 700;
line-height: 1.3;
margin-bottom: 18px;
}
.lumi-discord-title a {
color: #ffffff;
text-decoration: none;
}
.lumi-discord-title a:hover {
text-decoration: underline;
}
.lumi-discord-subtitle {
font-size: 1.3em;
line-height: 1.4;
color: #ffffff;
}
.lumi-discord-footer {
background: #4e5be0;
padding: 22px 16px;
color: #ffffff;
text-align: center;
font-size: 1.1em;
font-weight: 700;
letter-spacing: 0.03em;
}
@media screen and (max-width: 600px) {
.lumi-discord-main {
gap: 12px;
padding: 24px 16px;
min-height: 110px;
}
.lumi-discord-icon,
.lumi-discord-game-logo {
flex: 0 0 55px;
}
.lumi-discord-title {
font-size: 1.15em;
margin-bottom: 10px;
}
.lumi-discord-subtitle {
font-size: 0.95em;
}
.lumi-discord-footer {
font-size: 0.85em;
padding: 16px 12px;
}
}