// ==UserScript==
// @name Greasy Fork Theme Engine [BETA]
// @namespace https://naeembolchhi.github.io/
// @version 0.18
// @description A sleek Geasy Fork redesign with light/dark mode and custom colors.
// @author NaeemBolchhi
// @license GPL-3.0-or-later
// @icon data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" xml:space="preserve" version="1.1" viewBox="0 0 300 300" style="fill: %23D72323;"><path d="M200.3 269.9c-15.7 6.6-32.7 10.1-50.3 10.1-34.7 0-67.4-13.5-91.9-38.1C33.5 217.4 20 184.7 20 150s13.5-67.4 38.1-91.9C82.6 33.5 115.3 20 150 20s67.4 13.5 91.9 38.1C266.5 82.6 280 115.3 280 150c0 17.6-3.5 34.6-10 50.3 5 5 10 10.1 15.1 15.1 9.6-19.8 15-42 15-65.4C300 67.2 232.8 0 150 0S0 67.2 0 150s67.2 150 150 150c23.4 0 45.6-5.4 65.4-15-5.1-5-10.1-10.1-15.1-15.1z"/><path d="M267.8 300c-9.6-1.3-16.5-7-23.1-13.7-14.9-15.3-30.1-30.2-45.2-45.3-9.3-9.3-12-20.1-7.5-32.7.3-.8.3-2.1-.2-2.6-3.9-4.1-7.9-8-12-12.1-6.4 4-13.1 6.7-20.5 7.6-15.5 1.9-29-2.4-40.2-13.2-12.3-11.8-24.2-24-36.2-36.1-3.5-3.5-4.1-7.4-2.2-11.2 1.9-3.7 5.9-6.4 9.7-5.6 2.5.5 5.1 2 6.9 3.8 7.4 7.1 14.5 14.4 21.8 21.6.6.6 1.3 1.2 1.7 1.6l13.8-13.8c-6.2-6.1-12.6-12.5-18.9-18.9-1.9-1.9-3.8-3.7-5.6-5.6-3.8-4.2-3.7-9.7.2-13.6 3.9-3.9 9.5-4.1 13.6-.1 7.5 7.3 14.8 14.7 22.1 22.1.8.8 1.5 1.8 2.1 2.4l14.3-14.3c-2-1.8-4.5-4-6.8-6.3-6-5.9-11.9-11.8-17.8-17.8-2.7-2.7-3.7-5.9-2.4-9.6 1.4-3.9 4.2-6.3 8.3-6.9 3.4-.6 6 1 8.4 3.3l14.7 14.7c7.4 7.4 14.9 14.6 22 22.2 14.7 15.7 17 39.1 6.1 57.7-.4.7-.7 1.4-1.3 2.4 3.9 3.9 7.9 7.8 11.9 11.6.6.5 2 .6 2.8.3 12.5-4.4 23.3-1.7 32.7 7.6 15.1 15.1 30.1 30.3 45.3 45.2 6.7 6.5 12.4 13.4 13.7 23v5.8c-.2.5-.4 1.1-.5 1.6-1.8 9.5-6.6 17-15.5 21.2-3.3 1.6-6.9 2.3-10.4 3.5-1.9.2-3.8.2-5.8.2z"/><path d="M170 219.6c-2.7.7-5.4 1.2-8.2 1.5-3.1.4-6.2.6-9.2.6-17.9 0-34.2-6.6-47.2-19.2-10.2-9.8-20.2-20-30-29.8l-6.6-6.6c-9.5-9.5-11.7-22.7-5.8-34.3 4.9-9.6 14.4-16 24.5-16.6.5-6.9 3.5-13.6 8.9-18.9 5.2-5.1 11.8-8.2 18.7-8.7.2-2.5.7-4.9 1.6-7.4 3.8-10.8 12.6-18.1 23.9-20 1.5-.2 3.1-.4 4.6-.4 5.4 0 13.4 1.6 21.1 9.2 4.7 4.7 9.6 9.5 14.8 14.7 2.1 2.2 4.4 4.4 6.5 6.5 5.3 5.2 10.7 10.6 15.9 16.2 10.2 10.9 16.4 24.5 17.9 39.3.9 8.2.2 16.4-1.8 24.2h.1c12.8 0 24.7 5.1 34.7 14.8 3.6-10.9 5.6-22.6 5.6-34.7 0-60.8-49.2-110-110-110S40 89.2 40 150s49.2 110 110 110c12.1 0 23.8-2 34.7-5.6-9.8-10.1-14.8-22.1-14.7-34.8z"/></svg>
// @match *://greasyfork.org/*
// @match *://sleazyfork.org/*
// @exclude */assets/*
// @run-at document-start
// ==/UserScript==
// Main event initiator.
(() => {
'use strict';
// Pendulum
const pendulum = setInterval(() => {
try {
if (!document.querySelector('head')) {
return;
}
themeStyles(true);
// if favicon
} catch(e) {console.error("early-load-failed");catchErrors(e);}
}, 100);
// Only execute if window is interactive or fully loaded at this point.
if (document.readyState === 'interactive' || document.readyState === 'complete') {
setTimeout((() => {
clearInterval(pendulum);
themeStyles();
removeStyles();
// check theme choice in localstorage
// any favicon function
// add the toggle for theme changing
/* DOM Changes START */
commonUpdate();
/* DOM Changes END */
// fix favicon again, just in case
loadTime();
}), 100);
}
// Modifying head when available.
let observer = new MutationObserver(() => {
if (document.body) {
clearInterval(pendulum);
themeStyles();
removeStyles();
// any favicon function
observer.disconnect();
}
});
observer.observe(document.documentElement, {childList: true, subtree: true});
// Execute DOM modifications when ready state changes.
document.onreadystatechange = () => {
// Modify body when document is interactive.
if (document.readyState === 'interactive') {
// check theme choice in localstorage
// add the toggle for theme changing
/* DOM Changes */
commonUpdate();
}
// Modify body when document is complete.
if (document.readyState === 'complete') {
// fix favicon again, just in case
loadTime();
}
}
})();
// Update Sequence Common
function commonUpdate() {
processTheme();
setBasic();
forkNAV();
forkHEADER();
addFOOTER();
forkHOME();
listenEvents();
}
// Catch errors.
function catchErrors(e) {
console.log(e instanceof TypeError)
console.log(e.message)
console.log(e.name)
console.log(e.fileName)
console.log(e.lineNumber)
console.log(e.columnNumber)
console.log(e.stack)
}
// SVG Icons
const greasySVG = '<svg xmlns="http://www.w3.org/2000/svg" xml:space="preserve" version="1.1" viewBox="0 0 392 72"><path d="M23.8 26.8H43v25.8c-2.7.9-5.5 1.6-8.4 2.1s-6.1.7-9.7.7c-5.2 0-9.7-1-13.3-3.1s-6.4-5.1-8.2-9C1.5 39.4.6 34.6.6 29c0-5.4 1-10 3.1-14 2.1-3.9 5.1-7 9.1-9.2s8.8-3.3 14.5-3.3c2.8 0 5.5.3 8.1.8 2.6.6 5 1.3 7.2 2.3l-3 7c-1.7-.8-3.7-1.5-5.8-2.1-2.2-.6-4.4-.8-6.7-.8-3.7 0-6.9.8-9.5 2.4-2.7 1.6-4.7 3.8-6.1 6.7-1.4 2.9-2.1 6.3-2.1 10.2 0 3.8.6 7.2 1.7 10.1s2.9 5.1 5.4 6.7c2.4 1.6 5.6 2.4 9.5 2.4 1.9 0 3.6-.1 5-.3 1.4-.2 2.6-.4 3.8-.7V34h-11v-7.2zM72.2 15c.7 0 1.4 0 2.1.1s1.4.2 2 .3l-.8 7.7c-.5-.1-1.1-.2-1.8-.3-.7-.1-1.4-.1-1.9-.1-1.5 0-2.9.2-4.2.7s-2.5 1.2-3.6 2.2c-1 1-1.8 2.2-2.4 3.6-.6 1.5-.9 3.1-.9 5.1v20.4h-8.3V15.8H59l1.1 6.9h.4c.8-1.4 1.7-2.6 2.9-3.8 1.1-1.1 2.5-2.1 4-2.8 1.4-.7 3.1-1.1 4.8-1.1zm25.1 0c3.5 0 6.4.7 8.9 2.1s4.4 3.5 5.7 6.1 2 5.8 2 9.4V37h-26c.1 3.8 1.1 6.7 3 8.7s4.6 3.1 8.1 3.1c2.5 0 4.7-.2 6.7-.7s4-1.2 6.1-2.1v6.7c-1.9.9-3.9 1.6-5.9 2s-4.4.6-7.2.6c-3.8 0-7.2-.7-10.1-2.2s-5.2-3.7-6.8-6.7c-1.6-3-2.4-6.6-2.4-11s.7-8.1 2.2-11.1 3.6-5.4 6.2-7 5.9-2.3 9.5-2.3zm0 6.3c-2.6 0-4.7.8-6.3 2.5-1.6 1.7-2.5 4.2-2.8 7.4h17.7c0-1.9-.3-3.7-1-5.2-.6-1.5-1.6-2.7-2.8-3.5-1.3-.8-2.9-1.2-4.8-1.2zm39.5-6.3c4.9 0 8.6 1.1 11.2 3.3s3.8 5.6 3.8 10.2v26.2h-5.9l-1.6-5.5h-.3c-1.1 1.4-2.2 2.6-3.4 3.5s-2.5 1.6-4.1 2.1c-1.5.5-3.4.7-5.6.7-2.3 0-4.4-.4-6.2-1.3s-3.3-2.2-4.3-3.9-1.6-4-1.6-6.7c0-4 1.5-7 4.5-9s7.5-3.1 13.6-3.3l6.7-.2v-2c0-2.7-.6-4.6-1.9-5.8-1.3-1.1-3-1.7-5.3-1.7-1.9 0-3.8.3-5.7.8s-3.6 1.3-5.3 2.1l-2.7-5.8c1.9-1 4.1-1.8 6.5-2.5 2.4-.7 4.9-1.2 7.6-1.2zm6.8 21.1-5 .2c-4.1.1-7 .8-8.7 2.1-1.7 1.3-2.5 3-2.5 5.2 0 1.9.6 3.3 1.7 4.2 1.1.9 2.7 1.3 4.5 1.3 2.9 0 5.2-.8 7.1-2.4 1.9-1.6 2.8-4 2.8-7.2l.1-3.4zm44.1 7.5c0 2.6-.6 4.7-1.9 6.5s-3.1 3.1-5.4 4-5.3 1.4-8.7 1.4c-2.7 0-5.1-.2-7-.6s-3.8-1-5.5-1.8V46c1.9.9 3.9 1.6 6.2 2.2s4.5.9 6.6.9c2.7 0 4.7-.4 5.9-1.3s1.8-2 1.8-3.4c0-.8-.2-1.6-.7-2.3s-1.4-1.4-2.7-2.1-3.2-1.6-5.7-2.6-4.5-2-6.2-3-3-2.2-3.8-3.6-1.3-3.2-1.3-5.4c0-3.4 1.4-6.1 4.1-7.9s6.3-2.7 10.8-2.7c2.4 0 4.6.2 6.8.7s4.2 1.2 6.2 2.1l-2.6 6.2c-1.8-.8-3.5-1.4-5.3-1.9s-3.6-.8-5.4-.8c-2.1 0-3.8.3-4.9 1s-1.7 1.6-1.7 2.8c0 .9.3 1.7.8 2.3s1.5 1.3 2.8 1.9 3.2 1.4 5.5 2.4c2.3.9 4.3 1.8 6 2.8s3 2.2 3.9 3.6 1.4 3.5 1.4 5.7zm1.2-27.8h9l8 22.2c.4 1 .7 2 1 3s.6 1.9.8 2.9.4 1.9.5 2.8h.2c.2-1.2.6-2.6 1-4.1s.9-3 1.5-4.6l7.7-22.2h8.9L210.6 60c-1 2.5-2.1 4.7-3.5 6.5s-3 3.2-4.9 4.1-4.1 1.4-6.5 1.4c-1.2 0-2.2-.1-3.1-.2s-1.6-.3-2.2-.4v-6.6c.5.1 1.1.2 1.9.3s1.5.1 2.3.1c1.5 0 2.8-.3 3.8-.9s2-1.4 2.7-2.5 1.4-2.3 1.9-3.6l1.4-3.7-15.5-38.7zm68.7 38.9h-8.4V3.3h29v7.1h-20.7v16H277v7.1h-19.3v21.2h-.1zm61.8-19.5c0 3.2-.4 6.1-1.3 8.6s-2.1 4.6-3.7 6.3-3.6 3-5.8 3.9-4.8 1.4-7.7 1.4c-2.7 0-5.1-.5-7.3-1.4s-4.2-2.2-5.8-3.9-2.9-3.8-3.8-6.3-1.3-5.4-1.3-8.6c0-4.3.7-7.9 2.2-10.9s3.6-5.3 6.4-6.8 6.1-2.4 9.9-2.4c3.6 0 6.8.8 9.5 2.4s4.9 3.9 6.4 6.9 2.3 6.5 2.3 10.8zm-28.3 0c0 2.8.3 5.3 1 7.3s1.8 3.6 3.2 4.6 3.3 1.6 5.6 1.6 4.2-.5 5.6-1.6 2.5-2.6 3.2-4.6 1-4.4 1-7.3-.3-5.2-1-7.2-1.7-3.5-3.2-4.5-3.3-1.6-5.7-1.6c-3.4 0-5.9 1.1-7.5 3.4s-2.2 5.6-2.2 9.9zM346.8 15c.7 0 1.4 0 2.1.1s1.4.2 2 .3l-.8 7.7c-.5-.1-1.1-.2-1.8-.3s-1.4-.1-1.9-.1c-1.5 0-2.9.2-4.2.7s-2.5 1.2-3.6 2.2-1.8 2.2-2.4 3.6-.9 3.1-.9 5.1v20.4H327V15.8h6.5l1.1 6.9h.4c.8-1.4 1.7-2.6 2.9-3.8s2.5-2.1 4-2.8 3.2-1.1 4.9-1.1zm17.8-15v26.4c0 1.2 0 2.5-.1 3.9s-.2 2.7-.3 4h.2c.6-.8 1.3-1.8 2.2-2.9s1.7-2.1 2.4-2.9l12-12.8h9.5l-15.6 16.7 16.6 22.2h-9.7l-12.4-17.1-4.6 4v13.1h-8.3V0h8.1z"/></svg>',
sleazySVG = '<svg xmlns="http://www.w3.org/2000/svg" xml:space="preserve" version="1.1" viewBox="0 0 392 72"><path d="M45.2 40.7c0 3-.7 5.7-2.2 7.9-1.5 2.2-3.6 3.9-6.4 5.1-2.8 1.2-6.1 1.8-9.9 1.8-1.9 0-3.7-.1-5.4-.3-1.7-.2-3.3-.5-4.8-.9s-2.9-.9-4.1-1.5v-7.9c2.1.9 4.4 1.7 7 2.5 2.6.7 5.2 1.1 7.9 1.1 2.2 0 4-.3 5.4-.9s2.5-1.4 3.2-2.5 1.1-2.3 1.1-3.7c0-1.5-.4-2.8-1.2-3.9s-2.1-2-3.7-2.9c-1.6-.9-3.7-1.8-6.2-2.8-1.7-.7-3.3-1.5-4.8-2.3-1.5-.9-2.9-1.9-4.1-3.1s-2.1-2.6-2.8-4.2-1-3.5-1-5.7c0-2.9.7-5.4 2.1-7.5s3.4-3.6 5.9-4.7c2.5-1.1 5.5-1.7 8.9-1.7 2.7 0 5.2.3 7.6.8 2.4.6 4.7 1.4 7 2.4L42 12.6c-2.1-.9-4.2-1.6-6.1-2.1-2-.5-4-.8-6.1-.8-1.8 0-3.3.3-4.5.8s-2.2 1.3-2.8 2.3c-.6 1-1 2.1-1 3.5 0 1.5.4 2.8 1.1 3.8s1.9 2 3.4 2.8c1.6.8 3.6 1.8 6 2.8 2.8 1.2 5.2 2.4 7.2 3.7 2 1.3 3.5 2.8 4.6 4.6 1.1 1.8 1.4 4 1.4 6.7zm15.6 14h-8.3V0h8.3v54.7zM86.2 15c3.5 0 6.4.7 8.9 2.1s4.4 3.5 5.7 6.1 2 5.8 2 9.4V37h-26c.1 3.8 1.1 6.7 3 8.7s4.6 3.1 8.1 3.1c2.5 0 4.7-.2 6.7-.7s4-1.2 6.1-2.1v6.7c-1.9.9-3.9 1.6-5.9 2s-4.4.6-7.2.6c-3.8 0-7.2-.7-10.1-2.2s-5.2-3.7-6.8-6.7c-1.6-3-2.4-6.6-2.4-11s.7-8.1 2.2-11.1 3.6-5.4 6.2-7 5.9-2.3 9.5-2.3zm0 6.3c-2.6 0-4.7.8-6.3 2.5-1.6 1.7-2.5 4.2-2.8 7.4h17.7c0-1.9-.3-3.7-1-5.2-.6-1.5-1.6-2.7-2.8-3.5-1.2-.8-2.9-1.2-4.8-1.2zm39.5-6.3c4.9 0 8.6 1.1 11.2 3.3 2.5 2.2 3.8 5.6 3.8 10.2v26.2h-5.9l-1.6-5.5h-.3c-1.1 1.4-2.2 2.6-3.4 3.5s-2.5 1.6-4.1 2.1c-1.5.5-3.4.7-5.6.7-2.3 0-4.4-.4-6.2-1.3s-3.3-2.2-4.3-3.9-1.6-4-1.6-6.7c0-4 1.5-7 4.5-9s7.5-3.1 13.6-3.3l6.8-.2v-2c0-2.7-.6-4.6-1.9-5.8-1.3-1.1-3-1.7-5.3-1.7-1.9 0-3.8.3-5.7.8s-3.6 1.3-5.3 2.1l-2.7-5.8c1.9-1 4.1-1.8 6.5-2.5s4.9-1.2 7.5-1.2zm6.7 21.1-5 .2c-4.1.1-7 .8-8.7 2.1-1.7 1.3-2.5 3-2.5 5.2 0 1.9.6 3.3 1.7 4.2 1.1.9 2.7 1.3 4.5 1.3 2.9 0 5.2-.8 7.1-2.4 1.9-1.6 2.8-4 2.8-7.2l.1-3.4zm44 18.6h-29.6v-5.1l19.7-27.5H148v-6.4h27.8v5.6l-19.3 26.9h19.8l.1 6.5zm.8-38.9h9l8 22.2c.4 1 .7 2 1 3s.6 1.9.8 2.9.4 1.9.5 2.8h.2c.2-1.2.6-2.6 1-4.1s.9-3 1.5-4.6l7.7-22.2h8.9L199 60c-1 2.5-2.1 4.7-3.5 6.5s-3 3.2-4.9 4.1-4.1 1.4-6.5 1.4c-1.2 0-2.2-.1-3.1-.2s-1.6-.3-2.2-.4v-6.6c.5.1 1.1.2 1.9.3s1.5.1 2.3.1c1.5 0 2.8-.3 3.8-.9s2-1.4 2.7-2.5 1.4-2.3 1.9-3.6l1.4-3.7-15.6-38.7zm68.7 38.9h-8.4V3.3h29v7.1h-20.7v16h19.3v7.1h-19.3l.1 21.2zm61.7-19.5c0 3.2-.4 6.1-1.3 8.6s-2.1 4.6-3.7 6.3-3.6 3-5.8 3.9-4.8 1.4-7.7 1.4c-2.7 0-5.1-.5-7.3-1.4s-4.2-2.2-5.8-3.9-2.9-3.8-3.8-6.3-1.3-5.4-1.3-8.6c0-4.3.7-7.9 2.2-10.9s3.6-5.3 6.4-6.8 6.1-2.4 9.9-2.4c3.6 0 6.8.8 9.5 2.4s4.9 3.9 6.4 6.9 2.4 6.5 2.3 10.8zm-28.2 0c0 2.8.3 5.3 1 7.3s1.8 3.6 3.2 4.6 3.3 1.6 5.6 1.6 4.2-.5 5.6-1.6 2.5-2.6 3.2-4.6 1-4.4 1-7.3-.3-5.2-1-7.2-1.7-3.5-3.2-4.5-3.3-1.6-5.7-1.6c-3.4 0-5.9 1.1-7.5 3.4s-2.2 5.6-2.2 9.9zM335 15c.7 0 1.4 0 2.1.1s1.4.2 2 .3l-.8 7.7c-.5-.1-1.1-.2-1.8-.3s-1.4-.1-1.9-.1c-1.5 0-2.9.2-4.2.7s-2.5 1.2-3.6 2.2-1.8 2.2-2.4 3.6-.9 3.1-.9 5.1v20.4h-8.3V15.8h6.5l1.1 6.9h.4c.8-1.4 1.7-2.6 2.9-3.8s2.5-2.1 4-2.8 3.2-1.1 4.9-1.1zm17.8-15v26.4c0 1.2 0 2.5-.1 3.9s-.2 2.7-.3 4h.2c.6-.8 1.3-1.8 2.2-2.9s1.7-2.1 2.4-2.9l11.9-12.8h9.5L363 32.4l16.6 22.2H370l-12.4-17.1-4.6 4v13.1h-8.3V0h8.1z"/></svg>',
forkSVG = '<svg xmlns="http://www.w3.org/2000/svg" xml:space="preserve" version="1.1" viewBox="0 0 92 92"><path class="logo-ring" d="M46 0C20.6 0 0 20.6 0 46s20.6 46 46 46 46-20.6 46-46S71.4 0 46 0zm0 91C21.1 91 1 70.9 1 46S21.1 1 46 1s45 20.1 45 45-20.1 45-45 45z"/><circle class="logo-bg" cx="46" cy="46" r="44"/><path class="logo-fg" d="M43 37c1 1 1.9 2 2.9 3l2.8 2.8c.8.8 1.6 1.6 2.5 2.4.7.7 1.4 1.3 2.1 2l5 5c1.4 1.4 2.8 3 4.2 4.4 1.3 1.3 2.9 2.7 4.2 4.1 1.3 1.3 2.7 2.9 4.1 4.2 1.3 1.4 2.8 2.8 4.2 4.1 1.7 1.4 2.6 3.7 1.7 5.6-1.2 2.9-4.5 3.6-6.7 1.8-1.6-1.3-3.1-2.9-4.6-4.3-2.8-2.7-5.5-5.5-8.1-8.2L44.9 51.5l-7.7-7.7c-.5-.5-.8-.5-1.3-.1-2.8 2.2-5.6 1.4-7.8-.8-2.2-2.1-4.3-4.2-6.4-6.3-1.8-1.8-3.5-3.6-5.4-5.5-1.5-1.5-3.2-3.1-4.7-4.6-.6-.6-1.1-1.1-1.5-1.8-.2-.4-.1-1.1.2-1.5.4-.6 1.1-1 1.8-.4.9.6 1.6 1.3 2.4 2.1l6.9 6.9c1.3 1.3 2.7 2.8 4.1 4.1.1.1.3.2.5.4.7-.7 1.3-1.2 2-1.9l1.4-1.4c.4-.4.5-.7 0-1.1-2-1.9-3.9-3.7-5.8-5.6s-3.8-3.9-5.7-5.9c-.5-.5-1.1-1.1-1.4-1.6-.5-.7-.3-1.5.3-2s1.3-.4 1.9.3c2.2 2.2 4.4 4.3 6.6 6.5s4.4 4.4 6.7 6.8c1.4-1.3 2.7-2.7 4.1-4-1.1-1.1-2.1-2.2-3.2-3.2-1-1-1.9-1.8-2.9-2.8-1.2-1.2-2.5-2.6-3.8-3.8-1.2-1.2-2.5-2.4-3.6-3.7-.6-.6-.5-1.3.2-1.9.6-.6 1.3-.7 2-.1 1.2 1.2 2.5 2.5 3.7 3.6l4 4c1.4 1.4 2.8 2.9 4.2 4.2l2.4 2.4c1 1 1.8 1.8 2.7 2.8.5.5 1.1 1 1.4 1.4 1.6 2.2 1.8 4.6.4 7-.2.1-.4.3-.6.7zM10.4 68.5c-1 .3-1.3-.3-1.3-1V60h1.3c0 .3.1.6.1.7 1-.3 1.9-.8 2.9-1 1.1-.1 2 .6 2.5 1.6.5-.4.9-.9 1.3-1.1 2.4-1.2 4.3-.2 4.5 2.5.1 1.9 0 3.7 0 5.7h-1.3v-5.6c-.1-1.1-.8-1.9-1.7-2-1.1-.1-2.1.6-2.3 1.7-.2 1.1-.2 2.2-.2 3.3v2.6h-1.4V63c-.1-1.4-.6-2.1-1.7-2.3-1.1-.1-2.3.7-2.5 1.9-.2 1.1-.1 2.1-.1 3.2-.1.1-.1 2.7-.1 2.7zm19 0h-1.5V57h1.4v4.6h5.6V57h1.5v11.5h-1.5v-5.6h-5.6c.1 1.8.1 3.7.1 5.6zm55.1-24.2c-.1.8-.2 1.7-.3 2.6-.3 1.6-1.2 2.7-2.7 3.2-1.6.6-3.1-.1-3.9-1.4-.6-.9-.8-2.1-1-3.2-.3-1.7 0-3.4.6-5.1.8-2.1 3.9-2.8 5.6-1.2 1.7 1.3 1.5 3.2 1.7 5.1zm-1.5 0c-.2-1.1-.3-2.1-.5-3.1s-1-1.6-1.8-1.7c-.9-.1-1.6.4-2 1.4-.8 2.3-.8 4.6.2 6.9.4 1 1.1 1.1 1.8 1 .8 0 1.5-.3 1.7-1.2l.6-3.3zM59.2 79.8v-4.6h1.3v1.3c0 2.9-.1 5.6 0 8.5 0 1.1-.3 1.4-1.3 1.5 0-.2-.1-.4-.2-.8-.8 1.4-1.9 1.7-3.2 1.5-1.3-.2-2.2-1.1-2.7-2.5-.7-1.8-.4-3.5.5-5.2 1.1-1.6 4.1-1.6 5.6.3zm.1 3.1c-.2-.8-.4-1.6-.7-2.3-.7-1.3-2.7-1.4-3.4-.2-1.1 1.5-1.1 3.4 0 4.9.7 1 3 1 3.4-.1.3-.7.5-1.5.7-2.3zm-16.6.2h-6.5c-.1 1.8 1 2.9 2.8 2.9 1.1 0 2.1-.3 3.2-.5.2 1.1.2 1.1-1.1 1.5-1.4.5-2.9.5-4.2-.1-1.7-.9-2.5-2.4-2.3-4.2.1-1.4.3-2.8 1.7-3.6 1.6-1 3.3-1.1 5 .1.6.4.9 1.2 1.1 2 .2.5.2 1.1.3 1.9zm-1.6-.9c0-1.5-.9-2.6-2.2-2.7-1.6-.1-2.7 1-2.8 2.7h5zm10.5-50.6c-2.5 0-4-1.7-3.8-4.5.1-3 1.3-4.3 3.9-4.3s3.8 1.5 3.9 4.5c0 2.6-1.7 4.4-4 4.3zm2.5-4.3c-.2-.8-.3-1.5-.6-2.2-.6-1.3-2.4-1.6-3.3-.5-1.1 1.3-1.2 3.4-.3 4.9.5.8 1.4 1.1 2.4.9 1.2-.6 1.7-1.4 1.8-3.1zm4.5 4.1h-1.5v-8.5h1.4c0 .3.1.5.1.9.1-.1.2-.1.2-.1 1.2-1.1 3.3-1.3 4.4-.4.6.5 1 1.5 1.1 2.4.2 1.9 0 3.8 0 5.7H63v-5.6c-.1-1.2-.9-1.9-1.9-1.9-1.2 0-2.4.9-2.4 2-.1-.1-.1 5.5-.1 5.5zM40.1 12.8h-1.4V4.3h1.4c0 .2.1.5.1.9.1 0 .2-.1.2-.1 1.2-1.1 3.2-1.4 4.4-.4.6.5 1 1.5 1.1 2.4.2 1.9 0 3.8 0 5.8h-1.3V7.3c-.1-1.1-1-1.9-1.9-2-1.2 0-2.3.9-2.4 2-.1 1.4 0 2.9 0 4.3-.2.3-.2.7-.2 1.2zm13.6-8.5h1.4v8.5h-1.4c0-.4 0-.7-.1-.9-.8.3-1.4.9-2.3 1-2.1.2-3-.4-3.3-2.6-.3-1.9-.1-4-.1-6h1.2c0 1.6-.1 3.3 0 5 0 .7.3 1.6.8 2 1.3 1.1 3.4.2 3.5-1.6.1-1.4 0-2.9 0-4.3.3-.3.3-.7.3-1.1zm30 56.6c0-.3 0-.6.1-1h1.1c.7 2.7-.5 4.9-1.8 7.1-.1.2-.2.3-.3.5-.3.4-.7 1.1-1 1.1-.8.1-1.7.1-2.4-.3-1.1-.7-2-1.6-2-3.1 0-1.1 0-2.5.5-3.5 1.1-2.3 3.5-2.7 5.5-1 .1.1.1.3.1.4l.2-.2zm-5 3.2c.1 0 .1 0 .2.1 0 .5.1 1 .1 1.4.2 1.2.8 1.7 1.9 1.8 1.1.1 1.9-.4 2.4-1.3.5-1.1.6-2.3.1-3.3-.3-.7-1.1-1.3-1.7-1.7-.8-.4-1.7.1-2.1.8-.5.6-.6 1.4-.9 2.2zm-2.9-32.6h-1.2V23h1.2c0 .3 0 .6.1 1 .5-.3 1-.7 1.4-.9 1.6-.8 4-.4 4.4 2.3.1.4.1.7.1 1.1v5.1h-1.3v-5.2c0-1.5-.8-2.4-1.9-2.5-1.3-.1-2.5 1-2.6 2.4s0 2.9 0 4.3c-.2.2-.2.5-.2.9zM51.4 87.1H50v-5.5c0-1-.4-1.7-1.3-2-.9-.4-1.8-.2-2.3.6-.5.6-.8 1.3-.9 2-.1 1.3 0 2.6 0 3.9v1h-1.2v-8.5h1.2c0 .3 0 .7.1 1 .4-.3.8-.5 1.1-.8 2.2-1.2 4.5-.1 4.7 2.5.1 1.9 0 3.8 0 5.8z"/><path class="logo-fg" d="M51.2 67.3v4.5h-1.3V60.1l.2-.2c.6.6 1.2 1.1 1.8 1.6.1.1 0 .4-.1.6-.9 1.6-.7 3.2.2 4.6.3.5 1.1.7 1.7.7.6 0 1.1-.4 1.7-.8.3-.2.4-.7.5-1.1 1.4 1 1.5 1.3.3 2.4-1.7 1.3-3.1 1.2-5-.6zm-24.1 17c-1.3-.3-1.3-.3-1.3-1.7v-4h1.3c0 .3 0 .6.1 1 .4-.2.7-.5 1-.7 2.1-1.3 4.8-.1 5.2 2.4.2 1.1.1 2.3-.1 3.4-.1.6-.5 1.1-1 1.4-.3.2-1-.1-1.6-.1 1.4-1.6 1.3-3.3 1-5.1-.2-.9-1.2-1.4-2.1-1.4s-1.9.9-2.1 1.9c-.4.9-.3 1.8-.4 2.9zm11.6-23.4c-.4 0-.6-.1-1-.1V60c.3-.1.6-.1.9-.2v-2.4H40v2.4h3v1h-2.9v5.6c0 .2.5.6.8.6.7.1 1.3 0 2 0v1.3c-.8 0-1.5.1-2.3 0-1.2-.2-2-1.1-2.1-2.4.2-1.5.2-3.2.2-5zm5.6 0c-.3 0-.6-.1-.9-.1V60c.3-.1.6-.1 1-.2v-2.4h1.3v2.4h3v1h-2.9v5.5c0 .6.4.9 1 .9h1.9v1.2c-.2 0-.3.1-.5.1-3.1.1-3.7-.5-3.7-3.6-.2-1.3-.2-2.5-.2-4zM20.8 38.5c.6.4.9.9.6 1.5-1.6 4-1.2 7.3 1 12-.7-.2-1.2-.3-1.4-.6-2.6-3.7-3-8.6-.2-12.9zM3.1 41.3c2.8-.1 4 1.7 4 4.6 0 2.6-1.7 4.4-4 4.2 0-.4-.1-.7-.1-1 2.1-.8 2.8-1.6 2.7-3.6-.1-1.8-.9-2.8-2.7-3.2.1-.4.1-.7.1-1zm22 27.3h-1.2v-12h1.2v12zM8.8 41.4H10c0 .4 0 .7.1 1.1 1-1.1 2.1-1.4 3.5-1.2v1.1c-2.6-.2-3.6.8-3.6 3.3v4.1c0 .1 0 .1-.1.2H8.7c.1-2.9.1-5.7.1-8.6zm18.9 7.2c.3-.9.6-1.6.8-2.4 1.4.3 1.4.3 1 1.5-.1.3-.2.6-.4.8-.8 1.5-.8 1.5-2.4 1.3-1.1-2.8-2.1-5.5-3.2-8.4 2.9 1.7 3.1 4.7 4.2 7.2zm39.3 28c-3.3 1.1-4.4 4.3-2.7 7.7-.4.2-.7.4-1.2.8-.3-.9-.7-1.6-.8-2.4-.2-1.5-.4-3.1.6-4.5.5-.8 1.1-1.5 1.9-2.1 1.1-.8 1.3-.7 2.2.5zm3.8-53.7h1.4v8.5h-1.4v-8.5zM58.6 12.8h-1.4V4.5c1.4.1 1.4.1 1.4 1.5v6.8zm17.6 51.8c-1.1-.2-2.5.6-3.3-1h2c0-2.5-1.7-3.3-4.2-2.1l-.9-.9c1.7-1.1 3.5-1.2 5.2 0 1.1.9 1.3 2.4 1.2 4zM60.5 44v-1.1h9.9V44h-9.9zm10 2.1v1.1h-9.9c0-.3 0-.7-.1-1.1h10zm-36.7.9c0 1 .4 1.6 1.3 1.8 1.2.3 2.3-.1 3.1-1.1.7.7 1.3 1.4 1.9 2.1-.1 0-.1.1-.2.2h-1.3c-.1-.4-.1-.7-.2-1.1-1.3 1.3-2.9 1.8-4.6 1-1-.6-1.5-1.5-1.3-2.8.3-.1.7-.1 1.3-.1zm28.5-34.2H61v-7c1 .1 1.3.5 1.3 1.5-.1 1.9 0 3.7 0 5.5zM18.5 79.1c1.5-1.1 2.9-.9 4-.1 1.2.9 1.5 2.2 1.7 3.7-1-.2-1.5-.7-1.9-1.5-.4-1-1.1-1.7-2.3-1.6-.4-.1-.8-.3-1.5-.5zm26-56.2h1.2V29c-.9-.9-1.5-1.8-1.3-3.2.2-.8.1-1.9.1-2.9zM7.9 26c1.2.5 1.4 1.3 1.3 2.5-.1 1 0 1.9 0 2.9H7.9V26zM32 8.9V10c-1.6 0-3.3.1-4.9 0-.4 0-.8-.6-1.4-1.1H32zm11.3 14v.9c-.9 0-1.8.2-2.6-.1-1.1-.4-1.8-1.9-1.7-3.3h1.2v2.4c1.1.1 2.1.1 3.1.1zM84 26.3c1 1.6 1.7 3.3 1.1 5.2H84v-5.2zm3.1 21.8h1.2c.5 1.2-.5 2-.8 3-.2.8-.6.8-1.2.6.3-1.1.5-2.3.8-3.6zM64.7 14.6l.9-3.6h1.2c.3 1.5-.9 3.7-2.1 3.6zM7.5 57.1l-2 3.2c-.6-1-.8-1.6 0-2.6.6-.9 1.2-.7 2-.6zM28.1 6.6c1.2-.3 2.5-.7 3.8-1.1v1.3h-3.8v-.2zm25.3 37.6c-1.1-.7-1.9-1.3-1.3-2.8h1.3v2.8zm33.5-.8v-1.7h1.4v1.7h-1.4zM52 38h1.3v1.6H52V38zm18.8-18.6h1.4V21h-1.4v-1.6zM45.7 21h-1.2v-1.6h1.2V21z"/></svg>',
clearSVG = '<svg xmlns="http://www.w3.org/2000/svg" xml:space="preserve" version="1.1" viewBox="0 0 300 300"><path d="M150.3 125.2c1-1.2 1.7-2.1 2.5-2.9C191.4 83.6 230 45 268.6 6.5c6.8-6.8 14.7-8.3 22.3-4.2 9.4 5.1 12 17.6 5.4 26-1 1.3-2.2 2.5-3.3 3.7-38.5 38.5-77 77.1-115.6 115.6-.7.7-1.5 1.5-2.3 2.4.9.9 1.7 1.8 2.5 2.6l116 116c6.9 6.9 8.3 15 4 22.6-5.2 9.1-17.6 11.6-25.9 5.1-1.3-1-2.5-2.2-3.7-3.3-38.5-38.5-77.1-77-115.6-115.6-.7-.7-1.5-1.5-2.4-2.3-.9.9-1.8 1.7-2.6 2.5l-116 116c-6.9 6.9-15 8.3-22.6 4-9.1-5.2-11.6-17.6-5.1-25.9 1-1.3 2.2-2.5 3.3-3.7 38.5-38.5 77-77.1 115.6-115.6.7-.7 1.5-1.5 2.3-2.4-.9-.9-1.7-1.8-2.5-2.6l-116-116c-6.9-6.9-8.3-15-4-22.6C7.6-.3 20-2.8 28.3 3.7c1.3 1 2.5 2.2 3.7 3.3 38.5 38.6 77 77.1 115.6 115.6.7.8 1.5 1.5 2.7 2.6z"/></svg>',
findSVG = '<svg xmlns="http://www.w3.org/2000/svg" xml:space="preserve" version="1.1" viewBox="0 0 300 300"><path d="M223.7 239.9C164.9 288.8 80.3 279.7 33 224.7c-46.3-53.8-43.6-133 6.2-184.3 48.3-49.7 128.4-54 182.6-9.8 57.6 46.9 67.8 134 17.4 194 1.1.7 2.6 1.2 3.6 2.2 17.8 17.7 35.6 35.6 53.4 53.3 3.3 3.3 4.6 7.1 3.4 11.7-1.2 4.2-4.1 6.9-8.3 8-4.6 1.1-8.3-.6-11.5-3.9l-53.1-53.1c-1-1.1-2-1.9-3-2.9zm-87.9 9.1c62.4.2 113.2-50.5 113.2-113S198.9 23.2 136.2 22.9c-62.4-.5-113.1 50-113.4 112.7-.2 62.5 50.3 113.2 113 113.4z"/></svg>',
menuSVG = '<svg xmlns="http://www.w3.org/2000/svg" xml:space="preserve" version="1.1" viewBox="0 0 300 300"><path d="M281.5 68.9h-263C8.3 68.9 0 60.6 0 50.4s8.3-18.5 18.5-18.5h263c10.2 0 18.5 8.3 18.5 18.5s-8.3 18.5-18.5 18.5zm0 199.2h-263C8.3 268.1 0 259.8 0 249.6s8.3-18.5 18.5-18.5h263c10.2 0 18.5 8.3 18.5 18.5s-8.3 18.5-18.5 18.5zm0-99.6h-263C8.3 168.5 0 160.2 0 150s8.3-18.5 18.5-18.5h263c10.2 0 18.5 8.3 18.5 18.5s-8.3 18.5-18.5 18.5z"/></svg>',
closeSVG = '<svg xmlns="http://www.w3.org/2000/svg" xml:space="preserve" version="1.1" viewBox="0 0 300 300"><path d="M5.8 268.1 268.1 5.8c7.2-7.2 18.9-7.2 26.2 0 7.2 7.2 7.2 18.9 0 26.2L31.9 294.2c-7.2 7.2-18.9 7.2-26.2 0-7.2-7.2-7.2-18.9.1-26.1z"/><path d="m31.9 5.8 262.3 262.3c7.2 7.2 7.2 18.9 0 26.2-7.2 7.2-18.9 7.2-26.2 0L5.8 31.9c-7.2-7.2-7.2-18.9 0-26.2 7.2-7.2 18.9-7.2 26.1.1z"/></svg>',
colorsSVG = '<svg xmlns="http://www.w3.org/2000/svg" xml:space="preserve" version="1.1" viewBox="0 0 300 300"><path d="M132.6 108.6c-10-11.5-12.7-23.6-6.8-36.9 7.1-15.9 23.6-22.9 40-17 2.4.9 3.7.3 5.4-1.4 12.4-12.5 24.8-25 37.2-37.4C224.2.1 246.7-4.3 266.8 4.4c21 9.1 33.9 28.9 33.1 51.1-.5 13.5-5.6 25.1-15.1 34.7-12.7 12.8-25.4 25.6-38.3 38.3-1.6 1.6-1.8 2.8-1.1 4.9 7.5 21.7-8.8 44.3-31.1 43.3-8.1-.4-15-3.8-21.8-10.2-.7 1.2-1.2 2.5-2.1 3.5-29.1 29.3-58.3 58.5-87.5 87.8C96 264.6 88.1 269 78.1 269c-1 0-2.2.8-3 1.6-6.2 6.1-12.4 12.2-18.4 18.4-14.3 14.8-31.8 13.2-46.7 3.1-7.9-5.4-10.3-14.8-10-24.4.3-8.8 4.1-16.1 10.2-22.2 6.3-6.3 12.6-12.6 18.8-19 1-1 1.8-2.6 1.9-4 .6-9.3 4.2-17.1 10.9-23.7 29.3-29.3 58.5-58.6 87.8-87.9.9-.8 1.9-1.4 3-2.3zm15 14.5c-23.1 23.2-46.3 46.4-69.4 69.6 0 0 .4.1.8.1 19.2 0 38.5 0 57.7-.1 1.3 0 2.9-.9 3.9-1.9 11.9-11.8 23.7-23.6 35.4-35.4.7-.7 1.3-1.5 1.8-2-10.2-10.3-20.3-20.5-30.2-30.3z"/></svg>',
translateSVG = '<svg xmlns="http://www.w3.org/2000/svg" xml:space="preserve" version="1.1" viewBox="0 0 300 300"><path d="M85 129.4c7.9-17.8 14-35.5 18.5-54.5H20.1C9.5 74.9 2 68.9.2 59.2c-1.8-9.8 5.1-19.6 14.9-21.3 2-.3 4.1-.4 6.2-.4H75V25.7c0-2.3-.1-4.6 0-6.9C75.4 8.1 83.4 0 93.7 0c10.3 0 18.6 8.2 18.8 18.9.1 6.1 0 12.1 0 18.5h4.7c16.8 0 33.7-.1 50.5 0 11.7.1 19.9 8.3 19.6 19.5-.2 8.8-6.8 16.8-15.6 17.5-8.6.7-17.3.5-26 .4-2.8 0-4 .6-4.7 3.5-6.3 28.8-16.3 56.3-29.7 82.5-1.3 2.5-1.5 4.1.6 6.3 4.9 5.1 9.5 10.5 14.3 15.7 7.7 8.4 7.8 19.8 0 27.2-7.9 7.5-19.5 6.8-27.4-1.5-3.1-3.3-6.1-6.6-9.3-10C84.2 205.8 79 213 73.6 220c-12.5 16-26.4 30.7-41.4 44.2-8.2 7.4-19.6 7.2-26.9-.5-7.2-7.7-6.9-19.3 1.3-26.8 19.2-17.5 36.3-36.8 50.9-58.2 1.8-2.6 3.3-5.5 5.3-7.9 2.3-2.7 1.4-4.6-.2-7.3-8.7-14.3-17.4-28.7-25.5-43.4-4.5-8-2-17.4 4.9-23 6.7-5.4 16.7-5.5 23.3.1 2.3 1.9 4 4.5 5.5 7.1 4.4 7.6 8.5 15.3 12.8 23 .2.6.6 1.1 1.4 2.1zm120.9-17.1c8.3.3 14 4.1 17.6 11.3 8.5 17.1 17.1 34.2 25.7 51.2 16 32 32 64 48.1 95.9 2.6 5.2 3.8 10.5 1.6 16.2-2.9 7.6-8.5 11.9-16.5 12.4-7.9.5-14-3-17.7-10-4.2-8-8.2-16-12.1-24.2-1.1-2.3-2.3-3.2-4.9-3.2-27.6.1-55.2.1-82.7 0-2.6 0-3.9.9-4.9 3.2-3.8 7.9-7.8 15.7-11.7 23.5-5.2 10.1-15.9 14-25.5 9.3-9.6-4.7-13.1-15.8-8-25.9 24.7-49.4 49.5-98.8 74.2-148.2 3.3-7 8.9-11.1 16.8-11.5zM232 224.4c-8.7-17.4-17.1-34.2-25.8-51.5-8.8 17.5-17.2 34.3-25.8 51.5H232z"/></svg>',
pagesSVG = '<svg xmlns="http://www.w3.org/2000/svg" xml:space="preserve" version="1.1" viewBox="0 0 300 300"><path d="M150 0C67.2 0 0 67.2 0 150s67.2 150 150 150 150-67.2 150-150S232.8 0 150 0zM82.1 136.1H28.2c2.2-20.1 9-38.4 20.3-55C62.4 60.7 80.8 45.9 104.4 36 89 68.2 83.8 101.7 82.1 136.1zm22 127.4c-37.1-13.6-71.4-52.6-75.8-99.6H82c1.8 34.2 6.9 67.8 22.1 99.6zm39.5-233.9c4.5-3.3 8.7-3.5 12.9.2 4.1 3.6 8 7.7 11 12.3 8.7 13.5 13.3 28.7 16.8 44.2 3.6 15.8 5.6 31.9 6.2 48.1 0 .5 0 1-.1 1.9h-80.7c0-2.1-.1-4 0-6 1.5-24.2 5.3-48 14.1-70.8 3.1-8.2 6.9-16.1 12.5-22.9 2.1-2.6 4.6-5 7.3-7zm-34 134.2h81c-.3 5.1-.6 9.9-1 14.8-1.9 21.2-5.7 41.9-13.4 61.9-3.2 8.3-7 16.2-12.6 23.1-1.9 2.3-4 4.5-6.3 6.3-5.1 3.9-9.8 4.3-14.5-.1-4.5-4.2-8.7-9.1-11.9-14.4-8.9-15-13.7-31.6-16.6-48.7-2.2-13.1-3.2-26.4-4.8-39.6 0-1 .1-2.1.1-3.3zm86.3 100c15.2-31.8 20.4-65.4 22.1-100h53.6c-2.6 36.5-28.6 81.1-75.7 100zM218 136.2c-1.8-34.3-6.9-68-22.2-99.9 43.8 17.1 72.6 59.6 75.8 99.9H218z"/></svg>',
autoSVG = '<svg xmlns="http://www.w3.org/2000/svg" xml:space="preserve" version="1.1" viewBox="0 0 300 300"><path d="M126 171.8h48l9 24.4c.8 2 1.9 3.6 3.6 4.7s3.4 1.7 5.4 1.7c3.5 0 6.2-1.4 8.1-4.1s2.2-5.8.9-9L162.8 88.9c-.8-2-1.9-3.6-3.6-4.7s-3.4-1.7-5.4-1.7h-7.5c-2 0-3.8.6-5.4 1.7s-2.8 2.7-3.6 4.7L99.4 189.8c-1.3 3-1 5.9.8 8.6s4.4 4.1 7.9 4.1c2 0 3.8-.6 5.4-1.7s2.8-2.7 3.6-4.7l8.9-24.3zm6-17.3 17.2-49.5h1.5l17.2 49.5H132zM150 300c-20.8 0-40.3-3.9-58.5-11.8s-34.1-18.6-47.6-32.1-24.2-29.4-32.1-47.6S0 170.8 0 150c0-8 .6-16 1.9-24s3.1-15.9 5.6-23.6c1.3-4 3.8-6.7 7.7-8.1s7.6-1.1 11.1.9c3.8 2 6.4 4.9 8.1 8.8s1.8 7.9.6 12.2c-1.5 5.5-2.7 11.1-3.6 16.7-.9 5.6-1.3 11.3-1.3 17.1 0 33.5 11.6 61.9 34.9 85.1s51.5 34.9 85 34.9 61.9-11.6 85.1-34.9S270 183.5 270 150s-11.6-61.9-34.9-85.1S183.5 30 150 30c-6 0-11.9.4-17.8 1.3s-11.7 2.2-17.4 3.9c-4.3 1.2-8.2 1.1-12-.4s-6.5-4.1-8.2-7.9-1.8-7.6-.2-11.4 4.4-6.4 8.4-7.7c7.5-2.7 15.2-4.8 23.2-6S142 0 150 0c20.7 0 40.2 3.9 58.5 11.8s34.1 18.6 47.6 32.1 24.2 29.4 32.1 47.6S300 129.3 300 150s-3.9 40.2-11.8 58.5-18.6 34.1-32.1 47.6-29.4 24.2-47.6 32.1S170.7 300 150 300zM52.5 75c-6.2 0-11.6-2.2-15.9-6.6S30 58.8 30 52.5s2.2-11.6 6.6-15.9S46.2 30 52.5 30s11.6 2.2 15.9 6.6C72.8 41 75 46.3 75 52.5s-2.2 11.6-6.6 15.9c-4.3 4.4-9.6 6.6-15.9 6.6zm7.5 75c0-25 8.8-46.2 26.2-63.8S125 60 150 60s46.2 8.7 63.8 26.2S240 125 240 150s-8.7 46.2-26.2 63.8S175 240 150 240s-46.3-8.8-63.8-26.2S60 175 60 150z"/></svg>',
moonSVG = '<svg xmlns="http://www.w3.org/2000/svg" xml:space="preserve" version="1.1" viewBox="0 0 300 300"><path d="M150.3 300c-42 0-77.6-14.5-106.7-43.6S0 191.7 0 149.7c0-38.4 12.5-71.7 37.6-100S94.6 5 133.6.2c3.6-.6 6.8-.1 9.6 1.5s5 3.5 6.7 6.1c1.7 2.5 2.6 5.4 2.7 8.8s-.9 6.5-3.1 9.6c-4.7 7.2-8.3 14.9-10.6 23-2.4 8.1-3.5 16.6-3.5 25.5 0 25.1 8.8 46.3 26.3 63.9s38.8 26.3 63.9 26.3c8.6 0 17.2-1.3 25.7-3.8s16.1-6 22.8-10.4c3.1-1.9 6.2-2.9 9.4-2.7 3.2.1 6.1.9 8.6 2.3 2.8 1.4 4.9 3.5 6.5 6.3 1.5 2.8 2 6.1 1.5 10-3.9 38.4-20.2 70.3-49.1 95.6S188.4 300 150.3 300z"/></svg>',
sunSVG = '<svg xmlns="http://www.w3.org/2000/svg" xml:space="preserve" version="1.1" viewBox="0 0 300 300"><path d="M150 218.2c-18.9 0-34.9-6.6-48.2-19.9s-20-29.4-20-48.3 6.6-34.9 19.9-48.2 29.4-19.9 48.2-19.9 34.9 6.6 48.2 19.9S218 131.2 218 150s-6.6 34.9-19.9 48.2-29.2 20-48.1 20zM13.6 163.6c-3.9 0-7.1-1.3-9.7-3.9S0 153.9 0 150s1.3-7.1 3.9-9.7c2.6-2.6 5.9-3.9 9.7-3.9h27.3c3.9 0 7.1 1.3 9.7 3.9 2.6 2.6 3.9 5.9 3.9 9.7s-1.3 7.1-3.9 9.7-5.9 3.9-9.7 3.9H13.6zm245.5 0c-3.9 0-7.1-1.3-9.7-3.9s-3.9-5.9-3.9-9.7 1.3-7.1 3.9-9.7c2.6-2.6 5.9-3.9 9.7-3.9h27.3c3.9 0 7.1 1.3 9.7 3.9 2.6 2.6 3.9 5.9 3.9 9.7s-1.3 7.1-3.9 9.7c-2.6 2.6-5.9 3.9-9.7 3.9h-27.3zM150 54.5c-3.9 0-7.1-1.3-9.7-3.9s-3.9-5.9-3.9-9.7V13.6c0-3.9 1.3-7.1 3.9-9.7S146.1 0 150 0s7.1 1.3 9.7 3.9c2.6 2.6 3.9 5.9 3.9 9.7v27.3c0 3.9-1.3 7.1-3.9 9.7-2.6 2.6-5.8 3.9-9.7 3.9zm0 245.5c-3.9 0-7.1-1.3-9.7-3.9-2.6-2.6-3.9-5.9-3.9-9.7v-27.3c0-3.9 1.3-7.1 3.9-9.7s5.9-3.9 9.7-3.9 7.1 1.3 9.7 3.9c2.6 2.6 3.9 5.9 3.9 9.7v27.3c0 3.9-1.3 7.1-3.9 9.7-2.6 2.6-5.8 3.9-9.7 3.9zM63.4 82.5 48.8 68.2c-2.7-2.5-4-5.7-3.9-9.5.1-3.9 1.4-7.2 3.9-9.9 2.7-2.7 6-4.1 9.9-4.1s7 1.4 9.5 4.1l14.3 14.7c2.5 2.7 3.8 5.9 3.8 9.5 0 3.6-1.2 6.8-3.8 9.5s-5.6 4-9.4 3.9c-3.7-.1-7-1.4-9.7-3.9zm168.4 168.7-14.3-14.7c-2.5-2.7-3.8-6-3.8-9.7s1.2-6.9 3.8-9.4c2.5-2.7 5.6-4 9.4-3.9 3.8.1 7 1.4 9.7 3.9l14.7 14.3c2.7 2.5 4 5.7 3.9 9.5s-1.4 7.2-3.9 9.9c-2.7 2.7-6 4.1-9.9 4.1s-7.1-1.2-9.6-4zM217.5 82.5c-2.7-2.5-4-5.6-3.9-9.4s1.4-7 3.9-9.7l14.3-14.7c2.5-2.7 5.7-4 9.5-3.9 3.9.1 7.2 1.4 9.9 3.9 2.7 2.7 4.1 6 4.1 9.9s-1.4 7-4.1 9.5l-14.7 14.3c-2.7 2.5-5.9 3.8-9.5 3.8s-6.8-1.2-9.5-3.7zM48.8 251.2c-2.7-2.7-4.1-6-4.1-9.9s1.4-7 4.1-9.5l14.7-14.3c2.7-2.5 6-3.8 9.7-3.8s6.9 1.2 9.4 3.8c2.7 2.5 4 5.6 3.9 9.4s-1.4 7-3.9 9.7l-14.3 14.7c-2.5 2.7-5.7 4-9.5 3.9s-7.3-1.4-10-4z"/></svg>',
profileSVG = '<svg xmlns="http://www.w3.org/2000/svg" xml:space="preserve" version="1.1" viewBox="0 0 300 300"><path d="M149.9 165.4c17.8 0 35.7-1.1 53.3.3 24.2 1.9 44.4 12.6 58.4 33.1 13.5 19.8 11.3 43.5-4.9 61.3-18 19.7-40.6 30.9-66.4 35.9-32.3 6.2-64.5 5.7-96.1-4-20.2-6.3-37.7-17-51.8-32.9-18.3-20.8-17.1-48.9 3.2-69.5 16.5-16.8 37.1-24.4 60.4-24.6 14.6-.2 29.3 0 43.9 0v.4zm75-92.6c1.7 40-30.9 75.5-71.1 77.1-42.3 1.8-77-30.2-78.7-72.7C73.5 37.7 105.8 2.4 144.8.1c42.7-2.4 78.7 30.2 80.1 72.7z"/></svg>',
logoutSVG = '<svg xmlns="http://www.w3.org/2000/svg" xml:space="preserve" version="1.1" viewBox="0 0 300 300"><path d="M150.2 300c-74.1-.3-137.3-53.8-148.3-127.4-7.7-51.8 8.3-96.3 46.1-132.7 10.3-9.9 25-9.6 34.4.2 9.3 9.7 8.7 24.5-1.6 34.4-23.3 22.4-34.3 49.6-32.7 81.9 2.2 43.4 35.3 82.8 77.7 92.5 57 13 111.4-20.6 123.9-77.5 8.1-36.8-2.4-68.9-29.1-95.4-5.8-5.8-9.9-12-9.4-20.4.5-9.8 5.4-17 14.4-20.9 9.3-4 18.1-2.4 25.6 4.4 15.6 14.1 27.6 30.8 36 50.1 39.5 89.6-16 192.4-112.6 208.4-8.1 1.3-16.3 1.6-24.4 2.4z"/><path d="M174 46.9c0-7.6 0-15.2-.1-22.8-.2-13.8-10.5-24-23.8-24.1-13.5-.1-23.9 10.3-24 24.2-.1 14.8-.1 29.6-.1 44.4 0 16.1 0 32.3.1 48.4 0 7.4 2.7 13.7 8.5 18.4 7.6 6.3 16.2 7.5 25.1 3.6 9.4-4.1 14.1-12 14.2-22.2.1-7.6.1-15.3.1-22.9v-47z"/></svg>';
const navSVGs = {
"discussionsSVG": '<svg xmlns="http://www.w3.org/2000/svg" xml:space="preserve" version="1.1" viewBox="0 0 300 300"><path d="M300 148.4c-.3 74.4-51.6 135.8-123.1 149-31.4 5.8-61.5 1.7-90.4-11.9-2.4-1.1-4.5-1.3-7-.7-20.9 4.8-41.8 9.4-62.7 14.4-10.2 2.5-18.6-5.7-16-16.3 5.2-21.2 9.8-42.6 14.6-63.9.3-1.4.1-3.1-.5-4.4-24.1-55-19.3-107.4 16.6-155.9C54.7 27.5 86.4 8.9 124.8 2.2c77.6-13.4 149.6 35.2 169.7 107.2 3.7 13.4 5.4 27 5.5 39zm-150-11.2h53.2c3.5 0 7 .1 10.5-.1 7.1-.5 12.3-7.4 10.9-14.5-1.3-6.3-6.1-10.1-13.2-10.1H86.7c-8.1.7-13.3 8.2-11.1 15.9 1.6 5.4 6.3 8.7 12.7 8.7 20.8.1 41.3.1 61.7.1zm-15.4 25.5h-29.8c-6 0-12.1-.2-18.1.1-7.4.4-12.5 7.4-10.9 14.6 1.3 6.3 6.2 9.9 13.6 9.9h91.3c5.7-.1 10-2.4 12.2-7.8 3.4-8.3-2.6-16.7-12-16.8-15.5-.1-30.9 0-46.3 0z"/></svg>',
"helpSVG": '<svg xmlns="http://www.w3.org/2000/svg" xml:space="preserve" version="1.1" viewBox="0 0 300 300"><path d="M125.9 212.1c-.2 6.2-2.3 12.4-7.3 17.4-17.4 17.5-34.7 35.1-52.2 52.4-9.8 9.7-23.9 10.6-34.6 2-5.8-4.6-11.2-9.9-15.9-15.7-8.8-10.8-6.9-26 3.8-36.6l41.1-40.8c2.2-2.2 4.4-4.5 6.5-6.7 12.2-12.9 29.1-13.3 41.7-.8 3.2 3.1 6.4 6.3 9.4 9.5 4.9 5 7.5 11.3 7.5 19.3zm84.9-86.2c-6.4-.1-12.3-2.2-17.3-6.8-3.8-3.6-7.5-7.3-11.2-11-11.2-11.4-11.2-27.6 0-38.9 13.4-13.6 27-27 40.5-40.5 2.8-2.8 5.5-5.6 8.2-8.4 11-11.6 28.9-14.5 41.6-.7 2.7 2.9 5.7 5.7 8.5 8.5 11.4 11.6 11.5 27.6.1 39.1-12.4 12.5-24.9 25-37.4 37.4-4.4 4.4-8.8 8.9-13.3 13.2-5.4 5.4-11.8 8.1-19.7 8.1zm-84.9-36.5c.2 6.4-2.5 11.7-6.5 16.4-3.6 4.2-7.5 8.2-11.6 12.1-11.6 11.1-27.5 10.9-38.9-.4-15-14.9-29.8-29.8-44.8-44.7-2.1-2.1-4.3-4.2-6.4-6.4-10-10.8-10-26.5.1-37.2 3.2-3.3 6.4-6.5 9.7-9.7 12.1-12 28-12.1 40.1-.1C82.7 34.1 97.6 49 112.4 64c3.4 3.4 7 6.7 9.3 10.8 2.5 4.3 3.5 9.5 5.1 14.2-.2.1-.5.3-.9.4zm163.6 163.2c0 6.4-2 12.1-6.3 16.8-4.4 4.8-8.9 9.4-13.7 13.7-10.4 9.3-26.3 8.4-36.6-1.8-11.9-11.8-23.7-23.6-35.5-35.5-5.4-5.4-10.7-10.8-15.9-16.2-9.4-9.8-10.1-24.8-1.4-35 4.5-5.2 9.4-10.2 14.7-14.6 10.5-8.9 25.8-7.8 36.1 2.4 14.4 14.2 28.6 28.5 42.9 42.8 2 2 4 3.9 6 5.8 6 5.9 9.6 12.9 9.7 21.6zM17.6 79.9c1.8 2.3 3.3 4.4 5 6.2 13.1 13.2 26.4 26.3 39.6 39.5 1 1 2 2.2 3.3 2.8 4.5 2.3 4.9 5.8 4 10.4-1.6 8.6-1.2 17.3.5 25.9.4 2.1.2 3.4-1.8 4.7-2.8 1.8-5.3 4.1-7.7 6.4-13.6 13.5-27.2 27.1-40.7 40.7-.9.9-1.4 2-2.2 3.3-23-40.5-23.9-97.1 0-139.9zM81.1 283c7-7.2 14-14.1 20.7-21.2 9.9-10.3 19.6-20.7 29.5-31 .7-.7 2.1-1.1 3.1-.9 10.4 1.9 20.8 1.9 31.3 0 .9-.2 2.3.2 2.9.8 6.5 6.9 12.7 14 19.3 20.8 9.4 9.7 19.1 19.1 28.7 28.6.9.9 1.7 1.8 2.5 2.7-38.3 21.8-94.9 24-138 .2zM220 17.7c-2.5 2.1-4.9 3.7-6.9 5.7-13 13-26 26-38.9 39.1-1.8 1.8-3.5 3.8-4.9 5.9-1.2 1.9-2.5 2-4.5 1.6-10-1.9-20-1.9-29.9 0-2.1.4-3-.2-4.4-1.8-4.5-5.3-9.1-10.4-14-15.3-11-11.1-22.1-22.1-33.1-33.1-.9-.9-1.7-1.8-2.5-2.7C119.8-5 176.5-6.6 220 17.7zm62.8 63.1c23.5 42.1 22.5 98.6-.1 138.3-4.7-4.7-9.3-9.4-14-14-10.5-10.5-21.1-20.9-31.6-31.3-1-1-2-2.3-3.2-2.9-4.1-1.9-4.4-4.7-3.7-8.8 1.7-9.2 1.3-18.4-.4-27.6-.2-1 .2-2.5.9-3.1 11.7-11.3 23.5-22.5 35.2-33.8 5.7-5.5 11.3-11.2 16.9-16.8z"/></svg>',
"librariesSVG": '<svg xmlns="http://www.w3.org/2000/svg" xml:space="preserve" version="1.1" viewBox="0 0 300 300"><path d="M64.1 150.2v126.1c0 14.9-8.7 23.6-23.6 23.6H22.8C9 299.9 0 291 0 277.1V30.5c0-4.6-.2-9.2.6-13.7C2.4 7.2 10.9.3 20.8.1c7-.1 14-.1 21 0 13.1 0 22.3 9.2 22.3 22.3v127.8zm21.3-.4V23.7C85.4 8.9 94.1.1 108.8.1h18.7c12.7.1 22 9.2 22 21.9v256.3c0 12.5-9.3 21.6-21.8 21.7-6.8.1-13.6.1-20.4 0-12.7-.1-21.8-9.3-21.9-22V149.8zM300 271.2c-.2 9.4-6.1 17.8-15.1 20.5-7.3 2.2-14.7 4.3-22.2 6-11.7 2.8-22.5-4-25.7-16-7.4-27.7-14.8-55.5-22.2-83.3-14.5-54.2-29-108.4-43.4-162.6-3.6-13.6 2.6-24.6 16.1-28.3 6.1-1.7 12.2-3.3 18.3-4.9 12.8-3.3 23.8 3 27.2 15.8 7.3 27.2 14.6 54.4 21.8 81.6 14.6 54.8 29.2 109.5 43.8 164.3.6 2.3.9 4.6 1.4 6.9z"/></svg>',
"moderator_actionsSVG": '<svg xmlns="http://www.w3.org/2000/svg" xml:space="preserve" version="1.1" viewBox="0 0 300 300"><path d="M.3 167.5h78.4c6.7 0 11.3-3.7 11.8-9.3.6-6.3-3.7-11.3-10.1-11.6-2.3-.1-4.6 0-6.9 0H3.9c.3-1.1.4-2 .7-2.7 6.3-16.9 16.4-30.4 33.9-36.7 4.7-1.7 10-2.3 15-2.4 14.6-.3 29.2-.1 44.3-.1-.4-1.2-.7-2.1-1.1-2.9-2.2-4.5-4.6-8.9-6.7-13.5-5.9-12.5 2-25.4 15.8-25.6 10.8-.1 21.6 0 32.4 0 7.6 0 13 3.6 16.4 10.4 4.8 9.6 9.6 19.1 14.3 28.7 1 2.2 2.2 3 4.7 3 12-.1 24-.1 36.8-.1-20.9 18.9-29.2 42.4-29 69.9h-44.1c-6.6 0-11.1 3.9-11.5 9.6-.4 6.6 4.1 11.3 11 11.3 14.8.1 29.6.1 44.5 0 2.4 0 3.5.6 4.3 3.1 4.3 14.4 11.8 26.9 23 37.1.4.4.8.8 1.1 1.2 0 0 0 .2-.1.7h-3.7c-49.8 0-99.6-.3-149.4.1-19.1.1-33.1-8-43.6-23.1C3.4 200.8-.4 185.5 0 169.1c0-.4.2-.8.3-1.6z"/><path d="M195.2 170.9c.4-18.2 5.2-34.8 17.1-48.8 19.6-23.1 49.9-23.4 69.9-.7 23.9 27 23.6 73.5-.7 99.9-10 10.9-22.2 17.1-37.4 15.9-13.1-1.1-23.5-7.6-31.8-17.4-12-14.1-16.7-30.8-17.1-48.9z"/></svg>',
// "otherSVG": '<svg xmlns="http://www.w3.org/2000/svg" xml:space="preserve" version="1.1" viewBox="0 0 300 300"><path d="M135 92.2c0 9 .1 18 0 27-.1 9.2-6 15.7-14.9 15.8-19.8.1-39.6.6-59.3-.5C31.4 132.9 5.3 108 1 78.7-4.7 39.9 20.5 6.1 59.5.6c34.3-4.8 68.9 20.4 74.2 54.9 1.8 12.1 1.4 24.5 2 36.7h-.7zm72.9 42.9h-26.3c-10.5 0-16.6-6.2-16.6-16.6.1-19.2-.5-38.4.6-57.5 1.7-29.5 26.5-55.5 55.7-59.9 38.9-5.8 73.1 19.9 78.2 58.8 4.8 36.8-23.7 72.1-60.7 74.7-10.2.7-20.6.1-30.9.1v.4zm-43 74.7v-28.1c0-10.5 6.1-16.7 16.6-16.7 19.2.1 38.4-.5 57.6.6 29.6 1.7 55.2 26.1 59.8 55.4 5.8 36.6-16.9 69.7-53 77.5-38.6 8.4-77.4-20.2-80.4-59.6-.7-9.7-.1-19.4-.1-29.1h-.5zM90.3 165h28.1c10.5 0 16.7 6.1 16.6 16.6-.1 19.2.5 38.4-.6 57.6-1.7 29.5-26.2 55.2-55.4 59.8-36.6 5.7-69.7-17-77.5-53.1-8.3-38.6 20.2-77.3 59.7-80.4 9.7-.7 19.4-.1 29.1-.1v-.4z"/></svg>',
"scriptsSVG": '<svg xmlns="http://www.w3.org/2000/svg" xml:space="preserve" version="1.1" viewBox="0 0 300 300"><path d="M1 150.1c0-11.2 1.1-22.2 4-33.1 1.6-6.1 6.3-9.8 12.8-9.4 17.3.9 31.5-9.8 34.6-25.5 1.7-8.7-.4-16.8-5-24.4-1.1-1.8-2.1-3.9-2.6-6-.8-3.2.2-6 2.6-8.4C63.9 26.8 83.4 15 106 8.4c6.6-1.9 10.5-.3 13.6 5.8 4.1 8.4 10.4 14.5 19.3 17.5 15.4 5.2 31.9-1.4 39.5-15.8 4.2-8 8-9.6 16.7-6.9 21.4 6.7 40.2 18 56.5 33.3 3.7 3.5 4 8.6.5 13.5-4.6 6.5-6.5 13.6-6 21.5.9 17.5 16.8 31.2 34.2 29.5 7.3-.7 11.7 2.4 13.7 9.5 3.7 13 7.1 26.1 5.8 39.7-.9 9.3-2.3 18.6-4.1 27.8-1.2 6.2-5.4 8.9-11.8 8.7-16.7-.6-30.7 8.6-34.6 23-2.6 9.4-.9 18.1 4.2 26.3 4.8 7.8 4.4 11.4-2.5 17.5-16.4 14.5-34.7 25.6-55.8 32.1-7.2 2.2-11.9.2-15.4-6.4-6.3-11.9-16.2-18.3-29.6-18.2-13.3.1-23 6.7-29.1 18.5-3.3 6.4-7.9 8.4-14.8 6.3-22.5-6.9-41.9-18.9-59.1-34.8-3.7-3.4-3.9-8.6-.5-13.5 4.6-6.5 6.4-13.7 6-21.5-.9-17.4-16.9-31.2-34.2-29.4-8.7.9-12.2-1.2-13.8-9.8-2-10.7-3.2-21.5-4.7-32.3.3-.1.6-.1 1-.2zm218.3-.1c-1.1 1.1-1.9 2-2.7 2.9-7.2 7.3-14.6 14.4-21.7 21.8-4.3 4.5-4.1 10.5.2 14.8 4.2 4.1 10.1 4.3 14.5 0 10.8-10.6 21.5-21.3 32.1-32.1 4.3-4.4 4.3-10.2 0-14.5-10.6-10.8-21.3-21.5-32.1-32.1-4.4-4.3-10.6-4.1-14.8.2-4.1 4.2-4.2 10.1 0 14.6 3 3.2 6.2 6.3 9.3 9.4 5.1 4.9 10.1 9.9 15.2 15zm-139.8.2c.9-.9 1.4-1.5 1.9-2 7.5-7.5 15.1-14.9 22.4-22.5 4.3-4.5 4.1-10.6-.1-14.8-4.2-4.1-10.2-4.3-14.6-.1-10.8 10.6-21.5 21.3-32.1 32.1-4.2 4.3-4.4 10.1-.3 14.3 10.8 11 21.7 22 32.8 32.7 4 3.9 9.7 3.6 13.8-.1 4.2-3.9 4.8-9.5 1.4-14-1-1.3-2.2-2.4-3.4-3.6-7.1-7.4-14.4-14.6-21.8-22zm48.4 52.9c4.9 0 8-2.7 10-6.8l41.7-83.4c2.7-5.5.7-11.5-4.6-14-5.4-2.6-10.3-.6-13.3 5.3-14 27.9-27.9 55.8-41.9 83.7-.4.9-.9 1.8-1.2 2.7-1.9 6.1 2.8 12.5 9.3 12.5z"/></svg>',
"searchSVG": '<svg xmlns="http://www.w3.org/2000/svg" xml:space="preserve" version="1.1" viewBox="0 0 300 300"><path d="M291 250.7c-18.7-18.7-37.3-37.4-56.1-56-1.8-1.7-1.8-2.8-.6-4.9 11.7-19.7 17.3-41.1 18.1-64-1.1-8.5-1.7-17.2-3.4-25.7C234.7 28.5 159.5-16.6 89.8 5.6c-48.5 15.5-78.3 49-87.6 99.1C-4.7 142 4.6 176 28.7 205.3 68.4 254 136 265.8 190.3 234.1c1.8-1.1 2.9-1.1 4.4.5 13 13.1 26 26.2 39.1 39.2 6.4 6.4 12.6 13 19.3 19 12.4 11.2 31.7 8.9 41.5-4.6 8.4-11.5 7-26.8-3.6-37.5zm-165-47.2c-42.8 0-77.5-34.7-77.5-77.5S83.2 48.5 126 48.5s77.5 34.7 77.5 77.5-34.7 77.5-77.5 77.5z"/></svg>',
"usersSVG": '<svg xmlns="http://www.w3.org/2000/svg" xml:space="preserve" version="1.1" viewBox="0 0 300 300"><path d="M150.2 285H79.9c-12.2 0-19.4-4.6-23.8-15.9-1.7-4.4-3-9.2-3.3-13.9-1-15-1.2-30 6.3-43.9 8.4-15.7 21.1-26 38.5-30.4 7.2-1.8 14.2-.8 20.8 2.6 21.1 11.1 42.1 11.2 63.2.1 8.3-4.3 16.8-4.5 25.5-1.6 24.4 8.3 40.1 30.1 40.6 56.6.2 8.8.7 17.6-2 26.1s-6.7 16.1-16.1 18.9c-2.9.8-6 1.2-9 1.2-23.5.2-46.9.2-70.4.2zm-.1-120c-37.5-.2-67.6-30.3-67.5-67.4.1-37.6 30.6-67.7 68.2-67.5 37 .2 67 30.8 66.8 68.2-.2 36.8-30.6 66.9-67.5 66.7zm-64.5-4.3c-30 11.4-48.2 32.8-54.5 64.2-4.1 0-7.9.3-11.8-.1-7.4-.6-12.9-4.4-15.6-11.3C2 209 .5 204.1.3 199.3c-.6-10.6-1-21.3 3.5-31.5 6.3-14.4 16.9-23.9 32-28.3 6.3-1.8 12.3-.8 18.5 1.7 6.3 2.6 13 4.3 19.5 6.5.8.3 2 .4 2.5 1 3.1 4 6.1 7.9 9.3 12zm129 0c3.3-4.1 6.3-8.1 9.5-12 .5-.6 1.6-.7 2.5-.9 6.4-2.1 13-3.7 19.2-6.3 6.6-2.8 12.9-3.6 19.8-1.5 20 6.1 33.9 23.8 34.4 44.7.2 7.7.2 15.6-1.4 23-2.8 12.8-9.6 17.4-22.6 17.4h-6.8c-6.5-31.4-24.5-52.9-54.6-64.4zm-18-140.6c19.8-8 38.8-6.9 55.9 5.8 19.3 14.4 26.6 34.2 21.2 57.6-4.5 19.9-17.5 32.9-37 40 9.9-43.6-3.5-77.8-40.1-103.4zM63.5 123.6c-19.5-7.1-32.1-20.2-37-40-5.5-22.1 3-44.9 21.5-57.9 17.4-12.2 36-13.5 55.7-5.5C67 45.7 53.6 79.9 63.5 123.6z"/></svg>',
"homeSVG": '<svg xmlns="http://www.w3.org/2000/svg" xml:space="preserve" version="1.1" viewBox="0 0 300 300"><path d="M171.7 209.3h-43.4v72.6c0 7.3-3.2 10.6-10.5 10.6H47.2c-7.1 0-10.3-3.3-10.3-10.4v-121c-1.2-.1-2.2-.2-3.2-.2h-17c-7.8-.1-13.2-3.6-15.6-10-2.4-6.4-.8-12.4 5-17.6C50.3 93 94.5 52.6 138.8 12.4c7.2-6.6 15.3-6.6 22.6 0 44.3 40.3 88.5 80.6 132.8 120.9 4.6 4.2 6.9 9.2 5.5 15.4-1.3 5.8-4.8 9.8-10.6 11.4-2.1.6-4.4.7-6.7.8-6.3.1-12.6 0-19.3 0v120.6c0 7.9-3.1 11-11 11h-69.4c-8 0-11-3-11-11.2v-72zM269.6 87c-22.8-20.7-45.1-41-67.8-61.6 1.6-.1 2.6-.2 3.5-.2h53.6c7.5 0 10.7 3.2 10.7 10.6V87z"/></svg>'
};
// Function for inserting new elements in the DOM.
function elemake(tag, innr, attr) {
let element = document.createElement(tag);
if (innr) {element.innerHTML = innr;}
if (!attr) {return element;}
for (let x = 0; x < attr.key.length; x++) {
element.setAttribute(attr.key[x], attr.val[x]);
}
return element;
}
// Get variables from URL
function getVar(link) {
let vars = {};
link.replace(/[?&]+([^=&]+)=([^&]*)/gi, function(m,key,value) {
vars[key] = value;
});
return vars;
}
// Light Theme Colors
const lightCSS = `
html, html[data-accent=default] {
--engine-accent-color: #b42121;
}
html, html[data-light=default] {
--engine-background-1: #f6f6f6;
--engine-background-2: #fbfbfb;
--engine-background-2a: #e0e0e0;
--engine-button-hover: #e8e8e8;
--engine-search-bg: #fbfbfb;
--engine-search-hover: #e8e8e8;
--engine-text-1: #222222;
--engine-text-2: #666666;
--engine-text-2a: #444444;
--engine-border-color: #e0e0e0;
--engine-nav-bg-2: #f0f0f0;
--engine-nav-bg-1: #f8f8f8;
--engine-logo-bg: var(--engine-text-color);
--engine-logo-fg: var(--engine-background-1);
}
`.replace(/[\n\s]/g,'');
// Dark Theme Colors
const darkCSS = `
html, html[data-accent=default] {
--engine-accent-color: #c42121;
}
html, html[data-dark=default] {
--engine-background-1: #161616;
--engine-background-2: #1c1c1c;
--engine-background-2a: #0e0e0e;
--engine-button-hover: #262626;
--engine-search-bg: #262626;
--engine-search-hover: #2e2e2e;
--engine-text-1: #eeeeee;
--engine-text-2: #aaaaaa;
--engine-text-2a: #cccccc;
--engine-border-color: #2c2c2c;
--engine-nav-bg-1: #161616;
--engine-nav-bg-2: #212121;
--engine-logo-bg: var(--engine-background-1);
--engine-logo-fg: var(--engine-text-color);
}
`.replace(/[\n\s]/g,'');
// General Redesign Excluding Colors
const globalCSS = `
:root {
--header-min-height: 10.1rem;
--header-main-height: 8.6rem;
--engine-border-radius: 4px;
--header-search-width: 70rem;
--body-margin-xl2: calc(9.6rem + 3.2rem + 3.2rem);
--main-nav-width: 40rem;
--safe-transition: .1s;
--font-sans: "Open Sans", sans-serif;
--font-mono: "Fira Mono", monospace;
}
html {
font-size: 10px;
}
html.no-delay {
--safe-transition: 0s;
}
html, html > body {
height: 100%;
width: 100%;
line-height: 1.5;
-webkit-text-size-adjust: 100%;
-moz-tab-size: 4;
-o-tab-size: 4;
tab-size: 4;
color: var(--engine-text-1);
fill: var(--engine-text-1);
}
html > body {
display: flex;
flex-direction: column;
background-color: var(--engine-background-2);
font-size: 1.6rem;
}
html > body:has(#main-nav:not(.hidden)) {
overflow: hidden;
}
*, *::before, *::after {
-webkit-tap-highlight-color: transparent;
box-sizing: border-box;
}
a, a:visited, a:active {
text-decoration: none;
color: var(--engine-text-1);
fill: var(--engine-text-1);
}
svg {
overflow: visible;
}
svg .logo-bg {
fill: var(--engine-logo-bg);
}
svg .logo-ring, svg .logo-fg {
fill: var(--engine-logo-fg);
}
.script-list li:not(.ad-entry) {
padding: 0;
}
#main-header {
background: var(--engine-background-1);
color: var(--engine-text-1);
box-shadow: initial;
padding: 0 3.2rem;
min-height: -moz-fit-content;
min-height: fit-content;
}
#main-header > .width-constraint {
height: calc(var(--header-main-height) - 3.2rem);
margin: 2.4rem auto 0 auto;
padding: 0;
display: flex;
align-items: center;
justify-content: space-between;
}
#main-header > .width-constraint:last-child {
margin-bottom: 1.6rem;
}
#main-header > .search-options {
font-size: 1.5rem;
margin-top: 0.7rem;
display: flex;
gap: 1.3rem;
transform: translateY(1px);
padding-left: 14.1rem;
color: var(--engine-text-2);
}
#main-header > .search-options a {
display: flex;
height: 2.75rem;
font-weight: 700;
transition-duration: 0.1s;
}
#main-header > .search-options a:hover, #main-header > .search-options a:focus {
color: var(--engine-text-2a);
}
#main-header > .search-options a.active {
color: var(--engine-accent-color);
border-bottom: 2px solid var(--engine-accent-color);
}
#main-header a, #main-header a:visited, #main-header a:active {
color: inherit;
fill: inherit;
}
#main-header a.greasy-svg, #main-header a.sleazy-svg {
height: 4.8rem;
width: 9.6rem;
min-width: 4.8rem;
display: flex;
align-items: center;
justify-content: flex-end;
margin-right: 3.2rem;
}
#main-header a.greasy-svg svg, #main-header a.sleazy-svg svg {
height: 100%;
width: auto;
}
#main-header form.engine-search-main {
--_height: 5.2rem;
width: var(--header-search-width);
max-width: calc(100% - 4rem);
}
#main-header span.dummy {
display: block;
width: 0;
flex: 1 0 auto;
opacity: 0;
margin-right: 3.2rem;
}
#main-header span.menu, #main-header a.profile, #main-header a.signout, #main-header a.notification {
display: flex;
align-items: center;
justify-content: center;
height: 4rem;
width: 4rem;
min-width: 4rem;
font-size: 2rem;
border-radius: var(--engine-border-radius);
cursor: pointer;
}
#main-header span.menu svg, #main-header a.profile svg, #main-header a.signout svg, #main-header a.notification svg {
height: 1em;
width: 1em;
}
#main-header span.menu:hover, #main-header span.menu:focus, #main-header a.profile:hover, #main-header a.profile:focus, #main-header a.signout:hover, #main-header a.signout:focus, #main-header a.notification:hover, #main-header a.notification:focus {
fill: var(--engine-accent-color);
color: var(--engine-accent-color);
background: var(--engine-button-hover);
}
#main-header span.menu:active svg, #main-header a.profile:active svg, #main-header a.signout:active svg, #main-header a.notification:active svg {
transform: scale(0.8);
}
#main-header a.profile {
min-width: -moz-fit-content;
min-width: fit-content;
padding: 0 1rem;
border: 1px solid var(--engine-border-color);
border-radius: var(--engine-border-radius);
}
#main-header a.profile tie {
display: flex;
align-items: center;
justify-content: center;
gap: 1rem;
}
#main-header a.profile span {
font-size: 1.4rem;
}
#main-header a.profile span:active {
transform: scale(0.9);
}
#main-header a.profile:has(+ a.signout) {
border-right: 0px;
border-radius: var(--engine-border-radius) 0 0 var(--engine-border-radius);
}
#main-header a.profile:has(+ a.signout):hover + a.signout::before, #main-header a.profile:has(+ a.signout):focus + a.signout::before {
background: transparent;
}
#main-header a.profile:has(+ span.menu) {
margin-right: 1rem;
}
#main-header a.signout {
margin: 0 1rem 0 1px;
border: 1px solid var(--engine-border-color);
border-left: 0px;
border-radius: 0 var(--engine-border-radius) var(--engine-border-radius) 0;
position: relative;
}
#main-header a.signout::before {
content: "";
position: absolute;
height: 65%;
width: 1px;
background: var(--engine-border-color);
left: -1px;
}
#main-header a.signout::after {
content: "";
position: absolute;
height: calc(100% + 2px);
width: 3px;
border: 1px solid var(--engine-border-color);
border-left: 0;
border-right: 0;
left: -2px;
}
#main-header a.signout:hover::before, #main-header a.signout:focus::before {
background: transparent;
}
#main-header a.notification {
margin-right: 1rem;
border: 1px solid var(--engine-border-color);
border-radius: var(--engine-border-radius);
}
#main-header a.notification:hover::before, #main-header a.notification:focus::before {
background: transparent;
}
#main-header a.notification span {
font-size: 1.4rem;
}
#main-header a.notification:active span {
transform: scale(0.8);
}
.script-list,
.user-list,
.text-content,
.discussion-list,
.list-option-group ul,
#script-info {
border-color: transparent;
box-shadow: initial;
background: var(--engine-background-1);
}
.width-constraint {
width: 100%;
max-width: unset;
}
@media screen and (max-width: 1228px) {
.width-constraint {
margin: 0 auto;
}
}
html:not([data-home=true]) body > .width-constraint {
margin: 0 auto;
width: calc(100% - var(--body-margin-xl2) * 2);
}
html:not([data-home=true]) body > .width-constraint .sidebarred > .sidebarred-main-content {
max-width: var(--header-search-width);
}
body > .width-constraint {
flex-grow: 1;
}
body > .width-constraint .all-center-home {
height: 100%;
width: 100%;
padding: 1.6rem 1.6rem 12.8rem 1.6rem;
margin: 0;
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
gap: 1.6rem;
border-radius: 0;
--_height: 5.6rem;
}
body > .width-constraint .all-center-home .engine-welcome {
margin: 0.5rem 0 2rem 0;
font-size: 1.5rem;
}
body > .width-constraint .all-center-home a.greasy-svg, body > .width-constraint .all-center-home a.sleazy-svg {
height: auto;
width: 24.5rem;
min-width: 24.5rem;
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
margin-bottom: 2.5rem;
gap: 1.6rem;
}
body > .width-constraint .all-center-home a.greasy-svg svg[viewBox="0 0 92 92"], body > .width-constraint .all-center-home a.sleazy-svg svg[viewBox="0 0 92 92"] {
width: calc(100% - 10.8rem);
margin: 0 auto;
border-radius: 100%;
}
.engine-search-main {
display: flex;
width: 100%;
height: var(--_height);
max-width: calc(var(--_height) * 13.35714286);
background: var(--engine-search-bg);
border-radius: var(--engine-border-radius);
overflow: hidden;
box-shadow: 0 3px 0 0 var(--engine-background-2a);
}
.engine-search-main .engine-search-input {
flex-grow: 1;
background: transparent;
border: 0;
outline: 0;
font-size: 1.7rem;
padding: 1.3rem 0 1.3rem 1.3rem;
color: var(--engine-text-1);
fill: var(--engine-text-1);
}
.engine-search-main .engine-search-clear,
.engine-search-main .engine-search-submit {
height: var(--_height);
width: calc(var(--_height) * 1.2);
background: transparent;
border: 0;
outline: 0;
display: flex;
align-items: center;
justify-content: center;
cursor: pointer;
transition: fill 0.1s ease-in-out, background 0.1s ease-in-out;
}
.engine-search-main .engine-search-clear:hover, .engine-search-main .engine-search-clear:focus,
.engine-search-main .engine-search-submit:hover,
.engine-search-main .engine-search-submit:focus {
fill: var(--engine-accent-color);
}
.engine-search-main .engine-search-clear {
display: none;
}
.engine-search-main .engine-search-clear svg {
height: calc(var(--_height) / 3.5);
width: calc(var(--_height) / 3.5);
}
.engine-search-main .engine-search-submit svg {
height: calc(var(--_height) / 3);
width: calc(var(--_height) / 3);
}
.engine-search-main .engine-search-submit:hover, .engine-search-main .engine-search-submit:focus {
background: var(--engine-search-hover);
}
.engine-search-main.active .engine-search-submit {
background: var(--engine-search-hover);
}
.engine-search-main.active .engine-search-clear {
display: flex;
}
.engine-search-main > *:active > svg {
transform: scale(0.8);
}
#engine-top-sites {
font-size: 1.4rem;
display: flex;
align-items: center;
justify-content: center;
gap: 0.8rem;
flex-wrap: wrap;
width: 100%;
max-width: calc(var(--_height) * 13.35714286);
}
#engine-top-sites a {
border: 1px solid var(--engine-border-color);
border-radius: var(--engine-border-radius);
padding: 0.4rem 0.7rem;
color: var(--engine-text-1);
}
#engine-top-sites a:hover, #engine-top-sites a:focus {
color: var(--engine-accent-color);
background: var(--engine-button-hover);
}
#main-footer {
font-size: 1.44rem;
padding: 1.6rem 3.2rem;
background: var(--engine-background-1);
}
#main-footer .width-constraint {
display: flex;
align-items: center;
justify-content: space-between;
}
#main-footer .width-constraint > span:first-of-type {
display: flex;
gap: 0.4rem;
}
#main-footer a {
color: inherit;
}
#main-footer a:hover, #main-footer a:focus {
color: var(--engine-accent-color);
}
#main-nav {
--_button-height: 4.8rem;
--_button-height-top: 4rem;
z-index: 20;
transition: -webkit-backdrop-filter 0.1s linear;
transition: backdrop-filter 0.1s linear;
transition: backdrop-filter 0.1s linear, -webkit-backdrop-filter 0.1s linear;
}
#main-nav.hidden {
display: none;
}
#main-nav.visible {
-webkit-backdrop-filter: blur(2px);
backdrop-filter: blur(2px);
}
#main-nav.visible backdrop {
opacity: 0.25;
}
#main-nav.visible sidebar {
right: 0;
}
#main-nav:not(.visible) {
-webkit-backdrop-filter: blur(0);
backdrop-filter: blur(0);
}
#main-nav:not(.visible) backdrop {
opacity: 0;
}
#main-nav:not(.visible) sidebar {
right: calc(-1 * var(--main-nav-width));
}
#main-nav, #main-nav backdrop {
position: fixed;
top: 0;
right: 0;
height: 100%;
width: 100%;
}
#main-nav backdrop {
transition: opacity 0.1s linear;
background: var(--engine-background-2a);
z-index: 0;
}
#main-nav sidebar {
transition: right 0.1s ease-in-out;
position: fixed;
top: 0;
height: 100%;
width: var(--main-nav-width);
max-width: calc(100% - 4rem);
z-index: 1;
background: var(--engine-nav-bg-1);
box-shadow: rgba(60, 64, 67, 0.3) 0px 1px 2px 0px, rgba(60, 64, 67, 0.15) 0px 2px 6px 2px;
display: flex;
flex-direction: column;
}
#main-nav sidebar > top {
display: flex;
align-items: center;
justify-content: center;
gap: 1rem;
padding: 1.6rem 3.2rem;
height: var(--header-min-height);
}
#main-nav sidebar > top span.dummy {
display: block;
width: 0;
flex: 1 0 auto;
opacity: 0;
}
#main-nav sidebar > top span:not(.dummy) {
height: var(--_button-height-top);
width: var(--_button-height-top);
border-radius: var(--engine-border-radius);
background: var(--engine-nav-bg-2);
cursor: pointer;
display: flex;
align-items: center;
justify-content: center;
font-size: 2rem;
}
#main-nav sidebar > top span:not(.dummy) svg {
height: 1em;
width: 1em;
}
#main-nav sidebar > top span:not(.dummy) svg {
transition-duration: 0.1s;
}
#main-nav sidebar > top span:not(.dummy):hover, #main-nav sidebar > top span:not(.dummy):focus {
background: var(--engine-button-hover);
}
#main-nav sidebar > top span:not(.dummy):active:not(.active) {
fill: var(--engine-accent-color);
color: var(--engine-accent-color);
}
#main-nav sidebar > top span:not(.dummy):active:not(.active) svg {
transform: scale(0.8);
}
#main-nav sidebar > top span:not(.dummy).active {
fill: var(--engine-background-1);
color: var(--engine-background-1);
background: var(--engine-accent-color);
}
#main-nav sidebar > top span:not(.dummy).close-menu {
font-size: 1.4rem;
}
#main-nav sidebar > top span:not(.dummy).close-menu:active svg {
transform: scale(0.78);
}
#main-nav sidebar > bottom {
padding: 0 3.2rem 1.6rem 3.2rem;
}
#main-nav sidebar > bottom.colors, #main-nav sidebar > bottom.translate {
display: none;
}
#main-nav sidebar > bottom.pages {
display: flex;
flex-direction: column;
gap: 2rem;
}
#main-nav sidebar > bottom.pages .theme-switch {
display: flex;
gap: 1rem;
}
#main-nav sidebar > bottom.pages .theme-switch span {
height: var(--_button-height);
width: 0;
flex: 1 0 auto;
border-radius: var(--engine-border-radius);
background: var(--engine-nav-bg-2);
cursor: pointer;
font-size: 2rem;
display: flex;
align-items: center;
justify-content: center;
transition: flex 0.1s ease-in-out;
}
#main-nav sidebar > bottom.pages .theme-switch span svg {
height: 1em;
width: 1em;
}
#main-nav sidebar > bottom.pages .theme-switch span svg {
transition-duration: 0.1s;
}
#main-nav sidebar > bottom.pages .theme-switch span:hover, #main-nav sidebar > bottom.pages .theme-switch span:focus {
background: var(--engine-button-hover);
}
#main-nav sidebar > bottom.pages .theme-switch span:active:not(.active) {
fill: var(--engine-accent-color);
color: var(--engine-accent-color);
}
#main-nav sidebar > bottom.pages .theme-switch span:active:not(.active) svg {
transform: scale(0.8);
}
#main-nav sidebar > bottom.pages .theme-switch span.active {
flex: 2 0 auto;
fill: var(--engine-background-1);
color: var(--engine-background-1);
background: var(--engine-accent-color);
}
#main-nav sidebar > bottom.pages .og-pages {
display: flex;
flex-direction: column;
gap: 1rem;
}
#main-nav sidebar > bottom.pages .og-pages a {
height: var(--_button-height);
width: 100%;
display: flex;
align-items: center;
gap: calc(var(--_button-height) / 2);
padding: 0 calc(var(--_button-height) / 2);
background: var(--engine-nav-bg-2);
border-radius: var(--engine-border-radius);
}
#main-nav sidebar > bottom.pages .og-pages a svg {
height: 1em;
width: 1em;
}
#main-nav sidebar > bottom.pages .og-pages a, #main-nav sidebar > bottom.pages .og-pages a svg {
transition-duration: var(--safe-transition);
}
#main-nav sidebar > bottom.pages .og-pages a:hover, #main-nav sidebar > bottom.pages .og-pages a:focus {
background: var(--engine-button-hover);
}
#main-nav sidebar > bottom.pages .og-pages a:active:not(.active) {
transform: translateY(3px);
fill: var(--engine-accent-color);
color: var(--engine-accent-color);
}
#main-nav sidebar > bottom.pages .og-pages a.active {
fill: var(--engine-nav-bg-1);
color: var(--engine-nav-bg-1);
background: var(--engine-accent-color);
}
html.delay-not #main-nav sidebar > bottom.pages .og-pages a, html.delay-not #main-nav sidebar > bottom.pages .og-pages a svg {
transition-duration: 0s;
}
`;
// Remove Bruteforced Styles
function removeStyles() {
let styleTMP = document.querySelectorAll('head style[data-temp]');
for (let x = 0; x < styleTMP.length; x++) {
styleTMP[x].remove();
}
}
// Regular Styles
function themeStyles(temp) {
if (document.querySelector('#globalCSS')) {return;}
let themeChoice = localStorage.themeChoice || 'system',
mediaLight = '', mediaDark = '', typeLight, typeDark;
if (themeChoice === 'system') {
mediaDark = '(prefers-color-scheme: no-preference), (prefers-color-scheme: dark)';
mediaLight = '(prefers-color-scheme: light)';
typeDark = 'text/css';
typeLight = 'text/css';
} else if (themeChoice === 'light') {
typeDark = 'null';
typeLight = 'text/css';
} else if (themeChoice === 'dark') {
typeDark = 'text/css';
typeLight = 'null';
}
if (!temp) {
// document.head.appendChild(elemake("link","",{"key":["rel","href","type","id"],"val":["stylesheet","http://127.0.0.1:3407/global.css","text/css","globalCSS"]}));
document.head.appendChild(elemake("style",globalCSS,{"key":["type","id"],"val":["text/css","globalCSS"]}));
document.head.appendChild(elemake("style",darkCSS,{"key":["type","id","media"],"val":[typeDark,"darkCSS",mediaDark]}));
document.head.appendChild(elemake("style",lightCSS,{"key":["type","id","media"],"val":[typeLight,"lightCSS",mediaLight]}));
} else {
// document.head.appendChild(elemake("link","",{"key":["rel","href","type","data-temp"],"val":["stylesheet","http://127.0.0.1:3407/global.css","text/css","globalCSS"]}));
document.head.appendChild(elemake("style",globalCSS,{"key":["type","data-temp"],"val":["text/css","globalCSS"]}));
document.head.appendChild(elemake("style",darkCSS,{"key":["type","data-temp","media"],"val":[typeDark,"darkCSS",mediaDark]}));
document.head.appendChild(elemake("style",lightCSS,{"key":["type","data-temp","media"],"val":[typeLight,"lightCSS",mediaLight]}));
}
}
// Know Basics
function setBasic() {
if (window.location.origin.match(/sleazyfork/)) {
window.siteMatch = 'sleazy';
} else {
window.siteMatch = 'greasy';
}
window.currentLocale = document.documentElement.getAttribute('lang');
let cPath = window.location.pathname.replace(/\//g,'');
if (cPath === '' || cPath === window.currentLocale) {
window.onHomepage = true;
document.documentElement.setAttribute('data-home', 'true');
} else {
window.onHomepage = false;
document.documentElement.setAttribute('data-home', 'false');
}
}
// Process Theme
function processTheme() {
let themeLight = localStorage.themeLight || 'default',
themeDark = localStorage.themeDark || 'default',
themeAccent = localStorage.themeAccent || 'default',
html = document.documentElement;
html.setAttribute('data-accent',themeAccent);
html.setAttribute('data-light',themeLight);
html.setAttribute('data-dark',themeDark);
try {
let themeChoice = localStorage.themeChoice || 'system',
mediaLight = '', mediaDark = '', typeLight, typeDark,
lightStyle = document.querySelector('#lightCSS'),
darkStyle = document.querySelector('#darkCSS');
if (themeChoice === 'system') {
mediaDark = '(prefers-color-scheme: no-preference), (prefers-color-scheme: dark)';
mediaLight = '(prefers-color-scheme: light)';
typeDark = 'text/css';
typeLight = 'text/css';
} else if (themeChoice === 'light') {
typeDark = 'null';
typeLight = 'text/css';
} else if (themeChoice === 'dark') {
typeDark = 'text/css';
typeLight = 'null';
}
lightStyle.setAttribute('type',typeLight);
darkStyle.setAttribute('type',typeDark);
lightStyle.setAttribute('media',mediaLight);
darkStyle.setAttribute('media',mediaDark);
} catch(e) {}
}
// Click primary theme toggle
function toggleTheme(key) {
document.documentElement.classList.add('no-delay');
document.querySelector('#main-nav section.theme-switch > .active').classList.remove('active');
if (key === 'system') {
document.querySelector('#main-nav section.theme-switch > span.system').classList.add('active');
localStorage.themeChoice = 'system';
} else if (key === 'light') {
document.querySelector('#main-nav section.theme-switch > span.day').classList.add('active');
localStorage.themeChoice = 'light';
} else {
document.querySelector('#main-nav section.theme-switch > span.night').classList.add('active');
localStorage.themeChoice = 'dark';
}
processTheme();
setTimeout(() => {
document.documentElement.classList.remove('no-delay');
}, 10);
}
// Calculate loading time.
function loadTime() {
let loadTime = window.performance.timing.domContentLoadedEventEnd - window.performance.timing.navigationStart;
try {
document.querySelector('#main-footer .width-constraint > span:nth-of-type(2)').textContent = 'Loaded in ' + (loadTime/1000).toFixed(2) + ' secs';
} catch {}
}
// Add a simple footer on EVERY page
function addFOOTER() {
let footerName = 'Greasy Fork';
if (window.siteMatch === 'sleazy') {
footerName = 'Sleazy Fork';
}
let footer = `
<div class="width-constraint">
<span>
<a href="/">${footerName}</a>
<span>|</span>
<a href="https://www.gnu.org/licenses/gpl-3.0-standalone.html" target="_blank">GPL-3.0</a>
</span>
<span>•••</span>
</div>
`.replace(/>\s+</g,'><');
document.body.appendChild(elemake("footer",footer,{"key":["id"],"val":["main-footer"]}));
}
function forkNAV() {
let ogLinks = document.querySelectorAll('#site-nav > nav a:not([onclick])'),
linkPrint = '', linkActive;
if (window.location.origin + window.location.pathname === `${window.location.origin}/${window.currentLocale}` || window.location.origin + window.location.pathname === `${window.location.origin}/${window.currentLocale}/`) {
linkActive = ' class="active"';
} else {
linkActive = '';
}
linkPrint = `<a${linkActive} href="${window.location.origin}/${window.currentLocale}">${navSVGs["homeSVG"]}<span>Home</span></a>`;
for (let x = 0; x < ogLinks.length; x++) {
if (window.location.origin + window.location.pathname === ogLinks[x].href) {
linkActive = ' class="active"';
} else {
linkActive = '';
}
linkPrint += `<a${linkActive} href=${ogLinks[x].href}>${navSVGs[ogLinks[x].href.replace(/.*\/(.*)$/,'$1SVG')]}<span>${ogLinks[x].textContent}</span></a>`;
}
let newNAV = `
<sidebar>
<top>
<span class="pages active">
${pagesSVG}
</span>
<span class="translate">
${translateSVG}
</span>
<span class="colors">
${colorsSVG}
</span>
<span class="dummy"></span>
<span class="close-menu">
${closeSVG}
</span>
</top>
<bottom class="pages">
<section class="theme-switch">
<span class="system active">
${autoSVG}
</span>
<span class="day">
${sunSVG}
</span>
<span class="night">
${moonSVG}
</span>
</section>
<section class="og-pages">
${linkPrint}
</section>
</bottom>
<bottom class="translate">
<section class="help">
</section>
<section class="options">
</section>
</bottom>
<bottom class="colors">
<section class="accents">
</section>
<section class="others">
</section>
</bottom>
</sidebar>
<backdrop></backdrop>
`.replace(/>\s+</g,'><');
document.body.insertBefore(elemake("nav",newNAV,{"key":["id","class"],"val":["main-nav","hidden"]}), document.body.children[0]);
toggleTheme(localStorage.themeChoice);
}
// Header is different on HOMEPAGE
function forkHEADER() {
let headerDiv = document.querySelector('#main-header > .width-constraint'),
userProfileLink = '',
userProfileName = profileSVG,
signOutLink = '',
signInLink = '',
notificationLink = '';
if (headerDiv.querySelector('#nav-user-info > .user-profile-link')) {
userProfileLink = ` href="${headerDiv.querySelector('#nav-user-info > .user-profile-link > a').href}"`;
userProfileName = `<span>${headerDiv.querySelector('#nav-user-info > .user-profile-link > a').textContent}</span>`;
signOutLink = `<a class="signout" href="${headerDiv.querySelector('#nav-user-info > .sign-out-link > a').href}">${logoutSVG}</a>`;
} else {
signInLink = ` href="${headerDiv.querySelector('#nav-user-info > .sign-in-link > a').href}"`;
}
if (headerDiv.querySelector('#nav-user-info > .notification-widget')) {
notificationLink = `<a class="notification" href="${headerDiv.querySelector('#nav-user-info > .notification-widget').getAttribute('href')}"><span>${headerDiv.querySelector('#nav-user-info > .notification-widget').textContent}</span></a>`;
}
let headerHTML = `
<a class="${window.siteMatch}-svg" href="/">
${forkSVG}
</a>
<form class="engine-search-main" action="/${window.currentLocale}/scripts" accept-charset="UTF-8" method="get">
<input class="engine-search-input" name="q" value="" autocomplete="off" type="search" required>
<span class="engine-search-clear">${clearSVG}</span>
<span class="engine-search-submit">${findSVG}</span>
</form>
<span class="dummy"></span>
${notificationLink}
<a class="profile"${userProfileLink}${signInLink}>${userProfileName}</a>
${signOutLink}
<span class="menu">${menuSVG}</span>
`.replace(/>\s+</g,'><');
if (window.onHomepage) {
headerHTML = `
<span class="dummy"></span>
${notificationLink}
<a class="profile"${userProfileLink}${signInLink}>${userProfileName}</a>
${signOutLink}
<span class="menu">${menuSVG}</span>
`.replace(/>\s+</g,'><');
}
headerDiv.innerHTML = headerHTML;
if (!window.onHomepage) {
forkSEARCH();
let sInput = document.querySelector('.engine-search-input');
if (window.location.search.match(/q=/)) {
sInput.value = getVar(window.location.href).q.replace(/\+/g,' ');
} else if (window.location.search.match(/c=/)) {
sInput.value = getVar(window.location.href).c.replace(/\+/g,' ');
} else if (window.location.pathname.match(/\/by-site\//)) {
sInput.value = window.location.pathname.replace(/.*by-site\//,'');
}
function isActive(key) {
const reKey = new RegExp(key, "i");
if (!window.location.pathname.match(reKey)) {return '';}
return ' class="active"';
}
const searchOPTIONS = `
<a${isActive('scripts$')} href="/${window.currentLocale}/scripts?q=${sInput.value}">Scripts</a>
<a${isActive('scripts/by-site')} href="/${window.currentLocale}/scripts/by-site/${sInput.value}">Sites</a>
<a${isActive('scripts/libraries')} href="/${window.currentLocale}/scripts/libraries?q=${sInput.value}">Libraries</a>
<a${isActive('scripts/code-search')} href="/${window.currentLocale}/scripts/code-search?c=${sInput.value}">Code</a>
<a${isActive('users$')} href="/${window.currentLocale}/users?q=${sInput.value}">Users</a>
`;
headerDiv.parentNode.appendChild(elemake("div", searchOPTIONS, {"key":["class"],"val":["search-options"]}));
sInput.dispatchEvent(new Event('input', {'bubbles': true}));
}
}
// Update HOMEPAGE with new Search
function forkHOME() {
if (!document.getElementById('home-script-nav')) {return;}
let topSites = document.querySelectorAll('#home-top-sites a'),
siteTags = '';
for (let x = 0; x < topSites.length; x++) {
siteTags = siteTags + topSites[x].outerHTML;
}
let logoSVG = forkSVG + greasySVG;
if (window.siteMatch === 'sleazy') {
logoSVG = forkSVG + sleazySVG;
}
document.querySelector('body > div.width-constraint > section.text-content').innerHTML = `
<a class="${window.siteMatch}-svg" href="/">
${logoSVG}
</a>
<form class="engine-search-main" action="${document.querySelector('#home-script-nav .home-search').getAttribute('action')}" accept-charset="UTF-8" method="get">
<input class="engine-search-input" name="q" value="" autocomplete="off" type="search" required>
<span class="engine-search-clear">${clearSVG}</span>
<span class="engine-search-submit">${findSVG}</span>
</form>
<span class="engine-welcome">What are we forking today?</span>
<div id="engine-top-sites">${siteTags}</div>
`.replace(/>\s+</g,'><');
forkSEARCH();
}
// New search box
function forkSEARCH() {
let input = document.querySelector('.engine-search-input'),
clear = document.querySelector('.engine-search-clear'),
submit = document.querySelector('.engine-search-submit');
if (window.onHomepage) {
input.parentNode.parentNode.classList.add('all-center-home');
}
function checkInput() {
if (input.value === '') {
input.parentNode.classList.remove('active');
} else {
input.parentNode.classList.add('active');
}
}
input.addEventListener('input', checkInput);
clear.addEventListener('click', () => {
setTimeout(() => {
clear.parentNode.children[0].value = '';
checkInput();
clear.parentNode.children[0].focus();
}, 100);
});
submit.addEventListener('click', () => {
submit.parentNode.submit();
});
}
// Event listeners in one place
function listenEvents() {
// Close Sidebar
function closeNav() {
document.querySelector('#main-nav').classList.remove('visible');
setTimeout(() => {
document.querySelector('#main-nav').classList.add('hidden');
}, 100);
}
document.querySelector('#main-nav span.close-menu').addEventListener('click', closeNav);
document.querySelector('#main-nav backdrop').addEventListener('click', closeNav);
// Open Sidebar
function openNav() {
document.querySelector('#main-nav').classList.remove('hidden');
setTimeout(() => {
document.querySelector('#main-nav').classList.add('visible');
}, 10);
}
document.querySelector('#main-header span.menu').addEventListener('click', openNav);
document.querySelector('#main-nav section.theme-switch > span.system').addEventListener('click', () => {toggleTheme('system')});
document.querySelector('#main-nav section.theme-switch > span.day').addEventListener('click', () => {toggleTheme('light')});
document.querySelector('#main-nav section.theme-switch > span.night').addEventListener('click', () => {toggleTheme('dark')});
}
