MediaWiki:Timeless.css: Difference between revisions

Revision as of 21:24, 18 August 2025

/* === Dark Mode for Timeless (ChatGPT-like, always on) === */

/* GLOBAL BACKGROUND & TEXT */
body {
  background-color: #1e1f20 !important;
  color: #e6e6e6 !important;
}
h1, h2, h3, h4, h5, h6 {
  color: #ffffff !important;
}

/* LINKS */
a {
  color: #10a37f !important;
}
a:visited {
  color: #8be9c9 !important;
}
a.new {
  color: #ff6b6b !important;
}

/* HEADER & NAVIGATION */
#mw-header {
  background-color: #2a2b2d !important;
  border-bottom: 1px solid #3a3b3d !important;
}
#mw-site-navigation,
#mw-related-navigation,
#mw-personaltools {
  background-color: #252627 !important;
  border-right: 1px solid #3a3b3d !important;
}
#mw-site-navigation a,
#mw-related-navigation a,
#mw-personaltools a {
  color: #d0d0d0 !important;
}
#mw-site-navigation a:hover,
#mw-related-navigation a:hover,
#mw-personaltools a:hover {
  color: #ffffff !important;
  background-color: #323334 !important;
  border-radius: 6px;
}

/* CONTENT AREA */
#mw-content {
  background-color: #1e1f20 !important;
  border: none !important;
  padding: 1.5em;
  border-radius: 8px;
  box-shadow: 0 0 12px rgba(0, 0, 0, 0.3);
}
#contentSub, .mw-indicators {
  color: #aaa !important;
}

/* FOOTER */
#mw-footer {
  background-color: #2a2b2d !important;
  border-top: 1px solid #3a3b3d !important;
  color: #aaa !important;
}

/* TABLES */
table {
  background-color: #2a2b2d !important;
  color: #e6e6e6 !important;
  border: 1px solid #3a3b3d !important;
}
th {
  background-color: #333435 !important;
  color: #ffffff !important;
}
td {
  border: 1px solid #3a3b3d !important;
}

/* FORMS */
input[type="text"],
input[type="password"],
input[type="number"],
input[type="email"],
textarea,
select {
  background-color: #2a2b2d !important;
  color: #ffffff !important;
  border: 1px solid #3a3b3d !important;
  border-radius: 6px;
  padding: 6px;
}
input:focus,
textarea:focus,
select:focus {
  outline: none;
  border-color: #10a37f !important;
  box-shadow: 0 0 4px #10a37f;
}

/* BUTTONS */
input[type="submit"],
button,
.mw-ui-button {
  background-color: #10a37f !important;
  color: #ffffff !important;
  border: none !important;
  border-radius: 8px;
  padding: 6px 12px;
  cursor: pointer;
}
input[type="submit"]:hover,
button:hover,
.mw-ui-button:hover {
  background-color: #0d8c6b !important;
}

/* DIFF VIEW */
td.diff-context {
  background: #252627 !important;
}
td.diff-addedline {
  background: #1e332d !important;
  color: #9ef5c3 !important;
}
td.diff-deletedline {
  background: #331e1e !important;
  color: #ff9a9a !important;
}
td.diff-marker {
  background: #2a2b2d !important;
}

/* CODE BLOCKS */
pre, code, .mw-code {
  background-color: #2a2b2d !important;
  color: #dcdcdc !important;
  border: 1px solid #3a3b3d !important;
  border-radius: 6px;
  padding: 6px 10px;
  font-family: monospace, monospace;
  font-size: 0.95em;
}

/* TOOLTIPS & POPUPS */
.mw-tooltip {
  background: #2a2b2d !important;
  color: #fff !important;
  border: 1px solid #3a3b3d !important;
}

/* CATEGORIES & PAGINATION */
.catlinks, .mw-pager-navigation-bar {
  background: #2a2b2d !important;
  border: 1px solid #3a3b3d !important;
  border-radius: 6px;
  padding: 4px;
}

/* === SIDEBAR / NAWIGACJA w Timeless === */

/* Całe tło sidebarów */
#mw-site-navigation,
#mw-related-navigation {
  background-color: #252627 !important;
  border-right: 1px solid #3a3b3d !important;
}

/* Poszczególne "klocki" sidebaru */
#mw-site-navigation .sidebar-chunk,
#mw-related-navigation .sidebar-chunk {
  background-color: #252627 !important;
  border-top: 1px solid #3a3b3d !important;
  padding: 4px;
}

/* Nagłówki sekcji sidebaru */
#mw-site-navigation .sidebar-heading,
#mw-related-navigation .sidebar-heading {
  color: #ffffff !important;
  background: #2a2b2d !important;
  padding: 4px 6px;
  border-radius: 6px;
  margin-bottom: 2px;
}

/* Linki w sidebarze */
#mw-site-navigation a,
#mw-related-navigation a {
  color: #d0d0d0 !important;
  display: block;
  padding: 4px 6px;
  border-radius: 6px;
}
#mw-site-navigation a:hover,
#mw-related-navigation a:hover {
  color: #ffffff !important;
  background-color: #323334 !important;
}