|
Tags: Blanking Manual revert |
| (55 intermediate revisions by the same user not shown) |
| Line 1: |
Line 1: |
| /*
| |
| * =====================================================
| |
| * EstoriaRO Wiki Background & General Styling
| |
| * =====================================================
| |
| */
| |
|
| |
|
| /* Global Body Styling (Background & Default Text Color) */
| |
| body {
| |
| background-color: #f8f9fa00; /* Fully transparent base color */
| |
| color: #ffffff; /* Default text color is white */
| |
| font-family: "Baloo Paaji 2", cursive; /* Default font */
| |
| background-image: url("/wiki/images/7/74/Estoria_banner.png");
| |
| background-repeat: no-repeat;
| |
| background-position: center top;
| |
| background-attachment: fixed; /* Background stays put when scrolling */
| |
| background-size: cover; /* Ensures background covers the entire viewport */
| |
| }
| |
|
| |
| /*
| |
| * =====================================================
| |
| * Main Content Container (mw-body)
| |
| * =====================================================
| |
| */
| |
| #pt-userpage-2 a:not(.mw-selflink) {
| |
| color: #ffffff;
| |
| }
| |
|
| |
| /* Main content container styling */
| |
| .mw-body {
| |
| background-color: rgb(34 50 83 / 63%); /* Semi-transparent dark blue/grey */
| |
| border-radius: 12px;
| |
| padding: 20px;
| |
| box-shadow: 0 8px 25px rgb(0 0 0); /* Soft shadow for depth */
| |
| }
| |
|
| |
| /* Ensure all content inside the body uses the custom font */
| |
| .mw-body-content,
| |
| .mw-body-content * {
| |
| font-family: "Baloo Paaji 2", cursive;
| |
| }
| |
|
| |
| /* Content Area Container and Header/Pin Container Transparency */
| |
| .mw-page-container {
| |
| min-width: 18.75em;
| |
| max-width: 99.75rem;
| |
| box-sizing: border-box;
| |
| position: relative;
| |
| z-index: 0;
| |
| margin: 0 auto;
| |
| padding-top: 0.05px;
| |
| padding-left: 1.5rem;
| |
| padding-right: 1.5rem;
| |
| background-color: #ffffff00; /* Transparent */
| |
| }
| |
|
| |
| .vector-pinned-container {
| |
| background-color: #ffffff13; /* Very slight white transparency */
| |
| }
| |
|
| |
| /*
| |
| * =====================================================
| |
| * Headers & Typography
| |
| * =====================================================
| |
| */
| |
|
| |
| /* All headings (H1-H6) styling */
| |
| .mw-heading,
| |
| h1, h2, h3, h4, h5, h6 {
| |
| color: #f0c75e; /* Soft yellow highlight color */
| |
| font-weight: 800;
| |
| font-family: "Baloo Paaji 2", cursive;
| |
| margin: 0;
| |
| padding-top: 0.5em;
| |
| padding-bottom: 0.17em;
| |
| display: flow-root;
| |
| word-break: break-word;
| |
| }
| |
|
| |
| /* Separator under the pinnable header */
| |
| .vector-pinnable-header {
| |
| padding-bottom: 6px;
| |
| margin-bottom: 6px;
| |
| border-bottom: 1px solid #f5f6e8;
| |
| line-height: 1.6;
| |
| }
| |
|
| |
| /*
| |
| * =====================================================
| |
| * Links
| |
| * =====================================================
| |
| */
| |
|
| |
| /* Normal and Visited link colors within content */
| |
| #content a:link,
| |
| #content a:visited {
| |
| color: #ffffff;
| |
| }
| |
|
| |
| /* Hover link color (soft yellow highlight) */
| |
| #content a:hover {
| |
| color: #f0c75e;
| |
| }
| |
|
| |
| /* Visited links specifically for where(:not([role='button'])) */
| |
| a:where(:not([role='button'])):visited {
| |
| color: #eaecf0; /* Off-white color */
| |
| }
| |
|
| |
| /*
| |
| * =====================================================
| |
| * Tables
| |
| * =====================================================
| |
| */
| |
|
| |
| /* Wikitable styling */
| |
| .wikitable {
| |
| background-color: #f8f9fa00; /* Transparent */
| |
| color: #ffffff;
| |
| margin: 5em 0;
| |
| border: 0px solid #a2a9b1; /* Removed border */
| |
| border-collapse: collapse;
| |
| }
| |
|
| |
| /*
| |
| * =====================================================
| |
| * Navigation & UI Elements
| |
| * =====================================================
| |
| */
| |
|
| |
| /* Vector Header Container (top bar) */
| |
| .vector-header-container .mw-header,
| |
| .vector-header-container .vector-sticky-header {
| |
| width: 100%;
| |
| min-height: 3.125rem;
| |
| background-color: #ffffff00; /* Transparent */
| |
| min-width: 18.75em;
| |
| max-width: 99.75rem;
| |
| padding-left: 1.5rem;
| |
| padding-right: 1.5rem;
| |
| box-sizing: border-box;
| |
| }
| |
|
| |
| /* Dropdown menu styling */
| |
| .vector-dropdown .vector-dropdown-content {
| |
| position: absolute;
| |
| top: 100%;
| |
| left: -1px;
| |
| opacity: 0;
| |
| height: 0;
| |
| visibility: hidden;
| |
| overflow: hidden auto;
| |
| z-index: 50;
| |
| background-color: #ffffff17; /* Very light transparent background */
| |
| padding: 16px 16px;
| |
| font-size: var(--font-size-small, 0.875rem);
| |
| box-shadow: 0 2px 6px -1px rgba(0, 0, 0, 0.2);
| |
| transition-property: opacity;
| |
| transition-duration: 100ms;
| |
| width: max-content;
| |
| max-width: 200px;
| |
| max-height: 75vh;
| |
| }
| |
|
| |
| /* WikiEditor Textarea */
| |
| .wikiEditor-ui textarea {
| |
| width: 75%;
| |
| border: 0;
| |
| }
| |
|
| |
| .oo-ui-toolbar-bar {
| |
| background-color: #ffffff00;
| |
| color: #ffffff;
| |
| }
| |
|
| |
| textarea {
| |
| display: block;
| |
| box-sizing: border-box;
| |
| width: 100%;
| |
| border: 1px solid #a2a9b1;
| |
| padding: 0.1em;
| |
| background-color: #ffffff00;
| |
| }
| |
|
| |
| .wikiEditor-ui-toolbar {
| |
| background-color: #f8f9fa00;
| |
| box-shadow: 0 2px 1px 0 rgba(0, 0, 0, 0.1);
| |
| }
| |
|
| |
| .editOptions {
| |
| background-color: #eaecf000;
| |
| color: #ffffff;
| |
| border: 1px solid #c8ccd100;
| |
| border-top: 0;
| |
| padding: 1em 1em 1.5em 1em;
| |
| margin-bottom: 2em;
| |
| }
| |
|
| |
| .ve-ui-mwNoticesPopupTool-items {
| |
| padding: 0.5em 1em;
| |
| line-height: 1.6em;
| |
| background-color: #eaecf000;
| |
| }
| |
|
| |
| .ve-ui-mwNoticesPopupTool-items {
| |
| padding: 0.5em 1em;
| |
| line-height: 1.6em;
| |
| background-color: #3b4d73;
| |
| }
| |
|
| |
| .mw-echo-ui-placeholderItemWidget {
| |
| padding: 2em;
| |
| background-color: #3b4d73;
| |
| }
| |
|
| |
| .mw-echo-ui-notificationsInboxWidget-toolbarWrapper {
| |
| min-height: 3.5em;
| |
| position: -webkit-sticky;
| |
| position: sticky;
| |
| padding-bottom: 1em;
| |
| padding-top: 0.5em;
| |
| margin-top: -0.5em;
| |
| top: 0;
| |
| z-index: 2;
| |
| background-color: #ffffff00;
| |
| box-shadow: 0 2px 0 0 rgba(0, 0, 0, 0.1);
| |
| }
| |
|
| |
| /* Echo */
| |
|
| |
| .mw-echo-ui-notificationItemWidget {
| |
| background-color: #ffffff00;
| |
| }
| |
|
| |
| .mw-echo-ui-notificationItemWidget-unread,
| |
| .mw-echo-ui-placeholderItemWidget {
| |
| backgroundor: #ffffff00;
| |
| }
| |
|
| |
| .mw-echo-ui-notificationItemWidget-unread:hover,
| |
| .mw-echo-ui-notificationItemWidget:hover,
| |
| .mw-echo-ui-notificationsInboxWidget-toolbarWrapper {
| |
| background-color: #ffffff00;
| |
| }
| |
|
| |
| .mw-echo-ui-menuItemWidget > .oo-ui-buttonElement-button > .oo-ui-labelElement-label,
| |
| .mw-echo-ui-notificationItemWidget-content-message-body {
| |
| color: #ffffff00;
| |
| }
| |
|
| |
| .mw-echo-ui-notificationsListWidget:not(:hover) a,
| |
| #p-personal .mw-echo-ui-notificationsListWidget:not(:hover) a.new,
| |
| .mw-echo-ui-notificationItemWidget-content-message-header,
| |
| .mw-echo-ui-notificationItemWidget-content-actions-timestamp{
| |
| color:var(--wiki-content-text-color);
| |
| }
| |
|
| |
| /* special:replacetext */
| |
| .ext-replacetext-searchoptions {
| |
| background-color: transparent;
| |
| border: 1px solid var(--wiki-content-border-color);
| |
| }
| |
|
| |
| .ext-replacetext-searchoptions .ext-replacetext-divider {
| |
| border-bottom: 1px solid var(--wiki-content-border-color);
| |
| }
| |
|
| |
|
| |
|
| |
| .mw-rcfilters-ui-changesListWrapperWidget .mw-changeslist-legend {
| |
| background-color: #ffffff00;
| |
| position: relative;
| |
| z-index: 1;
| |
| }
| |
|
| |
| .oo-ui-tagMultiselectWidget.oo-ui-widget-enabled.oo-ui-tagMultiselectWidget-outlined {
| |
| background-color: #f8f9fa00;
| |
| }
| |
|
| |
| .mw-rcfilters-container .mw-rcfilters-ui-filterTagMultiselectWidget.oo-ui-widget-enabled .oo-ui-tagMultiselectWidget-handle {
| |
| background-color: #ffffff00;
| |
| border: 1px solid #a2a9b100;
| |
| border-bottom: 0;
| |
| border-radius: 2px 2px 0 0;
| |
| padding: 0 0.6em 0.6em 0.6em;
| |
| color: #ffffff00;
| |
| line-height: normal;
| |
| }
| |
|
| |
| .mw-rcfilters-container .mw-rcfilters-ui-filterTagMultiselectWidget-emptyFilters {
| |
| color: #ffffff;
| |
| }
| |
|
| |
| .mw-rcfilters-container .mw-rcfilters-ui-filterTagMultiselectWidget-wrapper-content-title {
| |
| font-weight: bold;
| |
| color: #ffffff;
| |
| white-space: nowrap;
| |
| }
| |
|
| |
| .oo-ui-buttonElement-framed.oo-ui-widget-enabled > .oo-ui-buttonElement-button {
| |
| background-color: #f8f9fa00;
| |
| color: #ffffff;
| |
| border-color: #a2a9b100;
| |
| }
| |
|
| |
| /* special:replacetext */
| |
| .ext-replacetext-searchoptions {
| |
| background-color: #ffffff00;
| |
| border: 1px solid var(--wiki-content-border-color);
| |
| }
| |
|
| |
| .oo-ui-buttonElement-framed.oo-ui-widget-enabled > .oo-ui-buttonElement-button {
| |
| background-color: #f8f9fa00;
| |
| color: #2f3a89;
| |
| border-color: #a2a9b100;
| |
| }
| |
|
| |
| #pagehistory li.selected {
| |
| background-color: #162f478f;
| |
| color: var(--color-base, #202122);
| |
| outline: 1px dashed #a2a9b1;
| |
| }
| |
|
| |
| .oo-ui-textInputWidget .oo-ui-inputWidget-input {
| |
| background-color: #ffffff00;
| |
| color: #101418;
| |
| margin: 0;
| |
| border: 1px solid var(--border-color-base, #a2a9b1);
| |
| border-radius: 2px;
| |
| padding: 5px 8px;
| |
| font-size: inherit;
| |
| font-family: inherit;
| |
| line-height: 1.42857143em;
| |
| }
| |
|
| |
| .oo-ui-buttonElement-framed.oo-ui-widget-enabled > .oo-ui-buttonElement-button {
| |
| background-color: #1d3955b0;
| |
| color: #ffffff;
| |
| border-color: #ffffff00;
| |
| }
| |
|
| |
| .oo-ui-buttonElement-framed.oo-ui-widget-enabled.oo-ui-flaggedElement-primary.oo-ui-flaggedElement-progressive > .oo-ui-buttonElement-button {
| |
| color: var(--color-inverted-fixed, #fff);
| |
| background-color: #1d3955b0;
| |
| border-color: var(--background-color-progressive, #36c);
| |
| }
| |
|
| |
|
| |
| /*
| |
| * =====================================================
| |
| * Search Bar (Bilah Pencarian) Customization
| |
| * Menghilangkan background putih pada bilah pencarian
| |
| * =====================================================
| |
| */
| |
|
| |
| /* 1. Kontainer Search Bar Utama (Biasanya di Header Vector) */
| |
| #simpleSearch,
| |
| #p-search,
| |
| .vector-search-box {
| |
| background-color: transparent !important; /* Menghilangkan latar belakang kontainer */
| |
| border: none !important;
| |
| }
| |
|
| |
| /* 2. Kotak Input Teks Pencarian */
| |
| #searchInput,
| |
| .vector-search-box-input {
| |
| background-color: rgb(255 255 255 / 15%) !important; /* Latar belakang semi-transparan (putih 15% opasitas) */
| |
| color: #ffffff; /* Warna teks putih */
| |
| border: 1px solid #f0c75e; /* Border tipis kuning serasi dengan heading */
| |
| border-radius: 4px;
| |
| padding: 4px 10px;
| |
| transition: background-color 0.3s;
| |
| }
| |
|
| |
| /* 3. Efek Hover/Fokus pada Kotak Input */
| |
| #searchInput:focus,
| |
| .vector-search-box-input:focus {
| |
| background-color: rgb(255 255 255 / 25%) !important; /* Sedikit lebih cerah saat fokus */
| |
| border-color: #f0c75e;
| |
| box-shadow: 0 0 5px rgba(240, 199, 94, 0.5);
| |
| }
| |
|
| |
| /* 4. Tombol Pencarian dan Tombol Go */
| |
| #searchButton,
| |
| #mw-searchButton,
| |
| .search-toggle,
| |
| .search-button {
| |
| background-color: #f0c75e !important; /* Menggunakan warna aksen kuning Anda */
| |
| color: #344a70 !important; /* Teks/ikon menjadi gelap */
| |
| border: none !important;
| |
| border-radius: 4px;
| |
| margin-left: 5px;
| |
| }
| |