Jump to content

User:One01/common.css: Difference between revisions

From Aurora 4x Wiki
No edit summary
No edit summary
 
(One intermediate revision by the same user not shown)
Line 3: Line 3:
*/
*/


/* ---------------------------------------------------------
/* START Recent Changes widget */
  1. COLOUR PALETTE
  --------------------------------------------------------- */
/*
:root {
    --scifi-bg: #070b12;
    --scifi-bg-2: #0a101a;
    --scifi-panel: #0d1622;
    --scifi-panel-2: #111d2b;


    --scifi-border: #26384b;
/* Recent edits widget */
    --scifi-border-light: #334a60;
.recent-edits-list {
 
     border: 1px solid #a2a9b1;
    --scifi-text: #d6dee8;
     border-radius: 8px;
    --scifi-text-muted: #8798aa;
     overflow: hidden;
 
     margin: 1em 0;
    --scifi-blue: #55aaff;
     background: var(--background-color-base, #fff);
    --scifi-blue-bright: #79bdff;
 
    --scifi-orange: #ff9d32;
    --scifi-orange-dark: #a85f1c;
    --scifi-yellow: #ffd166;
 
    --scifi-danger: #e85d5d;
}
 
 
/* ---------------------------------------------------------
  2. PAGE BACKGROUND
  --------------------------------------------------------- */
 
html,
body {
    background-color: var(--scifi-bg);
    color: var(--scifi-text);
}
 
/* Very subtle technical/grid texture */
body {
    background-image:
        radial-gradient(
            rgba(80, 130, 180, 0.055) 1px,
            transparent 1px
        );
    background-size: 40px 40px;
}
 
 
/* ---------------------------------------------------------
  3. MAIN PAGE
  --------------------------------------------------------- */
 
.mw-body {
    background:
        linear-gradient(
            145deg,
            rgba(17, 29, 43, 0.96),
            rgba(8, 14, 23, 0.98)
        );
 
     border: 1px solid var(--scifi-border);
     border-radius: 5px;
 
    box-shadow:
        0 8px 30px rgba(0, 0, 0, 0.35);
 
     padding: 1.5rem;
}
 
 
/* ---------------------------------------------------------
  4. PAGE TITLE
  --------------------------------------------------------- */
 
.firstHeading {
    color: #edf2f7;
 
    border-bottom:
        2px solid var(--scifi-orange-dark);
 
     padding-bottom: 0.35em;
 
     text-shadow:
        0 0 18px rgba(255, 157, 50, 0.08);
}
 
 
/* ---------------------------------------------------------
  5. HEADINGS
  --------------------------------------------------------- */
 
.mw-body h1,
.mw-body h2,
.mw-body h3,
.mw-body h4,
.mw-body h5,
.mw-body h6 {
    color: #e3eaf2;
}
 
.mw-body h2 {
    border-bottom: 1px solid var(--scifi-border);
 
    padding-bottom: 0.25em;
 
    background:
        linear-gradient(
            90deg,
            rgba(255, 157, 50, 0.10),
            transparent 65%
        );
 
    padding-left: 0.45em;
}
 
.mw-body h3 {
    color: #dce6ef;
}
 
 
/* ---------------------------------------------------------
  6. LINKS
  --------------------------------------------------------- */
 
.mw-body a {
    color: var(--scifi-blue);
    text-decoration: none;
}
 
.mw-body a:visited {
    color: #a99cff;
}
 
.mw-body a:hover {
    color: var(--scifi-yellow);
 
    text-decoration: none;
 
    text-shadow:
        0 0 8px rgba(255, 190, 70, 0.35);
}
 
 
/* ---------------------------------------------------------
  7. HEADER
  --------------------------------------------------------- */
 
.vector-header-container {
    background:
        linear-gradient(
            90deg,
            #070b12,
            #101c2a 50%,
            #070b12
        );
 
    border-bottom: 1px solid var(--scifi-border);
}
 
/* Orange technical accent underneath header */
.vector-header-container::after {
    content: "";
 
    display: block;
 
    height: 2px;
 
    background:
        linear-gradient(
            90deg,
            transparent,
            var(--scifi-orange-dark),
            var(--scifi-orange),
            var(--scifi-orange-dark),
            transparent
        );
}
 
 
/* ---------------------------------------------------------
  8. VECTOR SIDEBAR / NAVIGATION
  --------------------------------------------------------- */
 
.vector-menu-portal {
    color: var(--scifi-text-muted);
}
 
.vector-menu-portal h3 {
    color: var(--scifi-orange);
 
    text-transform: uppercase;
 
    letter-spacing: 0.08em;
 
    font-size: 0.75rem;
}
 
.vector-menu-portal a {
    color: #aab8c8;
 
    transition:
        background 0.15s ease,
        color 0.15s ease;
}
 
.vector-menu-portal a:hover {
    color: var(--scifi-yellow);
 
    background:
        rgba(255, 157, 50, 0.08);
}
 
 
/* ---------------------------------------------------------
  9. VECTOR TABS
  --------------------------------------------------------- */
 
.vector-menu-tabs {
    border-color: var(--scifi-border);
}
 
.vector-menu-tabs li {
    background: transparent;
}
 
.vector-menu-tabs li a {
    color: var(--scifi-text-muted);
}
}


.vector-menu-tabs li.selected a,
.recent-edits-heading {
.vector-menu-tabs li a:hover {
    padding: 12px 14px;
     color: var(--scifi-yellow);
    font-size: 1.1em;
    font-weight: 700;
     background: var(--background-color-neutral-subtle, #eaecf0);
    border-bottom: 1px solid #a2a9b1;
}
}


 
.recent-edits-row {
/* ---------------------------------------------------------
     padding: 10px 14px;
  10. SEARCH BAR
    border-bottom: 1px solid #eaecf0;
  --------------------------------------------------------- */
 
.vector-search-box {
     color: var(--scifi-text);
}
}


.vector-search-box input {
.recent-edits-page {
     background: #080e17;
     font-weight: 600;
 
     font-size: 1em;
    color: var(--scifi-text);
 
    border: 1px solid var(--scifi-border);
 
    border-radius: 3px;
}
 
.vector-search-box input:focus {
    border-color: var(--scifi-orange);
 
    box-shadow:
        0 0 0 1px var(--scifi-orange),
        0 0 12px rgba(255, 157, 50, 0.15);
}
 
.vector-search-box input::placeholder {
    color: #68798b;
}
 
 
/* ---------------------------------------------------------
  11. BUTTONS
  --------------------------------------------------------- */
 
.mw-ui-button,
button,
input[type="submit"] {
    background:
        linear-gradient(
            180deg,
            #18283a,
            #101b29
        );
 
    color: var(--scifi-text);
 
    border: 1px solid var(--scifi-border-light);
 
     border-radius: 3px;
}
}


.mw-ui-button:hover,
.recent-edits-details {
button:hover,
    margin-top: 4px;
input[type="submit"]:hover {
     font-size: 0.85em;
     color: var(--scifi-yellow);
     color: var(--color-subtle, #72777d);
 
     border-color: var(--scifi-orange-dark);
 
    background:
        linear-gradient(
            180deg,
            #213449,
            #142334
        );
}
}


 
.recent-edits-footer {
/* ---------------------------------------------------------
     padding: 10px 14px;
  12. TABLE OF CONTENTS
     font-size: 0.9em;
  --------------------------------------------------------- */
     background: var(--background-color-neutral-subtle, #f8f9fa);
 
#toc,
.toc {
     background:
        linear-gradient(
            145deg,
            #0d1724,
            #0a111b
        );
 
     border: 1px solid var(--scifi-border);
 
     border-left:
        3px solid var(--scifi-orange-dark);
 
    border-radius: 3px;
 
    box-shadow:
        0 4px 15px rgba(0, 0, 0, 0.25);
}
}


#toc .toctitle,
/* END Recent Changes widget */
.toc .toctitle {
    color: var(--scifi-yellow);
 
    letter-spacing: 0.04em;
}
 
#toc a,
.toc a {
    color: var(--scifi-blue);
}
 
#toc a:hover,
.toc a:hover {
    color: var(--scifi-yellow);
}
 
 
/* ---------------------------------------------------------
  13. WIKITABLES
  --------------------------------------------------------- */
 
.wikitable {
    background: #0b1420;
 
    color: var(--scifi-text);
 
    border: 1px solid var(--scifi-border);
 
    border-collapse: collapse;
}
 
.wikitable th {
    background:
        linear-gradient(
            90deg,
            #18293a,
            #101c2a
        );
 
    color: var(--scifi-yellow);
 
    border: 1px solid var(--scifi-border);
 
    font-weight: bold;
}
 
.wikitable td {
    border: 1px solid var(--scifi-border);
}
 
.wikitable tr:nth-child(even) {
    background:
        rgba(255, 255, 255, 0.015);
}
 
.wikitable tr:hover {
    background:
        rgba(255, 157, 50, 0.045);
}
 
 
/* ---------------------------------------------------------
  14. INFOBOXES
  --------------------------------------------------------- */
 
.infobox {
    background:
        linear-gradient(
            145deg,
            #0d1724,
            #09111b
        );
 
    color: var(--scifi-text);
 
    border: 1px solid var(--scifi-border);
 
    border-top:
        3px solid var(--scifi-orange-dark);
 
    border-radius: 4px;
 
    box-shadow:
        0 5px 20px rgba(0, 0, 0, 0.35);
}
 
.infobox th {
    background:
        linear-gradient(
            90deg,
            #18293a,
            #101c2a
        );
 
    color: var(--scifi-yellow);
 
    border-bottom:
        1px solid var(--scifi-orange-dark);
}
 
.infobox td,
.infobox th {
    border-color: var(--scifi-border);
}
 
 
/* ---------------------------------------------------------
  15. CODE / PRE
  --------------------------------------------------------- */
 
pre,
.mw-code,
.mw-highlight {
    background: #050a10;
 
    color: #bcd3e8;
 
    border: 1px solid var(--scifi-border);
 
    border-left:
        3px solid var(--scifi-orange-dark);
 
    border-radius: 3px;
}
 
code {
    color: #ffbd63;
 
    background:
        rgba(255, 157, 50, 0.06);
 
    border-radius: 2px;
}
 
 
/* ---------------------------------------------------------
  16. BLOCKQUOTES
  --------------------------------------------------------- */
 
blockquote {
    background:
        rgba(30, 50, 70, 0.35);
 
    border-left:
        3px solid var(--scifi-orange-dark);
 
    color: #aebdcb;
 
    padding: 0.7em 1em;
}
 
 
/* ---------------------------------------------------------
  17. HORIZONTAL RULES
  --------------------------------------------------------- */
 
hr {
    border: 0;
 
    height: 1px;
 
    background:
        linear-gradient(
            90deg,
            transparent,
            #33475d 20%,
            var(--scifi-orange-dark) 50%,
            #33475d 80%,
            transparent
        );
}
 
 
/* ---------------------------------------------------------
  18. CATEGORIES
  --------------------------------------------------------- */
 
.catlinks {
    background:
        #0b131e;
 
    border-top:
        1px solid var(--scifi-border);
 
    color: var(--scifi-text-muted);
}
 
.catlinks a {
    color: var(--scifi-blue);
}
 
 
/* ---------------------------------------------------------
  19. FOOTER
  --------------------------------------------------------- */
 
.mw-footer {
    color: var(--scifi-text-muted);
 
    border-top:
        1px solid var(--scifi-border);
}
 
.mw-footer a {
    color: #8fbff0;
}
 
 
/* ---------------------------------------------------------
  20. SPECIAL / SYSTEM PAGES
  --------------------------------------------------------- */
 
.mw-body .mw-warning {
    background:
        rgba(255, 157, 50, 0.08);
 
    border: 1px solid var(--scifi-orange-dark);
 
    color: #ffdca8;
}
 
.mw-body .errorbox {
    background:
        rgba(180, 50, 50, 0.10);
 
    border: 1px solid #743636;
 
    color: #ffb0b0;
}
 
 
/* ---------------------------------------------------------
  21. SUBTLE SCIFI ACCENT
  --------------------------------------------------------- */
 
/*
  Small orange indicator on the left side of major
  article sections.
*/
 
.mw-body h2::before {
    content: "◆";
 
    color: var(--scifi-orange);
 
    font-size: 0.45em;
 
    margin-right: 0.65em;
 
    vertical-align: middle;
 
    opacity: 0.8;
}
 
 
/* ---------------------------------------------------------
  22. SELECTION
  --------------------------------------------------------- */
 
::selection {
    background: rgba(255, 157, 50, 0.30);
 
    color: #ffffff;
}
*/

Latest revision as of 14:54, 24 October 2026

/*
Personal CSS for testing
*/

/* START Recent Changes widget */

/* Recent edits widget */
.recent-edits-list {
    border: 1px solid #a2a9b1;
    border-radius: 8px;
    overflow: hidden;
    margin: 1em 0;
    background: var(--background-color-base, #fff);
}

.recent-edits-heading {
    padding: 12px 14px;
    font-size: 1.1em;
    font-weight: 700;
    background: var(--background-color-neutral-subtle, #eaecf0);
    border-bottom: 1px solid #a2a9b1;
}

.recent-edits-row {
    padding: 10px 14px;
    border-bottom: 1px solid #eaecf0;
}

.recent-edits-page {
    font-weight: 600;
    font-size: 1em;
}

.recent-edits-details {
    margin-top: 4px;
    font-size: 0.85em;
    color: var(--color-subtle, #72777d);
}

.recent-edits-footer {
    padding: 10px 14px;
    font-size: 0.9em;
    background: var(--background-color-neutral-subtle, #f8f9fa);
}

/* END Recent Changes widget */