|
|
| Line 1: |
Line 1: |
| /* 1) Page background */ | | /*– copy this entire :root block –*/ |
| | :root { |
| | --body-main: #e2dbc8; |
| | --body-light: #d8ccb4; |
| | … |
| | --ooui-normal-border: #b8a282; |
| | } |
| | /* then override your background image… */ |
| body { | | body { |
| background: #f2e8cc url('resources/assets/bg.png') no-repeat center top fixed; | | background: var(--body-main) url('resources/assets/bg.png') no-repeat center top fixed; |
| background-size: cover; | | background-size: cover; |
| }
| |
|
| |
| /* 2) Header gradient overlay */
| |
| .skin-vector #mw-head {
| |
| position: relative;
| |
| overflow: hidden;
| |
| }
| |
| .skin-vector #mw-head::before {
| |
| content: "";
| |
| position: absolute;
| |
| top: 0; left: 0; right: 0; height: 250px;
| |
| background: linear-gradient(
| |
| to bottom,
| |
| rgba(242,232,204,0.95) 0%,
| |
| rgba(242,232,204,0) 100%
| |
| );
| |
| pointer-events: none;
| |
| z-index: 1;
| |
| }
| |
| /* keep logo & nav above the gradient */
| |
| .skin-vector #mw-head .mw-head-logo,
| |
| .skin-vector #mw-head .vector-menu {
| |
| position: relative;
| |
| z-index: 2;
| |
| }
| |
|
| |
| /* 3) Tabs rest on same beige panel */
| |
| .vectorTabs {
| |
| background: #f2e8cc;
| |
| border-bottom: none;
| |
| margin-bottom: 0;
| |
| padding: 0 0.5em;
| |
| border-radius: 0.5em 0.5em 0 0;
| |
| }
| |
| .vectorTabs > li > a {
| |
| background: #d1b889;
| |
| color: #4b3923;
| |
| border: 1px solid #c8b284;
| |
| border-bottom: none;
| |
| border-radius: 0.5em 0.5em 0 0;
| |
| margin-right: -1px;
| |
| padding: 0.5em 1em;
| |
| }
| |
| .vectorTabs > li.tabselected > a {
| |
| background: #ffffff;
| |
| border-bottom: 1px solid #ffffff;
| |
| }
| |
|
| |
| /* 4) Content pane attaches snugly below tabs */
| |
| #content,
| |
| #bodyContent {
| |
| background: #ffffff;
| |
| border: 1px solid #c8b284;
| |
| border-radius: 0 0 0.5em 0.5em;
| |
| padding: 1em;
| |
| margin-top: -1px; /* pull up to touch the tabs */
| |
| } | | } |
/*– copy this entire :root block –*/
:root {
--body-main: #e2dbc8;
--body-light: #d8ccb4;
…
--ooui-normal-border: #b8a282;
}
/* then override your background image… */
body {
background: var(--body-main) url('resources/assets/bg.png') no-repeat center top fixed;
background-size: cover;
}