MediaWiki:Common.css: Difference between revisions
Appearance
No edit summary |
No edit summary |
||
| Line 12: | Line 12: | ||
} | } | ||
.bok- | /* ============================================= | ||
max-width: | SCRUM MANAGER BOK — ESTILOS PERSONALIZADOS | ||
margin: 0 | ============================================= */ | ||
.bok-hero { | |||
text-align: center; | |||
padding: 28px 20px; | |||
background: #f0faf6; | |||
border: 1px solid #c8ead9; | |||
border-radius: 10px; | |||
margin-bottom: 24px; | |||
} | |||
.bok-hero p { | |||
color: #444; | |||
font-size: 14px; | |||
line-height: 1.7; | |||
margin: 0 auto 14px; | |||
max-width: 560px; | |||
} | |||
.bok-hero-titulo { | |||
font-size: 21px !important; | |||
font-weight: 500 !important; | |||
color: #111 !important; | |||
margin-bottom: 10px !important; | |||
border: none !important; | |||
} | |||
.bok-hero-etiqueta { | |||
font-size: 11px; | |||
letter-spacing: .08em; | |||
text-transform: uppercase; | |||
color: #0F6E56; | |||
font-weight: 600; | |||
margin-bottom: 10px; | |||
} | |||
.bok-stats { | |||
display: flex; | |||
justify-content: center; | |||
gap: 16px; | |||
flex-wrap: wrap; | |||
font-size: 13px; | |||
color: #888; | |||
margin-top: 4px; | |||
} | |||
.bok-stats strong { | |||
color: #111; | |||
} | |||
.bok-stats .verde { | |||
color: #0F6E56; | |||
font-weight: 600; | |||
} | |||
.bok-section-label { | |||
font-size: 10px; | |||
letter-spacing: .07em; | |||
text-transform: uppercase; | |||
color: #aaa; | |||
font-weight: 600; | |||
margin-bottom: 12px; | |||
display: block; | |||
} | |||
.bok-cat-grid { | |||
display: grid; | |||
grid-template-columns: repeat(4, 1fr); | |||
gap: 10px; | |||
margin: 4px 0 24px; | |||
} | |||
.bok-cat-card { | |||
background: #fff; | |||
border: 1px solid #e0e0e0; | |||
border-radius: 8px; | |||
padding: 14px 12px; | |||
} | |||
.bok-cat-card:hover { | |||
border-color: #1D9E75; | |||
} | |||
.bok-cat-card a { | |||
color: #0F6E56 !important; | |||
font-weight: 500; | |||
text-decoration: none !important; | |||
font-size: 13px; | |||
display: block; | |||
margin-bottom: 3px; | |||
} | |||
.bok-cat-count { | |||
font-size: 11px; | |||
color: #aaa; | |||
display: block; | |||
} | |||
.bok-manuals-grid { | |||
display: grid; | |||
grid-template-columns: repeat(2, 1fr); | |||
gap: 10px; | |||
margin: 4px 0 24px; | |||
} | |||
.bok-manual-card { | |||
display: flex; | |||
gap: 10px; | |||
border: 1px solid #e0e0e0; | |||
border-radius: 8px; | |||
padding: 12px; | |||
align-items: flex-start; | |||
} | |||
.bok-manual-card .portada { | |||
width: 38px; | |||
height: 52px; | |||
border-radius: 4px; | |||
flex-shrink: 0; | |||
display: flex; | |||
align-items: center; | |||
justify-content: center; | |||
font-size: 9px; | |||
color: white; | |||
font-weight: 600; | |||
text-align: center; | |||
line-height: 1.3; | |||
padding: 4px; | |||
} | |||
.bok-manual-card .info .titulo { | |||
font-size: 13px; | |||
font-weight: 500; | |||
color: #111; | |||
display: block; | |||
margin-bottom: 2px; | |||
} | |||
.bok-manual-card .info .sub { | |||
font-size: 11px; | |||
color: #888; | |||
display: block; | |||
margin-bottom: 6px; | |||
} | |||
.bok-manual-card .info a { | |||
font-size: 12px; | |||
color: #0F6E56 !important; | |||
text-decoration: none !important; | |||
} | |||
.bok-updates { | |||
border: 1px solid #e0e0e0; | |||
border-radius: 8px; | |||
overflow: hidden; | |||
margin: 4px 0 24px; | |||
} | |||
.bok-update-item { | |||
display: flex; | |||
justify-content: space-between; | |||
align-items: center; | |||
padding: 9px 14px; | |||
border-bottom: 1px solid #f0f0f0; | |||
font-size: 13px; | |||
} | |||
.bok-update-item:last-child { | |||
border-bottom: none; | |||
} | |||
.bok-update-item a { | |||
color: #0F6E56 !important; | |||
text-decoration: none !important; | |||
} | |||
.bok-update-meta { | |||
font-size: 11px; | |||
color: #aaa; | |||
flex-shrink: 0; | |||
margin-left: 10px; | |||
} | |||
.bok-update-cat { | |||
font-size: 11px; | |||
color: #aaa; | |||
display: block; | |||
margin-top: 1px; | |||
} | |||
.bok-ecosistema { | |||
background: #f0faf6; | |||
border: 1px solid #1D9E75; | border: 1px solid #1D9E75; | ||
border-radius: 10px; | |||
padding: 16px 20px; | |||
margin-bottom: 20px; | |||
display: flex; | |||
justify-content: space-between; | |||
align-items: center; | |||
gap: 16px; | |||
flex-wrap: wrap; | |||
} | |||
.bok-ecosistema .titulo { | |||
font-size: 15px; | |||
font-weight: 500; | |||
color: #111; | |||
display: block; | |||
margin-bottom: 3px; | |||
} | |||
.bok-ecosistema .sub { | |||
font-size: 13px; | |||
color: #555; | |||
} | |||
.bok-ecosistema .botones { | |||
display: flex; | |||
gap: 8px; | |||
flex-shrink: 0; | |||
} | |||
.bok-btn-p { | |||
display: inline-block; | |||
background: #1D9E75; | |||
color: white !important; | |||
padding: 7px 14px; | |||
border-radius: 6px; | |||
font-size: 13px; | |||
font-weight: 500; | |||
text-decoration: none !important; | |||
white-space: nowrap; | |||
} | |||
.bok-btn-s { | |||
display: inline-block; | |||
background: transparent; | |||
color: #0F6E56 !important; | |||
border: 1px solid #1D9E75; | |||
padding: 7px 14px; | |||
border-radius: 6px; | |||
font-size: 13px; | |||
text-decoration: none !important; | |||
white-space: nowrap; | |||
} | |||
.bok-def { | |||
border-left: 3px solid #1D9E75; | |||
background: #f0faf6; | |||
padding: 12px 16px; | |||
border-radius: 0 8px 8px 0; | |||
margin: 14px 0 18px; | |||
font-size: 14px; | |||
line-height: 1.7; | |||
} | |||
.bok-aviso { | |||
border: 1px solid #f0c36d; | |||
background: #fffbf0; | |||
border-radius: 8px; | border-radius: 8px; | ||
padding: | padding: 11px 14px; | ||
margin: 12px 0; | |||
font-size: 13px; | |||
line-height: 1.65; | |||
} | } | ||
.bok- | .bok-recurso { | ||
color: # | display: flex; | ||
gap: 10px; | |||
align-items: flex-start; | |||
border: 1px solid #e0e0e0; | |||
border-radius: 8px; | |||
padding: 10px 12px; | |||
margin: 6px 0; | |||
font-size: 13px; | |||
} | |||
.bok-recurso a { | |||
color: #0F6E56 !important; | |||
text-decoration: none !important; | text-decoration: none !important; | ||
font-size: 14px; | } | ||
.bok-recurso .detalle { | |||
font-size: 11px; | |||
color: #aaa; | |||
display: block; | |||
margin-top: 1px; | |||
} | |||
.bok-cta-articulo { | |||
background: #f0faf6; | |||
border: 1px solid #c8ead9; | |||
border-radius: 8px; | |||
padding: 14px 16px; | |||
margin: 20px 0; | |||
font-size: 13px; | |||
} | |||
.bok-cta-articulo .titulo { | |||
font-weight: 500; | |||
color: #111; | |||
display: block; | |||
margin-bottom: 4px; | |||
} | |||
.bok-cta-articulo a { | |||
color: #0F6E56 !important; | |||
} | |||
.verde { | |||
color: #0F6E56; | |||
font-weight: 600; | |||
} | |||
@media (max-width: 700px) { | |||
.bok-cat-grid { grid-template-columns: repeat(2, 1fr); } | |||
.bok-manuals-grid { grid-template-columns: 1fr; } | |||
.bok-ecosistema { flex-direction: column; } | |||
} | } | ||
Revision as of 12:37, 11 May 2026
/* CSS placed here will be applied to all skins */
#ca-history { display:none!important; }
#ca-talk { display:none!important; }
/* To make images responsive */
.res-img img {
max-width:100%;
height:auto;
}
img {
max-width:100%;
height:auto;
}
/* =============================================
SCRUM MANAGER BOK — ESTILOS PERSONALIZADOS
============================================= */
.bok-hero {
text-align: center;
padding: 28px 20px;
background: #f0faf6;
border: 1px solid #c8ead9;
border-radius: 10px;
margin-bottom: 24px;
}
.bok-hero p {
color: #444;
font-size: 14px;
line-height: 1.7;
margin: 0 auto 14px;
max-width: 560px;
}
.bok-hero-titulo {
font-size: 21px !important;
font-weight: 500 !important;
color: #111 !important;
margin-bottom: 10px !important;
border: none !important;
}
.bok-hero-etiqueta {
font-size: 11px;
letter-spacing: .08em;
text-transform: uppercase;
color: #0F6E56;
font-weight: 600;
margin-bottom: 10px;
}
.bok-stats {
display: flex;
justify-content: center;
gap: 16px;
flex-wrap: wrap;
font-size: 13px;
color: #888;
margin-top: 4px;
}
.bok-stats strong {
color: #111;
}
.bok-stats .verde {
color: #0F6E56;
font-weight: 600;
}
.bok-section-label {
font-size: 10px;
letter-spacing: .07em;
text-transform: uppercase;
color: #aaa;
font-weight: 600;
margin-bottom: 12px;
display: block;
}
.bok-cat-grid {
display: grid;
grid-template-columns: repeat(4, 1fr);
gap: 10px;
margin: 4px 0 24px;
}
.bok-cat-card {
background: #fff;
border: 1px solid #e0e0e0;
border-radius: 8px;
padding: 14px 12px;
}
.bok-cat-card:hover {
border-color: #1D9E75;
}
.bok-cat-card a {
color: #0F6E56 !important;
font-weight: 500;
text-decoration: none !important;
font-size: 13px;
display: block;
margin-bottom: 3px;
}
.bok-cat-count {
font-size: 11px;
color: #aaa;
display: block;
}
.bok-manuals-grid {
display: grid;
grid-template-columns: repeat(2, 1fr);
gap: 10px;
margin: 4px 0 24px;
}
.bok-manual-card {
display: flex;
gap: 10px;
border: 1px solid #e0e0e0;
border-radius: 8px;
padding: 12px;
align-items: flex-start;
}
.bok-manual-card .portada {
width: 38px;
height: 52px;
border-radius: 4px;
flex-shrink: 0;
display: flex;
align-items: center;
justify-content: center;
font-size: 9px;
color: white;
font-weight: 600;
text-align: center;
line-height: 1.3;
padding: 4px;
}
.bok-manual-card .info .titulo {
font-size: 13px;
font-weight: 500;
color: #111;
display: block;
margin-bottom: 2px;
}
.bok-manual-card .info .sub {
font-size: 11px;
color: #888;
display: block;
margin-bottom: 6px;
}
.bok-manual-card .info a {
font-size: 12px;
color: #0F6E56 !important;
text-decoration: none !important;
}
.bok-updates {
border: 1px solid #e0e0e0;
border-radius: 8px;
overflow: hidden;
margin: 4px 0 24px;
}
.bok-update-item {
display: flex;
justify-content: space-between;
align-items: center;
padding: 9px 14px;
border-bottom: 1px solid #f0f0f0;
font-size: 13px;
}
.bok-update-item:last-child {
border-bottom: none;
}
.bok-update-item a {
color: #0F6E56 !important;
text-decoration: none !important;
}
.bok-update-meta {
font-size: 11px;
color: #aaa;
flex-shrink: 0;
margin-left: 10px;
}
.bok-update-cat {
font-size: 11px;
color: #aaa;
display: block;
margin-top: 1px;
}
.bok-ecosistema {
background: #f0faf6;
border: 1px solid #1D9E75;
border-radius: 10px;
padding: 16px 20px;
margin-bottom: 20px;
display: flex;
justify-content: space-between;
align-items: center;
gap: 16px;
flex-wrap: wrap;
}
.bok-ecosistema .titulo {
font-size: 15px;
font-weight: 500;
color: #111;
display: block;
margin-bottom: 3px;
}
.bok-ecosistema .sub {
font-size: 13px;
color: #555;
}
.bok-ecosistema .botones {
display: flex;
gap: 8px;
flex-shrink: 0;
}
.bok-btn-p {
display: inline-block;
background: #1D9E75;
color: white !important;
padding: 7px 14px;
border-radius: 6px;
font-size: 13px;
font-weight: 500;
text-decoration: none !important;
white-space: nowrap;
}
.bok-btn-s {
display: inline-block;
background: transparent;
color: #0F6E56 !important;
border: 1px solid #1D9E75;
padding: 7px 14px;
border-radius: 6px;
font-size: 13px;
text-decoration: none !important;
white-space: nowrap;
}
.bok-def {
border-left: 3px solid #1D9E75;
background: #f0faf6;
padding: 12px 16px;
border-radius: 0 8px 8px 0;
margin: 14px 0 18px;
font-size: 14px;
line-height: 1.7;
}
.bok-aviso {
border: 1px solid #f0c36d;
background: #fffbf0;
border-radius: 8px;
padding: 11px 14px;
margin: 12px 0;
font-size: 13px;
line-height: 1.65;
}
.bok-recurso {
display: flex;
gap: 10px;
align-items: flex-start;
border: 1px solid #e0e0e0;
border-radius: 8px;
padding: 10px 12px;
margin: 6px 0;
font-size: 13px;
}
.bok-recurso a {
color: #0F6E56 !important;
text-decoration: none !important;
}
.bok-recurso .detalle {
font-size: 11px;
color: #aaa;
display: block;
margin-top: 1px;
}
.bok-cta-articulo {
background: #f0faf6;
border: 1px solid #c8ead9;
border-radius: 8px;
padding: 14px 16px;
margin: 20px 0;
font-size: 13px;
}
.bok-cta-articulo .titulo {
font-weight: 500;
color: #111;
display: block;
margin-bottom: 4px;
}
.bok-cta-articulo a {
color: #0F6E56 !important;
}
.verde {
color: #0F6E56;
font-weight: 600;
}
@media (max-width: 700px) {
.bok-cat-grid { grid-template-columns: repeat(2, 1fr); }
.bok-manuals-grid { grid-template-columns: 1fr; }
.bok-ecosistema { flex-direction: column; }
}