|
|
| Linha 1: |
Linha 1: |
| /* ========================================================== | | /* Wiki TokuDrive - visual básico estilo Wikipédia */ |
| Wiki TokuDrive - limpeza total da home
| |
| Remove menus, lateral, header e elementos atrás da home
| |
| ========================================================== */
| |
|
| |
|
| :root {
| |
| --td-bg: #080b12;
| |
| --td-surface: #111722;
| |
| --td-card: #141b28;
| |
| --td-card-2: #0f1520;
| |
| --td-text: #f5f7fb;
| |
| --td-muted: #aab4c8;
| |
| --td-border: rgba(255,255,255,.12);
| |
| --td-link: #9dbdff;
| |
| --td-accent: #e50914;
| |
| --td-accent-soft: rgba(229,9,20,.14);
| |
| --td-shadow: 0 24px 70px rgba(0,0,0,.42);
| |
| --td-radius: 28px;
| |
| }
| |
|
| |
| html[data-td-theme="light"] {
| |
| --td-bg: #f4f6fb;
| |
| --td-surface: #ffffff;
| |
| --td-card: #ffffff;
| |
| --td-card-2: #f8f9fc;
| |
| --td-text: #151823;
| |
| --td-muted: #667085;
| |
| --td-border: rgba(20,24,36,.12);
| |
| --td-link: #195ec8;
| |
| --td-accent-soft: rgba(229,9,20,.09);
| |
| --td-shadow: 0 18px 45px rgba(16,24,40,.10);
| |
| }
| |
|
| |
| /* fundo base */
| |
| html,
| |
| body { | | body { |
| background: var(--td-bg) !important; | | background: #f8f9fa; |
| color: var(--td-text) !important;
| |
| font-family: Inter, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif !important;
| |
| } | | } |
|
| |
|
| /* remove absolutamente toda navegação padrão/antiga */
| | .mw-body { |
| #td-topbar,
| | background: #ffffff; |
| #td-global-topnav,
| |
| #mw-panel,
| |
| #mw-navigation,
| |
| #mw-head,
| |
| #mw-page-base,
| |
| #p-logo,
| |
| #p-navigation,
| |
| #p-tb,
| |
| #p-lang,
| |
| #p-interaction,
| |
| #p-cactions,
| |
| #p-personal,
| |
| #siteNotice,
| |
| .mw-sidebar,
| |
| .mw-portlet,
| |
| .vector-sidebar-container,
| |
| .vector-main-menu,
| |
| .vector-main-menu-landmark,
| |
| .vector-column-start,
| |
| .vector-toc-landmark,
| |
| .vector-page-toolbar,
| |
| .vector-sticky-header,
| |
| .citizen-header,
| |
| .citizen-header-container,
| |
| .citizen-header__inner,
| |
| .citizen-header__start,
| |
| .citizen-header__end,
| |
| .citizen-header__button,
| |
| .citizen-drawer,
| |
| .citizen-drawer__card,
| |
| .citizen-sidebar,
| |
| .citizen-page-sidebar,
| |
| .citizen-toc,
| |
| .citizen-search,
| |
| .citizen-search-box,
| |
| .citizen-page-header,
| |
| .citizen-page-header__actions,
| |
| .citizen-page-actions,
| |
| .citizen-sticky-header,
| |
| .citizen-footer,
| |
| .mw-footer, | |
| #footer {
| |
| display: none !important; | |
| visibility: hidden !important;
| |
| opacity: 0 !important;
| |
| pointer-events: none !important;
| |
| width: 0 !important;
| |
| height: 0 !important;
| |
| min-width: 0 !important;
| |
| min-height: 0 !important;
| |
| max-width: 0 !important;
| |
| max-height: 0 !important;
| |
| overflow: hidden !important;
| |
| } | | } |
|
| |
|
| /* tira espaço reservado da lateral */
| | .mw-page-title-main { |
| body,
| | font-family: 'Linux Libertine', Georgia, Times, serif; |
| #content,
| | font-weight: normal; |
| .mw-body, | |
| .mw-body-content,
| |
| .citizen-page-container,
| |
| .citizen-body-container,
| |
| .citizen-body,
| |
| .mw-workspace-container,
| |
| .vector-body,
| |
| .mw-parser-output {
| |
| background: transparent !important;
| |
| color: var(--td-text) !important; | |
| margin-left: 0 !important;
| |
| padding-left: 0 !important;
| |
| grid-template-columns: 1fr !important;
| |
| grid-template-areas: none !important;
| |
| max-width: 100% !important;
| |
| width: 100% !important;
| |
| } | | } |
|
| |
|
| /* container geral */
| | .td-sourcebox { |
| #content, | | border: 1px solid #a2a9b1; |
| .mw-body,
| | background: #fffbea; |
| .citizen-page-container,
| | padding: 10px 12px; |
| .citizen-body-container {
| | margin: 12px 0 18px; |
| border: 0 !important; | | font-size: 13px; |
| box-shadow: none !important; | |
| } | | } |
|
| |
|
| /* remove título e categorias da home */
| |
| .page-Página_principal .mw-page-title-main,
| |
| .page-Página_principal .mw-first-heading,
| |
| .page-Página_principal .citizen-page-header,
| |
| .page-Página_principal .catlinks,
| |
| .page-Página_principal #catlinks,
| |
| .page-Página_principal .printfooter,
| |
| .page-Página_principal .mw-indicators,
| |
| .page-Página_principal .mw-parser-output > .catlinks,
| |
| .page-Página_principal .mw-parser-output > #catlinks {
| |
| display: none !important;
| |
| }
| |
|
| |
| /* se algum conteúdo antigo ficou antes da home, esconde */
| |
| .page-Página_principal .mw-parser-output > :not(.td-home) {
| |
| display: none !important;
| |
| }
| |
|
| |
| .page-Página_principal .mw-parser-output > .td-home {
| |
| display: block !important;
| |
| }
| |
|
| |
| /* links e artigos */
| |
| a,
| |
| a:visited {
| |
| color: var(--td-link);
| |
| }
| |
|
| |
| .mw-parser-output h1,
| |
| .mw-parser-output h2,
| |
| .mw-parser-output h3 {
| |
| color: var(--td-text);
| |
| border-color: var(--td-border);
| |
| }
| |
|
| |
| .mw-parser-output > p,
| |
| .mw-parser-output li {
| |
| font-size: 16px;
| |
| line-height: 1.72;
| |
| }
| |
|
| |
| /* elementos padrões dos artigos */
| |
| .toc,
| |
| #toc,
| |
| .catlinks,
| |
| .thumbinner,
| |
| .infobox,
| |
| .wikitable { | | .wikitable { |
| background: var(--td-card) !important; | | background: #f8f9fa; |
| color: var(--td-text) !important;
| | border: 1px solid #a2a9b1; |
| border: 1px solid var(--td-border) !important; | | border-collapse: collapse; |
| border-radius: 14px; | |
| } | | } |
|
| |
|
| .wikitable th, | | .wikitable th { |
| .infobox th {
| | background: #eaecf0; |
| background: rgba(127,127,127,.10) !important; | | font-weight: bold; |
| color: var(--td-text) !important; | |
| } | | } |
|
| |
|
| .wikitable td, | | .wikitable td, |
| .wikitable th { | | .wikitable th { |
| border: 1px solid var(--td-border) !important; | | border: 1px solid #a2a9b1; |
| | padding: 0.35em 0.55em; |
| } | | } |
|
| |
|
| .td-sourcebox { | | .infobox { |
| border: 1px solid rgba(229,9,20,.24); | | float: right; |
| background: var(--td-accent-soft); | | clear: right; |
| color: var(--td-text); | | width: 22em; |
| padding: 12px 14px; | | margin: 0 0 1em 1em; |
| margin: 14px 0 22px; | | background: #f8f9fa; |
| border-radius: 14px; | | border: 1px solid #a2a9b1; |
| font-size: 13px; | | border-spacing: 3px; |
| | font-size: 88%; |
| | line-height: 1.5em; |
| } | | } |
|
| |
|
| /* home */
| | .infobox th { |
| .td-home {
| | background: #eaecf0; |
| max-width: 1320px;
| |
| margin: 0 auto;
| |
| padding: 34px 18px 46px;
| |
| }
| |
| | |
| .td-hero { | |
| position: relative; | |
| overflow: hidden;
| |
| border-radius: 34px;
| |
| padding: clamp(34px, 6vw, 78px) 24px;
| |
| text-align: center; | | text-align: center; |
| background:
| |
| radial-gradient(circle at top left, rgba(229,9,20,.30), transparent 34%),
| |
| radial-gradient(circle at bottom right, rgba(40,105,230,.25), transparent 40%),
| |
| linear-gradient(135deg, var(--td-card), var(--td-card-2));
| |
| border: 1px solid var(--td-border);
| |
| box-shadow: var(--td-shadow);
| |
| } | | } |
|
| |
|
| .td-home-logo { | | .infobox td, |
| width: min(390px, 84vw);
| | .infobox th { |
| height: 125px;
| | padding: 4px 6px; |
| margin: 0 auto 12px;
| |
| background: url('/resources/assets/tokudrive-logo.png') center/contain no-repeat;
| |
| filter: drop-shadow(0 18px 32px rgba(0,0,0,.25));
| |
| }
| |
| | |
| .td-kicker { | |
| display: inline-flex;
| |
| align-items: center;
| |
| min-height: 34px;
| |
| padding: 0 15px; | |
| border-radius: 999px;
| |
| background: var(--td-accent-soft);
| |
| color: var(--td-accent);
| |
| font-size: 12px;
| |
| font-weight: 950;
| |
| text-transform: uppercase;
| |
| letter-spacing: .13em;
| |
| margin-bottom: 20px;
| |
| } | | } |
|
| |
|
| .td-title {
| | @media (max-width: 800px) { |
| font-size: clamp(42px, 7vw, 76px);
| | .infobox { |
| line-height: .96;
| | float: none; |
| letter-spacing: -.065em;
| |
| font-weight: 1000;
| |
| color: var(--td-text);
| |
| margin: 0 0 20px;
| |
| }
| |
| | |
| .td-subtitle {
| |
| max-width: 880px;
| |
| margin: 0 auto;
| |
| color: var(--td-muted);
| |
| font-size: clamp(16px, 2vw, 22px);
| |
| line-height: 1.58;
| |
| }
| |
| | |
| .td-search-area {
| |
| max-width: 820px;
| |
| margin: 32px auto 0;
| |
| }
| |
| | |
| .td-search-form {
| |
| display: flex;
| |
| gap: 10px;
| |
| padding: 8px;
| |
| border-radius: 999px;
| |
| background: rgba(255,255,255,.04);
| |
| border: 1px solid var(--td-border);
| |
| box-shadow: 0 12px 28px rgba(0,0,0,.12);
| |
| }
| |
| | |
| html[data-td-theme="light"] .td-search-form {
| |
| background: var(--td-card);
| |
| }
| |
| | |
| .td-search-input {
| |
| flex: 1;
| |
| min-width: 0;
| |
| border: 0;
| |
| outline: none;
| |
| background: transparent;
| |
| color: var(--td-text);
| |
| padding: 0 18px;
| |
| font-size: 16px;
| |
| }
| |
| | |
| .td-search-button {
| |
| border: 0;
| |
| border-radius: 999px;
| |
| padding: 0 24px;
| |
| min-height: 48px;
| |
| background: #ffffff;
| |
| color: #111620;
| |
| font-weight: 950;
| |
| cursor: pointer;
| |
| }
| |
| | |
| html[data-td-theme="light"] .td-search-button {
| |
| background: #111827;
| |
| color: #ffffff;
| |
| }
| |
| | |
| .td-section-head {
| |
| display: flex;
| |
| align-items: end;
| |
| justify-content: space-between;
| |
| gap: 18px;
| |
| margin: 36px 0 16px;
| |
| }
| |
| | |
| .td-section-head h2 {
| |
| margin: 0 !important;
| |
| padding: 0 !important;
| |
| border: 0 !important;
| |
| font-size: 28px;
| |
| letter-spacing: -.035em;
| |
| font-weight: 1000;
| |
| }
| |
| | |
| .td-section-head p {
| |
| margin: 0;
| |
| color: var(--td-muted);
| |
| font-size: 14px;
| |
| }
| |
| | |
| .td-latest-grid {
| |
| display: grid;
| |
| gap: 16px;
| |
| grid-template-columns: repeat(4, minmax(0, 1fr));
| |
| }
| |
| | |
| .td-latest-card,
| |
| .td-panel {
| |
| background: var(--td-card);
| |
| border: 1px solid var(--td-border);
| |
| border-radius: 24px;
| |
| box-shadow: 0 12px 30px rgba(0,0,0,.10);
| |
| }
| |
| | |
| html[data-td-theme="light"] .td-latest-card,
| |
| html[data-td-theme="light"] .td-panel {
| |
| box-shadow: 0 12px 30px rgba(0,0,0,.055);
| |
| }
| |
| | |
| .td-latest-card {
| |
| min-height: 165px;
| |
| padding: 19px;
| |
| display: flex;
| |
| flex-direction: column;
| |
| justify-content: space-between;
| |
| text-decoration: none !important;
| |
| transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease;
| |
| }
| |
| | |
| .td-latest-card:hover {
| |
| transform: translateY(-4px);
| |
| box-shadow: var(--td-shadow);
| |
| border-color: rgba(229,9,20,.36);
| |
| }
| |
| | |
| .td-latest-label {
| |
| color: var(--td-muted);
| |
| font-size: 12px;
| |
| font-weight: 950;
| |
| text-transform: uppercase;
| |
| letter-spacing: .10em;
| |
| }
| |
| | |
| .td-latest-title {
| |
| color: var(--td-text);
| |
| font-size: 19px;
| |
| line-height: 1.25;
| |
| font-weight: 1000;
| |
| margin: 12px 0;
| |
| }
| |
| | |
| .td-latest-date {
| |
| color: var(--td-muted);
| |
| font-size: 13px;
| |
| font-weight: 750;
| |
| }
| |
| | |
| .td-loading {
| |
| grid-column: 1 / -1;
| |
| padding: 22px;
| |
| border-radius: 24px;
| |
| background: var(--td-card);
| |
| border: 1px solid var(--td-border);
| |
| color: var(--td-muted);
| |
| }
| |
| | |
| .td-two-cols {
| |
| display: grid;
| |
| grid-template-columns: 1.1fr .9fr;
| |
| gap: 16px;
| |
| margin-top: 22px;
| |
| }
| |
| | |
| .td-panel {
| |
| padding: 24px;
| |
| }
| |
| | |
| .td-panel h2 {
| |
| margin-top: 0 !important;
| |
| padding-top: 0 !important;
| |
| border: 0 !important;
| |
| font-size: 25px;
| |
| font-weight: 1000;
| |
| }
| |
| | |
| .td-panel p {
| |
| color: var(--td-muted);
| |
| }
| |
| | |
| .td-link-list {
| |
| display: grid;
| |
| gap: 10px;
| |
| }
| |
| | |
| .td-link-list a {
| |
| display: block;
| |
| padding: 13px 15px;
| |
| border-radius: 14px;
| |
| background: rgba(127,127,127,.08);
| |
| text-decoration: none !important;
| |
| font-weight: 900;
| |
| }
| |
| | |
| .td-link-list a:hover {
| |
| background: var(--td-accent-soft);
| |
| }
| |
| | |
| /* botão tema */
| |
| #td-theme-toggle {
| |
| position: fixed;
| |
| right: 20px;
| |
| bottom: 18px;
| |
| z-index: 99999;
| |
| border: 1px solid var(--td-border);
| |
| background: var(--td-card);
| |
| color: var(--td-text);
| |
| box-shadow: var(--td-shadow);
| |
| border-radius: 999px;
| |
| padding: 10px 14px;
| |
| font-weight: 900;
| |
| cursor: pointer;
| |
| }
| |
| | |
| @media (max-width: 1120px) { | |
| .td-latest-grid { | |
| grid-template-columns: repeat(2, minmax(0, 1fr)); | |
| }
| |
| | |
| .td-two-cols {
| |
| grid-template-columns: 1fr;
| |
| }
| |
| }
| |
| | |
| @media (max-width: 660px) {
| |
| .td-home {
| |
| padding: 22px 12px 38px;
| |
| }
| |
| | |
| .td-hero {
| |
| border-radius: 24px;
| |
| padding: 30px 16px;
| |
| }
| |
| | |
| .td-home-logo {
| |
| height: 92px;
| |
| }
| |
| | |
| .td-search-form {
| |
| flex-direction: column;
| |
| border-radius: 18px;
| |
| padding: 12px;
| |
| }
| |
| | |
| .td-search-input {
| |
| min-height: 42px;
| |
| }
| |
| | |
| .td-search-button {
| |
| width: 100%; | | width: 100%; |
| }
| | margin: 0 0 1em 0; |
| | |
| .td-latest-grid {
| |
| grid-template-columns: 1fr;
| |
| }
| |
| | |
| .td-section-head {
| |
| display: block;
| |
| }
| |
| | |
| .td-section-head p {
| |
| margin-top: 6px; | |
| }
| |
| | |
| #td-theme-toggle {
| |
| right: 14px;
| |
| bottom: 14px;
| |
| font-size: 13px;
| |
| } | | } |
| } | | } |
