effie/mediawiki-skin-crystal
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

break to fix version differences

Browse Source
This commit is contained in:
Effie 2025-10-08 18:22:02 +11:00
parent d9a2c4703c
commit ed230f7236
6 changed files with 50 additions and 15 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

15
resources/layout-mouse.less
View File

@ -1,5 +1,5 @@
:root {
--sidebar-width: calc(10.2em + calc(.3vw * 9) + var(--space));
--sidebar-width: calc(10.2em + calc(.3vw * 9));
}
#grid {
@ -7,6 +7,7 @@
grid-template-columns: 10.2em calc(.3vw * 9) 1fr auto var(--sidebar-width);
grid-template-rows:
[topstart] auto
[sitenotice] auto
[title] auto
[pageheader] auto
[pagebody] auto
@ -51,6 +52,11 @@
grid-column: 4 / 5;
}
#localNotice {
grid-row: sitenotice;
grid-column: 3 / 5;
}
#versions {
align-items: center;
}
@ -112,6 +118,8 @@
}
#page-menu {
// position: sticky;
// top: calc(var(--space) * 2);
position: relative;
min-height: 100%;
width: 100%;
@ -119,10 +127,13 @@
#page-menu-button {
height: 100%;
text-align: left;
}
#user-menu-button:hover, #page-menu-button:hover {
box-shadow: inset 0 0 3px 3px var(--blue-3);
}
#page-menu > * {
padding-left: var(--space);
}

5
resources/layout-touch.less
View File

@ -123,11 +123,8 @@ p {
#page-menu-list {
grid-row: unset;
right: 0;
margin-top: var(--space);
gap: calc(var(--space) * 3);
padding: var(--space);
background-color: var(--gold-2);
box-shadow: 0 0 2px 1px var(--gold-7), inset 0 0 6px 3px var(--gold-1);
// box-shadow: 0 0 2px 1px var(--gold-7), inset 0 0 6px 3px var(--gold-1);
z-index: 1;
}

20
resources/skin.less
View File

@ -25,6 +25,10 @@ body {
background-image: linear-gradient(100deg, var(--blue-1), var(--white) 20%, var(--white)70%, var(--blue-1))
}
body::selection {
background-color: var(--blue-5);
}
:root {
--space: .6em;
}
@ -87,7 +91,7 @@ fieldset {
margin-bottom: calc(var(--space));
}
p {
main p {
margin-bottom: calc(var(--space) * 2);
line-height: calc(var(--space) * 3);
}
@ -125,6 +129,20 @@ p {
display: none;
}
#localNotice {
width: 100%;
}
.sitenotice {
display: flex;
padding: calc(var(--space) * 3);
justify-content: center;
// background: linear-gradient(90deg, transparent, var(--blue-5) 20%, var(--blue-5) 70%, transparent);
color: var(--gold-1);
background: linear-gradient(to top, #ffffffff 0%, #000000ff 20%, #000000ff 80%, #ffffffff 100%), linear-gradient(to right, #ffffffff 0%, #000000ff 20%, #000000ff 80%, #ffffffff 100%), linear-gradient(to top, #667fdaff 0% 100%, #0000ffff 100%);background-blend-mode: color-dodge;
}
// border-style: solid;
// border-image: linear-gradient(150deg, var(--blue-5), white 30%) 1;

22
resources/topbar.less
View File

@ -33,7 +33,7 @@
#nav-search-bar {
border-radius: calc(var(--space) / 2);
background-image: linear-gradient(10deg, var(--blue-1), var(--blue-1) 40%, var(--gold-1));
// background-image: linear-gradient(10deg, var(--blue-1), var(--blue-1) 40%, var(--gold-1));
// background-color: var(--blue-2);
background-color: var(--white);
border: 1px solid var(--black);
@ -43,11 +43,16 @@
height: 100%;
}
#nav-search-bar:hover {
box-shadow: inset 0 0 3px 3px var(--blue-3);
}
#nav-search-bar:focus {
outline: 3px solid var(--blue-7);
box-shadow: inset 0 0 3px 3px var(--blue-3);
background-color: var(--white);
border-bottom: 3px inset var(--blue-7);
background-image: none;
}
#nav-search form {
@ -55,7 +60,7 @@
}
#user-menu-button, #page-menu-button {
border-bottom: 3px solid var(--gold-6);
border-bottom: 3px solid var(--blue-6);
border-width: 0 0 3px 0;
}
@ -65,10 +70,10 @@
overflow: clip;
text-overflow: ellipsis;
padding: var(--space);
background-color: var(--gold-2);
background-color: var(--blue-2);
// border-radius: calc(var(--space) / 2 );
// box-shadow: inset 0 0 3px 3px var(--gold-1);
color: var(--gold-7);
// box-shadow: inset 0 0 3px 3px var(--blue-1);
color: var(--blue-7);
}
#user-menu {
@ -84,8 +89,9 @@
margin-top: calc(var(--space) / 2);
display: none;
z-index: 1;
border-top: 3px solid var(--gold-6);
// border-top: 3px solid var(--blue-6);
border-width: 3px 0 0 0;
box-shadow: 0 0 2px .5px var(--blue-7), inset 0 0 3px 3px var(--blue-1);
}
#page-actions, #page-views, #user-links {
@ -96,8 +102,8 @@
}
#user-menu:focus-within #user-menu-button, #page-menu:focus-within #page-menu-button {
background-color: var(--gold-3);
box-shadow: inset 0 0 3px 3px var(--gold-4);
background-color: var(--blue-3);
box-shadow: inset 0 0 3px 3px var(--blue-4), 0 0 2px .5px var(--blue-7);
}
#user-menu:focus-within #user-menu-list, #page-menu:focus-within #page-menu-list {

1
resources/variables.less Normal file
View File

@ -0,0 +1 @@
@cdx-icon-full-screen: 150px;

2
templates/skin.mustache
View File

@ -77,6 +77,8 @@
</div>
</header>
{{{html-site-notice}}}
<div id="sidebar-nav">
<nav id="nav-main" class="nav-menu">