Jump to content

MediaWiki:Common.css: Difference between revisions

← Older editNewer edit →
ItzRafaelScout (talk | contribs)
Bureaucrats, Interface administrators, Administrators
5 edits
test
ItzRafaelScout (talk | contribs)
Bureaucrats, Interface administrators, Administrators
5 edits
test
Line 1: Line 1:
/* Windows XP-inspired MediaWiki Theme */
/* Windows XP MediaWiki Theme */
/* Purple Edition - Nostalgic UI Styling */
:root {
    --xp-blue: #0A246A;
    --xp-light-blue: #A6CAF0;
    --xp-gray: #F0F0F0;
    --xp-dark-gray: #808080;
    --xp-white: #FFFFFF;
    --xp-text-color: #000000;
    --xp-border-light: #FFFFFF;
    --xp-border-dark: #808080;
}


body {
body {
     font-family: 'Tahoma', 'Arial', sans-serif;
     font-family: 'Tahoma', sans-serif;
     background-color: #E1E4E6;
     background-color: var(--xp-gray);
     color: #000000;
     color: var(--xp-text-color);
     margin: 0;
     margin: 0;
     padding: 0;
     padding: 0;
}
}


/* Title Bar Styling */
/* Navigation Styling */
#top-section {
#p-navigation {
     background-color: #6A5ACD; /* Slate Purple */
     background-color: var(--xp-light-blue);
     color: #FFFFFF;
     border: 2px solid var(--xp-blue);
    height: 30px;
     border-radius: 4px;
    display: flex;
     padding: 5px;
    align-items: center;
     justify-content: space-between;
     padding: 0 10px;
    box-shadow: 0 2px 5px rgba(0,0,0,0.2);
}
}


#title-bar-text {
#p-navigation h3 {
    background-color: var(--xp-blue);
    color: var(--xp-white);
    padding: 3px 6px;
    margin: 0;
     font-weight: bold;
     font-weight: bold;
    font-size: 12px;
}
}


#title-bar-controls {
#p-navigation ul {
     display: flex;
    list-style-type: none;
     align-items: center;
     padding: 0;
     margin: 5px 0;
}
}


.title-bar-button {
#p-navigation li a {
     width: 25px;
    color: var(--xp-text-color);
     height: 20px;
    text-decoration: none;
     background-color: #8470FF;
    display: block;
     border: 1px solid #5D3FD3;
    padding: 2px 6px;
     margin-left: 5px;
    transition: background-color 0.2s;
}
 
#p-navigation li a:hover {
     background-color: var(--xp-blue);
     color: var(--xp-white);
}
 
/* Buttons */
.mw-submit-buttons button,
input[type="submit"],
input[type="button"] {
     background-color: var(--xp-gray);
     border: 1px solid var(--xp-border-dark);
    border-top-color: var(--xp-border-light);
     border-left-color: var(--xp-border-light);
    padding: 3px 10px;
    font-family: 'Tahoma', sans-serif;
    box-shadow: 1px 1px 2px rgba(0,0,0,0.2);
     cursor: pointer;
     cursor: pointer;
    transition: background-color 0.2s;
}
}


.title-bar-button:hover {
.mw-submit-buttons button:hover,
     background-color: #A084E8;
input[type="submit"]:hover,
input[type="button"]:hover {
     background-color: var(--xp-light-blue);
}
}


/* Navigation Styling */
/* Input Fields */
#sidebar {
input[type="text"],
     background-color: #F0F0F0;
input[type="password"],
     border-right: 1px solid #A0A0A0;
textarea {
     width: 180px;
    border: 1px solid var(--xp-border-dark);
     padding: 10px;
     background-color: var(--xp-white);
    padding: 2px;
     font-family: 'Tahoma', sans-serif;
}
 
/* Tabs */
#p-views ul {
    background-color: var(--xp-light-blue);
     border-bottom: 2px solid var(--xp-blue);
     padding: 5px;
}
}


#navigation-menu {
#p-views li {
     background-color: #FFFFFF;
     display: inline-block;
    border: 1px solid #C0C0C0;
     margin-right: 5px;
     border-radius: 4px;
}
}


.nav-item {
#p-views li a {
     padding: 5px 10px;
    background-color: var(--xp-gray);
     transition: background-color 0.2s;
    border: 1px solid var(--xp-border-dark);
     padding: 3px 8px;
    text-decoration: none;
     color: var(--xp-text-color);
}
}


.nav-item:hover {
#p-views li.selected a {
     background-color: #E6F2FF;
     background-color: var(--xp-blue);
     cursor: pointer;
     color: var(--xp-white);
}
}


/* Content Area */
/* Content Area */
#content-wrapper {
#content {
     background-color: #FFFFFF;
     background-color: var(--xp-white);
     border: 1px solid #A0A0A0;
     border: 2px solid var(--xp-blue);
    border-radius: 4px;
     padding: 15px;
     padding: 15px;
     margin: 10px;
     margin: 10px;
    box-shadow: 2px 2px 5px rgba(0,0,0,0.1);
}
}


/* Button Styling */
/* Headings */
.xp-button {
h1, h2, h3, h4, h5, h6 {
     background-color: #E1E4E6;
     color: var(--xp-blue);
     border: 1px solid #7F9DB9;
     border-bottom: 1px solid var(--xp-light-blue);
    color: #000000;
     padding-bottom: 5px;
     padding: 5px 15px;
}
     border-radius: 3px;
 
     transition: background-color 0.2s;
/* Links */
a {
     color: var(--xp-blue);
     text-decoration: none;
}
}


.xp-button:hover {
a:hover {
     background-color: #C0D9EF;
     text-decoration: underline;
    cursor: pointer;
}
}


/* Input Fields */
/* Sidebar */
input[type="text"],
#sidebar {
input[type="password"],
     background-color: var(--xp-gray);
textarea {
     border: 1px solid var(--xp-border-dark);
    border: 1px solid #A0A0A0;
     padding: 10px;
     background-color: #FFFFFF;
     padding: 4px;
     font-family: 'Tahoma', sans-serif;
}
}


/* Scrollbar Styling */
/* Scrollbars */
::-webkit-scrollbar {
::-webkit-scrollbar {
     width: 16px;
     width: 16px;
     background-color: #F0F0F0;
     background-color: var(--xp-gray);
}
}


::-webkit-scrollbar-thumb {
::-webkit-scrollbar-thumb {
     background-color: #A0A0A0;
     background-color: var(--xp-blue);
     border: 2px solid #F0F0F0;
     border: 2px solid var(--xp-gray);
    border-radius: 8px;
}
 
/* Dropdown Menus */
select {
    background-color: #FFFFFF;
    border: 1px solid #A0A0A0;
    padding: 4px;
    font-family: 'Tahoma', sans-serif;
}
}


/* Tooltip Styling */
/* Tooltips */
.tooltip {
.tooltiptext {
     background-color: #FFFFE1;
     background-color: var(--xp-light-blue);
     border: 1px solid #A0A0A0;
     border: 1px solid var(--xp-blue);
     padding: 5px;
     padding: 5px;
     box-shadow: 2px 2px 5px rgba(0,0,0,0.2);
     font-size: 0.8em;
}
 
/* Modal/Dialog Styling */
.dialog-window {
    background-color: #F0F0F0;
    border: 2px solid #6A5ACD;
    border-radius: 6px;
    box-shadow: 5px 5px 10px rgba(0,0,0,0.3);
}
 
.dialog-header {
    background-color: #6A5ACD;
    color: #FFFFFF;
    padding: 8px;
    font-weight: bold;
}
}


/* Responsive Adjustments */
/* Responsive Adjustments */
@media screen and (max-width: 768px) {
@media screen and (max-width: 768px) {
     #sidebar {
     #content {
         width: 100%;
         margin: 5px;
         border-right: none;
         padding: 10px;
     }
     }
}
/* Additional XP-like Nuances */
.window-shadow {
    box-shadow: 3px 3px 6px rgba(0,0,0,0.2);
}
/* Final Decorative Touches */
.xp-gradient {
    background: linear-gradient(to bottom, #E1E4E6, #C0C0C0);
}
}
Retrieved from "https://bonzipedia.skywiki.org/wiki/MediaWiki:Common.css"