MediaWiki:Vector-2022.css
Wygląd
Uwaga: aby zobaczyć zmiany po opublikowaniu, może zajść potrzeba wyczyszczenia pamięci podręcznej przeglądarki.
- Firefox / Safari: Przytrzymaj Shift podczas klikania Odśwież bieżącą stronę, lub naciśnij klawisze Ctrl+F5, lub Ctrl+R (⌘-R na komputerze Mac)
- Google Chrome: Naciśnij Ctrl-Shift-R (⌘-Shift-R na komputerze Mac)
- Edge: Przytrzymaj Ctrl, jednocześnie klikając Odśwież, lub naciśnij klawisze Ctrl+F5.
- Opera: Naciśnij klawisze Ctrl+F5.
```css
/* === Styl DarkVector dla Vector 2022 === */
/* --- Tło i tekst --- */
.skin-vector-2022,
.skin-vector-2022 body {
background-color: #2b2b2b !important;
color: #cccccc !important;
}
/* --- Linki --- */
.skin-vector-2022 a {
color: #ffcc66 !important;
}
.skin-vector-2022 a:visited {
color: #d4aa00 !important;
}
.skin-vector-2022 a.new {
color: #ff6666 !important;
}
/* --- Sidebar (lewe menu) --- */
.skin-vector-2022 .mw-sidebar {
background-color: #1a1a1a !important;
border-right: none !important;
}
/* --- Nagłówek --- */
.skin-vector-2022 .mw-header,
.skin-vector-2022 #mw-head {
background-color: #1a1a1a !important;
color: #cccccc !important;
}
/* --- Pasek wyszukiwania --- */
.skin-vector-2022 .vector-search-box,
.skin-vector-2022 .vector-search-box input {
background-color: #333333 !important;
color: #ffffff !important;
}
/* --- Footer --- */
.skin-vector-2022 .mw-footer {
background-color: #1a1a1a !important;
color: #cccccc !important;
}
/* --- Pola edycji i formularze --- */
.skin-vector-2022 input,
.skin-vector-2022 textarea,
.skin-vector-2022 select {
background-color: #333333 !important;
color: #ffffff !important;
border: 1px solid #555555;
}
/* --- Nagłówki --- */
.skin-vector-2022 h1,
.skin-vector-2022 h2,
.skin-vector-2022 h3,
.skin-vector-2022 h4 {
color: #ffcc66 !important;
}
/* --- Pasek narzędzi użytkownika --- */
.skin-vector-2022 .vector-user-links {
background-color: #1a1a1a !important;
}
/* --- Pasek zakładek artykułu --- */
.skin-vector-2022 .vector-page-toolbar {
background-color: #1a1a1a !important;
}
/* --- Bloki komunikatów --- */
.skin-vector-2022 .mw-message-box {
background-color: #333333 !important;
border: 1px solid #555555;
color: #ffffff !important;
}
/* === Stylizacja przycisków === */
/* --- Główne przyciski --- */
.skin-vector-2022 .mw-ui-button,
.skin-vector-2022 .oo-ui-buttonElement-button {
background-color: #ffcc66 !important;
color: #2b2b2b !important;
border: none !important;
box-shadow: none !important;
}
/* --- Efekt najechania kursorem --- */
.skin-vector-2022 .mw-ui-button:hover,
.skin-vector-2022 .oo-ui-buttonElement-button:hover {
background-color: #e6b800 !important;
color: #000000 !important;
}
/* --- Przycisk "Zapisz stronę" --- */
.skin-vector-2022 .oo-ui-flaggedElement-primary .oo-ui-buttonElement-button {
background-color: #ffcc66 !important;
color: #2b2b2b !important;
}
/* --- Efekt najechania na "Zapisz stronę" --- */
.skin-vector-2022 .oo-ui-flaggedElement-primary .oo-ui-buttonElement-button:hover {
background-color: #e6b800 !important;
color: #000000 !important;
}
/* === Styl WikiEditor (pasek narzędzi edytora) === */
.skin-vector-2022 .mw-edittoolbar,
.skin-vector-2022 .wikiEditor-ui-toolbar,
.skin-vector-2022 .wikiEditor-ui-toolbar .tabs,
.skin-vector-2022 .wikiEditor-ui-toolbar .sections,
.skin-vector-2022 .wikiEditor-ui-toolbar .group {
background-color: #1b1b1b !important;
border: none !important;
}
.skin-vector-2022 .wikiEditor-ui-toolbar .group input,
.skin-vector-2022 .wikiEditor-ui-toolbar .tool-select {
background-color: #2b2b2b !important;
color: #e0e0e0 !important;
border: 1px solid #444 !important;
}
.skin-vector-2022 .wikiEditor-ui-toolbar .tool {
background-color: #2b2b2b !important;
color: #e0e0e0 !important;
}
.skin-vector-2022 .wikiEditor-ui-toolbar .tool:hover,
.skin-vector-2022 .wikiEditor-ui-toolbar .tool:focus {
background-color: #3a3a3a !important;
color: #ffffff !important;
}
.skin-vector-2022 .wikiEditor-ui-toolbar .tabs span,
.skin-vector-2022 .wikiEditor-ui-toolbar .sections span {
color: #cccccc !important;
}
.skin-vector-2022 .wikiEditor-ui-toolbar .tool img {
filter: brightness(0.8) invert(0.9);
}
#scrollTopBtn {
display: none;
position: fixed;
bottom: 100px;
left: 40px;
z-index: 9999;
width: 60px;
height: 60px;
background: radial-gradient(circle at center, #ffcc66, #e6b800);
color: #1a1a1a;
border: none;
border-radius: 50%;
box-shadow: 0 0 10px rgba(255, 204, 102, 0.6);
font-size: 28px;
cursor: pointer;
transition: bottom 0.3s ease, transform 0.3s ease, opacity 0.3s ease;
opacity: 0.8;
}
#scrollTopBtn:hover {
transform: scale(1.15);
box-shadow: 0 0 20px rgba(255, 204, 102, 0.8);
opacity: 1;
}
/* ===== KARTY EXPO ===== */
.card-grid {
display: flex;
flex-wrap: wrap;
justify-content: center;
gap: 30px;
margin: 30px 0;
}
.card {
width: 280px;
display: flex;
flex-direction: column;
align-items: center;
text-align: center;
font-weight: bold;
font-size: 14px;
color: #ccc;
--neon: #00ff99;
}
.card img {
width: 100%;
height: auto;
display: block;
border: 2px solid var(--neon);
border-radius: 8px;
box-shadow: 0 0 10px var(--neon);
transition: transform 0.3s ease,
box-shadow 0.3s ease;
}
.card img:hover {
transform: scale(1.05);
box-shadow:
0 0 20px var(--neon),
0 0 30px var(--neon);
}
.card-label {
margin-top: 8px;
}
/* ===== NAV GRID ===== */
.nav-grid {
display: grid;
grid-template-columns: repeat(auto-fit, minmax(120px, 1fr));
gap: 20px;
justify-items: center;
align-items: center;
margin: 30px 0;
}
.nav-tile img {
width: 100px;
height: 100px;
object-fit: cover;
border-radius: 12px;
box-shadow: 0 0 8px #00ff99;
transition: transform 0.2s ease, box-shadow 0.2s ease;
}
.nav-tile img:hover {
transform: scale(1.07);
box-shadow: 0 0 15px #00ff99;
}
/* ===== PORTALE ===== */
.portal-grid {
display: grid;
grid-template-columns: repeat(2, 1fr);
gap: 20px;
justify-content: center;
margin: 30px 0;
}
.portal-tile {
--neon: var(--user-neon, #00ff99);
border: 2px solid var(--neon);
border-radius: 12px;
overflow: hidden;
box-shadow: 0 0 10px var(--neon);
transition: transform 0.2s ease, box-shadow 0.2s ease;
}
.portal-tile:hover {
transform: scale(1.02);
box-shadow: 0 0 20px var(--neon), 0 0 30px var(--neon);
}
.portal-tile img {
width: 100%;
height: auto;
display: block;
}
/* Usuń tło i obramowania z obrazków PNG */
.skin-vector-2022 img[src$=".png"],
.skin-vector-2022 .mw-parser-output img[src$=".png"] {
background: transparent !important;
border: none !important;
box-shadow: none !important;
padding: 0 !important;
margin: 0 !important;
}
/* ===== MsCalendar – tylko poprawa czytelności pól i tekstu ===== */
/* Tekst wydarzeń w komórkach kalendarza */
.mscal-entry {
color: #000000 !important;
}
/* Okno dodawania / edycji wydarzenia – czytelne pola */
.ui-dialog input,
.ui-dialog select,
.ui-dialog textarea {
background-color: #ffffff !important;
color: #000000 !important;
border: 1px solid #888 !important;
}
```