From ed230f72367ea0d002104d00223c2fe19737b8ea Mon Sep 17 00:00:00 2001 From: Effie Date: Wed, 8 Oct 2025 18:22:02 +1100 Subject: [PATCH] break to fix version differences --- resources/layout-mouse.less | 15 +++++++++++++-- resources/layout-touch.less | 5 +---- resources/skin.less | 20 +++++++++++++++++++- resources/topbar.less | 22 ++++++++++++++-------- resources/variables.less | 1 + templates/skin.mustache | 2 ++ 6 files changed, 50 insertions(+), 15 deletions(-) create mode 100644 resources/variables.less diff --git a/resources/layout-mouse.less b/resources/layout-mouse.less index 2b43c18..c8a5898 100644 --- a/resources/layout-mouse.less +++ b/resources/layout-mouse.less @@ -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); } diff --git a/resources/layout-touch.less b/resources/layout-touch.less index 41f4730..5697daf 100644 --- a/resources/layout-touch.less +++ b/resources/layout-touch.less @@ -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; } diff --git a/resources/skin.less b/resources/skin.less index 63fb8b1..b7d6a3f 100644 --- a/resources/skin.less +++ b/resources/skin.less @@ -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; diff --git a/resources/topbar.less b/resources/topbar.less index 27ae46f..9d31da5 100644 --- a/resources/topbar.less +++ b/resources/topbar.less @@ -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 { diff --git a/resources/variables.less b/resources/variables.less new file mode 100644 index 0000000..9f03a81 --- /dev/null +++ b/resources/variables.less @@ -0,0 +1 @@ +@cdx-icon-full-screen: 150px; \ No newline at end of file diff --git a/templates/skin.mustache b/templates/skin.mustache index 1c7069f..6d1cc2e 100644 --- a/templates/skin.mustache +++ b/templates/skin.mustache @@ -77,6 +77,8 @@ + {{{html-site-notice}}} +