static - main - stuarus86/LawCheck

<!doctype html>

<head>

<title>Faviconer Icons Package – README</title>

<style>

body{font-size:1em;color:#333;font-family:'Helvetica Neue',Arial,Segoe UI,Roboto,Ubuntu,sans-serif;padding:1.5em;max-width:980px;margin:0 auto;line-height:1.45}

main{width: 100%;max-width: 740px;margin: 0 auto}

.logo{height: 2em;margin-bottom: 0.75em}

.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(10em,1fr));gap:1em;margin:.75em 0}

figure{margin:0;padding:.875em;border:1px solid #eee;border-radius:.5em}

figcaption{font-size:.875em;color:#555;margin-top:.375em}

pre{white-space:pre-wrap;border:1px solid #eee;padding:.75em;border-radius:.5em;background:#fafafa;color:#5A678E}

button{font-size:.875em;padding:.5em .75em;line-height:1.4;border:1px solid #ddd;border-radius:.5em;cursor:pointer;background:#fff}

p code{border: 1px solid #eee;padding: .125em .375em;border-radius: .25em;background: #fafafa;color:#005aca}

.ok{color:#0a0}

.bad{color:#FF0D0D}

a{color:#1070e7;}

pre i{color: #e00000;font-style:normal;}

pre b{color: #0F70E6;font-weight:normal;}

#previewWarning{white-space:pre-wrap;border:1px solid #ffdab3;padding:.75em;border-radius:.5em;background:rgba(255,250,245,.75);color:#be8348}

</style>

</head>

<body>

<main>

</a>

Place all files into the root of your website. The provided HTML snippet and <code>site.webmanifest</code> reference files at the root (e.g., <code>/favicon.png</code>).

<h2>Preview</h2>

<figure><img src="./favicon.png" alt="favicon" width="48" height="48"><figcaption>favicon.ico & favicon.png (48×48)</figcaption></figure>

<figure><img src="./favicon.svg" alt="favicon" width="72" height="72"><figcaption>favicon.svg (scalable)</figcaption></figure>

<figure><img src="./apple-touch-icon.png" alt="apple" width="90" height="90"><figcaption>apple-touch-icon.png (180×180)</figcaption></figure>

</div>

For full functionality, open this page in a web browser. Due to OS limitations, icons may not display outside the browser — on mobile devices, open them directly from the archive.

If you’ve set up a dark theme version of your SVG icon, viewing the dark or light variant depends on your device’s theme settings. To see how the icon looks in each mode, switch your device between light and dark themes as desired.

<h2>Insert into <head></h2>

<h2>If you use a different folder for icons</h2>

If you decide to use a dedicated folder for icons, move the files there and update the paths in <code>html_code.html</code>, <code>site.webmanifest</code> and in the HTML <code><head></code> snippet. Alternatively, set the path prefix in the generator.

Note: If some images are not displayed when viewing this file directly from the ZIP, try extracting the archive first and then open the file again.

<a href="https://faviconer.com" target="_blank">faviconer.com</a>

const firstImage = document.querySelector("img");

if (firstImage.complete && firstImage.naturalWidth > 0) {

removeWarning();

} else {

firstImage.addEventListener('load', removeWarning);

}

function removeWarning(){

const warningElem = document.querySelector("#previewWarning");

warningElem.style.display = "none";

}

async function copy(event) {

const button = event.target;

const el = document.querySelector('#code');

const text = el.textContent?.replace(/></g, '>\n<');

const oldText = button.innerText;

try {

if (navigator.clipboard && window.isSecureContext) {

await navigator.clipboard.writeText(text);

} else {

const ta = document.createElement('textarea');

ta.value = text;

document.body.appendChild(ta);

ta.select();

document.execCommand('copy');

ta.remove();

}

button.innerText = 'Copied ✓';

button.classList.add("ok");

} catch (e) {

button.innerText = 'Copy failed ✕';

button.classList.add("bad");

} finally {

button.disabled = true;

setTimeout(()=>{

button.innerText = oldText;

button.disabled = false;

button.classList.remove("ok");

button.classList.remove("bad");

}, 3500);

}

const copyButton = document.querySelector('#copy');

copyButton.style.removeProperty("display");

copyButton.addEventListener('click', copy);

</script>

</main>

</body>

</html>