StarCitizenTools/mediawiki-skins-Citizen
1
0
Fork 0
mirror of https://github.com/StarCitizenTools/mediawiki-skins-Citizen.git synced 2024-11-11 16:48:54 +00:00
Code Issues Packages Projects Releases Wiki Activity

feat(core): ✨ add jump to top link to sticky header

Browse source
This commit is contained in:
alistair3149 2022-09-30 11:24:06 -04:00
parent 639c378721
commit 5be20a256c
No known key found for this signature in database
5 changed files with 27 additions and 4 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

2
includes/SkinCitizen.php
View file

@ -125,12 +125,12 @@ class SkinCitizen extends SkinMustache {
'data-notifications' => $header->getNotifications(),
'data-personal-menu' => $header->buildPersonalMenu(),
'data-search-box' => $header->buildSearchProps(),
'html-citizen-jumptotop' => $this->msg( 'citizen-jumptotop' )->text() . ' [home]',
],
'data-pagetools' => $tools->buildPageTools( $parentData ),
'data-citizen-footer' => $footer->getFooterData(),
// HTML strings
'html-title-heading--formatted' => $pageTitle->buildTitle( $parentData, $title ),
'html-citizen-jumptotop' => $this->msg( 'citizen-jumptotop' )->text() . ' [home]',
'html-body-content--formatted' => $bodycontent->buildBodyContent(),
'html-tagline' => $tagline->getTagline(),
];

22
resources/skins.citizen.styles/Stickyheader.less
View file

@ -29,9 +29,31 @@
}
}
.page-heading {
position: relative;
}
.firstHeading {
font-size: 1.25rem;
}
.citizen-jumptotop {
position: absolute;
top: 0;
right: 0;
bottom: 0;
left: 0;
border-radius: var( --border-radius--small );
margin: ~'calc( var( --space-sm ) * -1 )';
&:hover {
background-color: var( --background-color-quiet--hover );
}
&:active {
background-color: var( --background-color-quiet--active );
}
}
}
@media ( max-width: @width-breakpoint-tablet ), ( max-height: 800px ) {

2
resources/skins.citizen.styles/layout.less
View file

@ -28,7 +28,7 @@
padding-top: var( --space-md );
margin-top: var( --space-xl );
margin-bottom: @content-margin-top * 2;
gap: @content-margin-top;
gap: var( --space-lg );
}
.page-heading {

2
templates/ContentHeader.mustache
View file

@ -3,6 +3,7 @@
"featured article". An empty array if none are defined.
string html-title-heading--formatted
string html-tagline
string html-citizen-jumptotop Jump to top title text
}}
<header class="mw-body-header">
<div class="page-heading">
@ -11,6 +12,7 @@
{{>Indicators}}
</div>
<div id="siteSub">{{html-tagline}}</div>
<a href="#top" class="citizen-jumptotop" title="{{html-citizen-jumptotop}}"></a>
</div>
{{>PageTools}}
</header>

3
templates/Header.mustache
View file

@ -1,7 +1,6 @@
{{!
string link-mainpage link to the main page
string msg-citizen-drawer-toggle The label used by the drawer button.
string html-citizen-jumptotop Jump to top title text
string msg-citizen-drawer-toggle The label used by the drawer button
}}
<header class="mw-header citizen-header">
{{#data-search-box}}{{>Search}}{{/data-search-box}}