mirror of
https://github.com/McShelby/hugo-theme-relearn.git
synced 2025-07-21 06:42:28 +00:00
theme: avoid id collisions between headings and theme #646
This commit is contained in:
Sören Weber
parent
862d8bb8c2
commit
e18c213e8c
30 changed files with 511 additions and 507 deletions
static/js
|
|
@ -2,7 +2,7 @@ window.relearn = window.relearn || {};
|
|||
|
||||
window.relearn.runInitialSearch = function(){
|
||||
if( window.relearn.isSearchInit && window.relearn.isLunrInit ){
|
||||
var input = document.querySelector('#search-by-detail');
|
||||
var input = document.querySelector('#R-search-by-detail');
|
||||
if( !input ){
|
||||
return;
|
||||
}
|
||||
|
|
@ -45,7 +45,7 @@ function initLunrIndex( index ){
|
|||
}
|
||||
|
||||
function triggerSearch(){
|
||||
var input = document.querySelector('#search-by-detail');
|
||||
var input = document.querySelector('#R-search-by-detail');
|
||||
if( !input ){
|
||||
return;
|
||||
}
|
||||
|
|
@ -97,7 +97,7 @@ window.addEventListener( 'popstate', function ( event ){
|
|||
}
|
||||
});
|
||||
|
||||
var input = document.querySelector('#search-by-detail');
|
||||
var input = document.querySelector('#R-search-by-detail');
|
||||
if( input ){
|
||||
input.addEventListener( 'keydown', function(event) {
|
||||
// if we are pressing ESC in the searchdetail our focus will
|
||||
|
|
@ -199,7 +199,7 @@ function resolvePlaceholders( s, args ) {
|
|||
};
|
||||
|
||||
function searchDetail( value ) {
|
||||
var results = document.querySelector('#searchresults');
|
||||
var results = document.querySelector('#R-searchresults');
|
||||
var hint = document.querySelector('.searchhint');
|
||||
hint.innerText = '';
|
||||
results.textContent = '';
|
||||
|
|
@ -252,7 +252,7 @@ initLunrJson();
|
|||
initLunrJs();
|
||||
|
||||
function startSearch(){
|
||||
var input = document.querySelector('#search-by-detail');
|
||||
var input = document.querySelector('#R-search-by-detail');
|
||||
if( input ){
|
||||
var state = window.history.state || {};
|
||||
state = Object.assign( {}, ( typeof state === 'object' ) ? state : {} );
|
||||
|
|
@ -262,8 +262,8 @@ function startSearch(){
|
|||
|
||||
var searchList = new autoComplete({
|
||||
/* selector for the search box element */
|
||||
selectorToInsert: '#header-wrapper',
|
||||
selector: '#search-by',
|
||||
selectorToInsert: '#R-header-wrapper',
|
||||
selector: '#R-search-by',
|
||||
/* source is the callback to perform the search */
|
||||
source: function(term, response) {
|
||||
response(search(term));
|
||||
|
|
|
|||
|
|
@ -35,7 +35,7 @@ var formelements = 'button, datalist, fieldset, input, label, legend, meter, opt
|
|||
var psc;
|
||||
var psm;
|
||||
var pst = new Map();
|
||||
var elc = document.querySelector('#body-inner');
|
||||
var elc = document.querySelector('#R-body-inner');
|
||||
|
||||
function regexEscape( s ){
|
||||
return s.replace( /[-[\]{}()*+?.,\\^$|#\s]/g, '\\$&' );
|
||||
|
|
@ -356,7 +356,7 @@ function initOpenapi( update, attrs ){
|
|||
function renderOpenAPI(oc) {
|
||||
var buster = window.themeUseOpenapi.assetsBuster ? '?' + window.themeUseOpenapi.assetsBuster : '';
|
||||
var print = isPrint || attrs.isPrintPreview ? "PRINT-" : "";
|
||||
var theme = print ? `${baseUri}/css/theme-relearn-light.css` : document.querySelector( '#variant-style' ).attributes.href.value
|
||||
var theme = print ? `${baseUri}/css/theme-relearn-light.css` : document.querySelector( '#R-variant-style' ).attributes.href.value
|
||||
var swagger_theme = variants.getColorValue( print + 'OPENAPI-theme' );
|
||||
var swagger_code_theme = variants.getColorValue( print + 'OPENAPI-CODE-theme' );
|
||||
|
||||
|
|
@ -652,7 +652,7 @@ function initArrowNav(){
|
|||
// keyboard navigation
|
||||
// avoid prev/next navigation if we are not at the start/end of the
|
||||
// horizontal area
|
||||
var el = document.querySelector('#body-inner');
|
||||
var el = document.querySelector('#R-body-inner');
|
||||
var scrollStart = 0;
|
||||
var scrollEnd = 0;
|
||||
document.addEventListener('keydown', function(event){
|
||||
|
|
@ -708,7 +708,7 @@ function initMenuScrollbar(){
|
|||
return;
|
||||
}
|
||||
|
||||
var elm = document.querySelector('#content-wrapper');
|
||||
var elm = document.querySelector('#R-content-wrapper');
|
||||
var elt = document.querySelector('.topbar-button.topbar-flyout .topbar-content-wrapper');
|
||||
|
||||
var autofocus = true;
|
||||
|
|
@ -747,7 +747,7 @@ function initMenuScrollbar(){
|
|||
psm && psm.scrollbarY.focus();
|
||||
}
|
||||
else{
|
||||
document.querySelector('#body-inner').focus();
|
||||
document.querySelector('#R-body-inner').focus();
|
||||
psc && psc.scrollbarY.focus();
|
||||
}
|
||||
}
|
||||
|
|
@ -755,8 +755,8 @@ function initMenuScrollbar(){
|
|||
// scrollbars will install their own keyboard handlers
|
||||
// that need to be executed inbetween our own handlers
|
||||
// PSC removed for #242 #243 #244
|
||||
// psc = elc && new PerfectScrollbar('#body-inner');
|
||||
psm = elm && new PerfectScrollbar('#content-wrapper');
|
||||
// psc = elc && new PerfectScrollbar('#R-body-inner');
|
||||
psm = elm && new PerfectScrollbar('#R-content-wrapper');
|
||||
document.querySelectorAll('.topbar-button .topbar-content-wrapper').forEach( function( e ){
|
||||
var button = getTopbarButtonParent( e );
|
||||
if( !button ){
|
||||
|
|
@ -790,7 +790,7 @@ function initMenuScrollbar(){
|
|||
});
|
||||
// now that we may have collapsible menus, we need to call a resize
|
||||
// for the menu scrollbar if sections are expanded/collapsed
|
||||
document.querySelectorAll('#sidebar .collapsible-menu input').forEach( function(e){
|
||||
document.querySelectorAll('#R-sidebar .collapsible-menu input').forEach( function(e){
|
||||
e.addEventListener('change', function(){
|
||||
psm && setTimeout( function(){ psm.update(); }, 10 );
|
||||
});
|
||||
|
|
@ -846,7 +846,7 @@ function printShortcutHandler( event ){
|
|||
}
|
||||
|
||||
function showSearch(){
|
||||
var s = document.querySelector( '#search-by' );
|
||||
var s = document.querySelector( '#R-search-by' );
|
||||
if( !s ){
|
||||
return;
|
||||
}
|
||||
|
|
@ -870,7 +870,7 @@ function openNav(){
|
|||
b.classList.add( 'sidebar-flyout' );
|
||||
psm && setTimeout( function(){ psm.update(); }, 10 );
|
||||
psm && psm.scrollbarY.focus();
|
||||
var a = document.querySelector( '#sidebar a' )
|
||||
var a = document.querySelector( '#R-sidebar a' )
|
||||
if( a ){
|
||||
a.focus();
|
||||
}
|
||||
|
|
@ -1011,11 +1011,11 @@ function initToc(){
|
|||
document.addEventListener( 'keydown', navEscapeHandler );
|
||||
document.addEventListener( 'keydown', topbarFlyoutEscapeHandler );
|
||||
|
||||
var b = document.querySelector( '#body-overlay' );
|
||||
var b = document.querySelector( '#R-body-overlay' );
|
||||
if( b ){
|
||||
b.addEventListener( 'click', closeNav );
|
||||
}
|
||||
var m = document.querySelector( '#main-overlay' );
|
||||
var m = document.querySelector( '#R-main-overlay' );
|
||||
if( m ){
|
||||
m.addEventListener( 'click', closeSomeTopbarButtonFlyout );
|
||||
}
|
||||
|
|
@ -1059,16 +1059,16 @@ function initSwipeHandler(){
|
|||
return false;
|
||||
};
|
||||
|
||||
var s = document.querySelector( '#body-overlay' );
|
||||
var s = document.querySelector( '#R-body-overlay' );
|
||||
s && s.addEventListener("touchstart", handleStartX, false);
|
||||
document.querySelector( '#sidebar' ).addEventListener("touchstart", handleStartX, false);
|
||||
document.querySelectorAll( '#sidebar *' ).forEach( function(e){ e.addEventListener("touchstart", handleStartX); }, false);
|
||||
document.querySelector( '#R-sidebar' ).addEventListener("touchstart", handleStartX, false);
|
||||
document.querySelectorAll( '#R-sidebar *' ).forEach( function(e){ e.addEventListener("touchstart", handleStartX); }, false);
|
||||
s && s.addEventListener("touchmove", handleMoveX, false);
|
||||
document.querySelector( '#sidebar' ).addEventListener("touchmove", handleMoveX, false);
|
||||
document.querySelectorAll( '#sidebar *' ).forEach( function(e){ e.addEventListener("touchmove", handleMoveX); }, false);
|
||||
document.querySelector( '#R-sidebar' ).addEventListener("touchmove", handleMoveX, false);
|
||||
document.querySelectorAll( '#R-sidebar *' ).forEach( function(e){ e.addEventListener("touchmove", handleMoveX); }, false);
|
||||
s && s.addEventListener("touchend", handleEndX, false);
|
||||
document.querySelector( '#sidebar' ).addEventListener("touchend", handleEndX, false);
|
||||
document.querySelectorAll( '#sidebar *' ).forEach( function(e){ e.addEventListener("touchend", handleEndX); }, false);
|
||||
document.querySelector( '#R-sidebar' ).addEventListener("touchend", handleEndX, false);
|
||||
document.querySelectorAll( '#R-sidebar *' ).forEach( function(e){ e.addEventListener("touchend", handleEndX); }, false);
|
||||
}
|
||||
|
||||
function initImage(){
|
||||
|
|
@ -1126,7 +1126,7 @@ function initScrollPositionSaver(){
|
|||
function scrollToPositions() {
|
||||
// show active menu entry
|
||||
window.setTimeout( function(){
|
||||
var e = document.querySelector( '#sidebar li.active a' );
|
||||
var e = document.querySelector( '#R-sidebar li.active a' );
|
||||
if( e && e.scrollIntoView ){
|
||||
e.scrollIntoView({
|
||||
block: 'center',
|
||||
|
|
@ -1183,7 +1183,7 @@ function scrollToPositions() {
|
|||
|
||||
function mark() {
|
||||
// mark some additional stuff as searchable
|
||||
var bodyInnerLinks = document.querySelectorAll( '#body-inner a:not(.lightbox-link):not(.btn):not(.lightbox-back)' );
|
||||
var bodyInnerLinks = document.querySelectorAll( '#R-body-inner a:not(.lightbox-link):not(.btn):not(.lightbox-back)' );
|
||||
for( var i = 0; i < bodyInnerLinks.length; i++ ){
|
||||
bodyInnerLinks[i].classList.add( 'highlight' );
|
||||
}
|
||||
|
|
@ -1435,7 +1435,7 @@ function useMermaid( config ){
|
|||
if (typeof mermaid != 'undefined' && typeof mermaid.mermaidAPI != 'undefined') {
|
||||
mermaid.initialize( Object.assign( { "securityLevel": "antiscript", "startOnLoad": false }, config ) );
|
||||
if( config.theme && variants ){
|
||||
var write_style = variants.findLoadedStylesheet( 'variant-style' );
|
||||
var write_style = variants.findLoadedStylesheet( 'R-variant-style' );
|
||||
write_style.setProperty( '--CONFIG-MERMAID-theme', config.theme );
|
||||
}
|
||||
}
|
||||
|
|
@ -1474,7 +1474,7 @@ ready( function(){
|
|||
|
||||
(function(){
|
||||
var body = document.querySelector( 'body' );
|
||||
var topbar = document.querySelector( '#topbar' );
|
||||
var topbar = document.querySelector( '#R-topbar' );
|
||||
function addTopbarButtonInfos(){
|
||||
// initially add some management infos to buttons and areas
|
||||
var areas = body.querySelectorAll( '.topbar-area' );
|
||||
|
|
|
|||
|
|
@ -64,7 +64,7 @@ var variants = {
|
|||
|
||||
markSelectedVariant: function(){
|
||||
var variant = this.getVariant();
|
||||
var select = document.querySelector( '#select-variant' );
|
||||
var select = document.querySelector( '#R-select-variant' );
|
||||
if( !select ){
|
||||
return;
|
||||
}
|
||||
|
|
@ -102,7 +102,7 @@ var variants = {
|
|||
if( !variantbase ){
|
||||
return;
|
||||
}
|
||||
var select = document.querySelector( '#select-variant' );
|
||||
var select = document.querySelector( '#R-select-variant' );
|
||||
if( !select ){
|
||||
return;
|
||||
}
|
||||
|
|
@ -146,12 +146,12 @@ var variants = {
|
|||
// temp styles to document
|
||||
var head = document.querySelector( 'head' );
|
||||
var style = document.createElement( 'style' );
|
||||
style.id = 'custom-variant-style';
|
||||
style.id = 'R-custom-variant-style';
|
||||
style.appendChild( document.createTextNode( stylesheet ) );
|
||||
head.appendChild( style );
|
||||
|
||||
var interval_id = setInterval( function(){
|
||||
if( this.findLoadedStylesheet( 'variant-style' ) ){
|
||||
if( this.findLoadedStylesheet( 'R-variant-style' ) ){
|
||||
clearInterval( interval_id );
|
||||
// save the styles to the current variant stylesheet
|
||||
this.variantvariables.forEach( function( e ){
|
||||
|
|
@ -183,7 +183,7 @@ var variants = {
|
|||
},
|
||||
|
||||
switchStylesheet: function( variant, without_check ){
|
||||
var link = document.querySelector( '#variant-style' );
|
||||
var link = document.querySelector( '#R-variant-style' );
|
||||
if( !link ){
|
||||
return;
|
||||
}
|
||||
|
|
@ -193,7 +193,7 @@ var variants = {
|
|||
|
||||
// Chrome needs a new element to trigger the load callback again
|
||||
var new_link = document.createElement( 'link' );
|
||||
new_link.id = 'variant-style';
|
||||
new_link.id = 'R-variant-style';
|
||||
new_link.rel = 'stylesheet';
|
||||
new_link.onload = this.onLoadStylesheet;
|
||||
new_link.setAttribute( 'href', new_path );
|
||||
|
|
@ -358,8 +358,8 @@ var variants = {
|
|||
return;
|
||||
}
|
||||
|
||||
var read_style = this.findLoadedStylesheet( 'custom-variant-style' );
|
||||
var write_style = this.findLoadedStylesheet( 'variant-style' );
|
||||
var read_style = this.findLoadedStylesheet( 'R-custom-variant-style' );
|
||||
var write_style = this.findLoadedStylesheet( 'R-variant-style' );
|
||||
if( !read_style ){
|
||||
read_style = write_style;
|
||||
}
|
||||
|
|
@ -419,8 +419,8 @@ var variants = {
|
|||
},
|
||||
|
||||
generateStylesheet: function(){
|
||||
var read_style = this.findLoadedStylesheet( 'custom-variant-style' );
|
||||
var write_style = this.findLoadedStylesheet( 'variant-style' );
|
||||
var read_style = this.findLoadedStylesheet( 'R-custom-variant-style' );
|
||||
var write_style = this.findLoadedStylesheet( 'R-variant-style' );
|
||||
if( !read_style ){
|
||||
read_style = write_style;
|
||||
}
|
||||
|
|
@ -435,10 +435,10 @@ var variants = {
|
|||
},
|
||||
|
||||
styleGraphGroup: function( selector, colorvar ){
|
||||
this.adjustCSSRules( '#body svg '+selector+' > rect', 'color: var(--INTERNAL-'+colorvar+'); fill: var(--INTERNAL-'+colorvar+'); stroke: #80808080;' );
|
||||
this.adjustCSSRules( '#body svg '+selector+' > .label .nodeLabel', 'color: var(--INTERNAL-'+colorvar+'); fill: var(--INTERNAL-'+colorvar+'); stroke: #80808080;' );
|
||||
this.adjustCSSRules( '#body svg '+selector+' > .cluster-label .nodeLabel', 'color: var(--INTERNAL-'+colorvar+'); fill: var(--INTERNAL-'+colorvar+'); stroke: #80808080;' );
|
||||
this.adjustCSSRules( '#body svg '+selector+' .nodeLabel', 'filter: grayscale(1) invert(1) contrast(10000);' );
|
||||
this.adjustCSSRules( '#R-body svg '+selector+' > rect', 'color: var(--INTERNAL-'+colorvar+'); fill: var(--INTERNAL-'+colorvar+'); stroke: #80808080;' );
|
||||
this.adjustCSSRules( '#R-body svg '+selector+' > .label .nodeLabel', 'color: var(--INTERNAL-'+colorvar+'); fill: var(--INTERNAL-'+colorvar+'); stroke: #80808080;' );
|
||||
this.adjustCSSRules( '#R-body svg '+selector+' > .cluster-label .nodeLabel', 'color: var(--INTERNAL-'+colorvar+'); fill: var(--INTERNAL-'+colorvar+'); stroke: #80808080;' );
|
||||
this.adjustCSSRules( '#R-body svg '+selector+' .nodeLabel', 'filter: grayscale(1) invert(1) contrast(10000);' );
|
||||
},
|
||||
|
||||
styleGraph: function(){
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue