Mudanças entre as edições de "Predefinição:BossLayout/styles.css"
Ir para navegação
Ir para pesquisar
(Criou página com '→Container Geral: .boss-container { font-family: sans-serif; color: #333; } →Grid de Cards (Usado em Fases, Personagens e Recompensas): .boss-grid { displ...') |
|||
| (9 revisões intermediárias pelo mesmo usuário não estão sendo mostradas) | |||
| Linha 1: | Linha 1: | ||
/* Container | /* Container Principal */ | ||
.boss- | .boss-main-wrapper { | ||
background: #f4f4f4; | |||
padding: 20px; | |||
border-radius: 12px; | |||
border: 1px solid #ddd; | |||
font-family: sans-serif; | font-family: sans-serif; | ||
color: | background-color: grey; | ||
} | } | ||
/* | .home-card-WorldBoss { | ||
.boss- | overflow: hidden; | ||
margin-bottom: 20px; | |||
} | |||
/* Navegação por Botões ALINHADA À ESQUERDA */ | |||
.boss-navigation { | |||
display: flex; | display: flex; | ||
gap: 12px; | |||
justify-content: flex-start; /* Botões para a esquerda */ | |||
margin: 20px 0; | |||
flex-wrap: wrap; | flex-wrap: wrap; | ||
} | } | ||
/* | /* Estilo dos Botões */ | ||
.boss- | .boss-nav-btn { | ||
padding: 10px 22px; | |||
background: #fff; | background: #fff; | ||
border: | border: 2px solid #459cca; | ||
border-radius: | color: #459cca; | ||
box-shadow: 0 | border-radius: 6px; | ||
font-weight: bold; | |||
cursor: pointer; | |||
transition: all 0.2s ease; | |||
text-transform: uppercase; | |||
font-size: 15px; | |||
box-shadow: 0 2px 5px rgba(0,0,0,0.05); | |||
border-radius: 15px; | |||
} | |||
.boss-nav-btn:hover { | |||
background: #eef7ff; | |||
transform: translateY(-2px); | |||
} | } | ||
.boss-nav-btn.active { | |||
. | background: linear-gradient(to bottom, #459cca, #5684c8); | ||
color: #fff; | |||
border-color: #3b86ae; | |||
box-shadow: inset 0 2px 4px rgba(0,0,0,0.2); | |||
} | } | ||
/* | /* Grid de Fases e Cards */ | ||
. | .boss-grid { | ||
display: flex; | display: flex; | ||
flex-wrap: wrap; | |||
gap: | gap: 15px; | ||
} | } | ||
.boss-card { | |||
.boss- | flex: 1 1 300px; | ||
background: #fff; | |||
background: # | border: 1px solid #e0e0e0; | ||
border-radius: 8px; | |||
overflow: hidden; | |||
border-radius: | box-shadow: 0 4px 10px rgba(0,0,0,0.06); | ||
} | } | ||
/* | /* Controle de Exibição */ | ||
. | .boss-section { | ||
display: none; | |||
} | } | ||
. | .boss-section.active { | ||
display: block; | |||
animation: fadeIn 0.4s ease; | |||
} | } | ||
@keyframes fadeIn { | |||
@ | from { opacity: 0; } | ||
to { opacity: 1; } | |||
} | } | ||
Edição atual tal como às 00h31min de 17 de abril de 2026
/* Container Principal */
.boss-main-wrapper {
background: #f4f4f4;
padding: 20px;
border-radius: 12px;
border: 1px solid #ddd;
font-family: sans-serif;
background-color: grey;
}
.home-card-WorldBoss {
overflow: hidden;
margin-bottom: 20px;
}
/* Navegação por Botões ALINHADA À ESQUERDA */
.boss-navigation {
display: flex;
gap: 12px;
justify-content: flex-start; /* Botões para a esquerda */
margin: 20px 0;
flex-wrap: wrap;
}
/* Estilo dos Botões */
.boss-nav-btn {
padding: 10px 22px;
background: #fff;
border: 2px solid #459cca;
color: #459cca;
border-radius: 6px;
font-weight: bold;
cursor: pointer;
transition: all 0.2s ease;
text-transform: uppercase;
font-size: 15px;
box-shadow: 0 2px 5px rgba(0,0,0,0.05);
border-radius: 15px;
}
.boss-nav-btn:hover {
background: #eef7ff;
transform: translateY(-2px);
}
.boss-nav-btn.active {
background: linear-gradient(to bottom, #459cca, #5684c8);
color: #fff;
border-color: #3b86ae;
box-shadow: inset 0 2px 4px rgba(0,0,0,0.2);
}
/* Grid de Fases e Cards */
.boss-grid {
display: flex;
flex-wrap: wrap;
gap: 15px;
}
.boss-card {
flex: 1 1 300px;
background: #fff;
border: 1px solid #e0e0e0;
border-radius: 8px;
overflow: hidden;
box-shadow: 0 4px 10px rgba(0,0,0,0.06);
}
/* Controle de Exibição */
.boss-section {
display: none;
}
.boss-section.active {
display: block;
animation: fadeIn 0.4s ease;
}
@keyframes fadeIn {
from { opacity: 0; }
to { opacity: 1; }
}