Mudanças entre as edições de "Predefinição:Skillbox/styles.css"
Ir para navegação
Ir para pesquisar
Etiqueta: Revertido |
|||
| (4 revisões intermediárias pelo mesmo usuário não estão sendo mostradas) | |||
| Linha 4: | Linha 4: | ||
color: #222; | color: #222; | ||
margin: 0 auto; | margin: 0 auto; | ||
overflow-x: clip; /* <-- este é o isolamento */ | |||
position: relative; /* necessário para o clip funcionar */ | |||
} | } | ||
| Linha 35: | Linha 37: | ||
.skillbox-tabs-separator { | .skillbox-tabs-separator { | ||
width: 100vw; | |||
height: 2px; | height: 2px; | ||
background: #ccc; | background: #ccc; | ||
margin: 0; | margin: 0 calc(-50vw + 50%); | ||
} | } | ||
Edição atual tal como às 11h50min de 9 de junho de 2025
.skillbox-container {
width: 100%;
font-family: sans-serif;
color: #222;
margin: 0 auto;
overflow-x: clip; /* <-- este é o isolamento */
position: relative; /* necessário para o clip funcionar */
}
.skillbox-inner {
display: flex;
flex-direction: column;
align-items: center;
width: 100%;
padding: 0;
}
.skillbox-info-area {
width: 100%;
max-width: 900px;
display: flex;
flex-direction: column;
align-items: center;
margin: 24px 0 0;
padding: 0;
}
.skillbox-wrapper {
width: 100%;
max-width: 900px;
box-sizing: border-box;
display: flex;
flex-direction: column;
align-items: center;
margin: 0 auto;
}
.skillbox-tabs-separator {
width: 100vw;
height: 2px;
background: #ccc;
margin: 0 calc(-50vw + 50%);
}
.skillbox-tabs {
display: flex;
flex-wrap: wrap;
justify-content: center;
width: 100%;
gap: 6px;
padding: 0;
margin-bottom: -2px;
}
.skillbox-tab {
cursor: pointer;
background: #eaf1fb;
color: #1d3f63;
border: 2px solid #337ab7;
border-bottom: none;
border-radius: 6px 6px 0 0;
padding: 8px 16px;
font-size: 1em;
font-weight: bold;
transition: background 0.2s ease;
}
.skillbox-tab.active,
.skillbox-tab:hover {
background: #337ab7;
color: #fff;
border-color: #337ab7;
border-bottom: none;
}
.skillbox-desc {
font-size: 1em;
width: 100%;
max-width: 840px;
text-align: center;
font-weight: 500;
line-height: 1.6;
margin: 0 auto;
color: #222;
padding: 12px 0 8px;
}
.skillbox-video-area {
width: 100%;
max-width: 900px;
display: flex;
justify-content: center;
align-items: center;
padding: 0 !important;
margin: 0 auto !important;
}
.skillbox-video video {
width: 100%;
max-width: 720px;
min-height: 270px;
background: #000;
border-radius: 6px;
display: block;
margin: 0 auto;
padding: 0;
vertical-align: middle;
}
@media (max-width: 768px) {
.skillbox-tab {
padding: 8px 14px;
font-size: 1.05em;
}
.skillbox-desc {
font-size: 0.95em;
padding: 10px 0 6px;
}
.skillbox-video video {
max-width: 100%;
min-height: 220px;
}
}