software/hoardy-web/./extension/page/help.template

Passively capture, archive, and hoard your web browsing history, including the contents of the pages you visit, for later offline viewing, mirroring, and/or indexing. Your own personal private Wayback Machine that can also archive HTTP POST requests and responses, as well as most other HTTP-level data.

Files

Raw Source

Contents

<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1" />
    <title>Hoardy-Web: Help</title>
    <link rel="shortcut icon" type="$iconMIME$" href="../icon/$iconFile$">
    <link rel="stylesheet" href="main.css?v=$version$">
    <style>
@layer defaults {
:root {
    /* NB: when updating these two, also set `max-width` in
       ./popup.template and `minWidth` in ./help.js to their sum
    */
    --body: 900px;
    --popup: 455px;
    --padding: 10px;
    --popup-height: 2000px;
}

#body, #container, #iframe {
    box-sizing: border-box;
}

body {
    margin: 0 0;
    text-align: justify;
}

#body {
    font: 17px sans-serif;
    max-width: var(--body);
    min-width: var(--popup);
}

#iframe {
    border: 0px solid black;
    max-width: var(--popup);
    min-width: var(--popup);
}

body.linear {
    margin: 0 auto;
    max-width: var(--body);
}

.linear #body {
    padding: 0 var(--padding);
    width: 100%;
}

.linear #container {
    display: flex;
}

.linear #iframe {
    margin: 0 auto;
    min-height: var(--popup-height);
    min-width: var(--popup);
    width: 100%;
}

body.columns {
    display: flex;
}

.columns #body,
.columns #container {
    display: inline-block;
}

.columns #body {
    margin: 0 0 0 auto;
    overflow-y: scroll;
    padding: 0 calc(2 * var(--padding)) 0 0;
    width: 100%;
}

.columns #container {
    margin: 0 auto 0 0;
    max-width: var(--body);
    min-width: var(--popup);
}

.columns #iframe {
    overflow-y: scroll;
}

a.popup {
    border: 1px solid var(--outline-color);
    color: var(--a-local);
    padding: 2px;
    text-decoration: none;
    text-shadow: 0px 0px 2px var(--a-local);
}
}

@layer overrides {
.hidden {
    display: none;
}
}
    </style>
  </head>
  <body style="visibility: hidden">
    <div id="body">
      $body$
    </div>
    <div id="container">
    <iframe id="iframe" src="./popup.html#all" title="The Settings Popup."></iframe>
    </div>

    <script src="../lib/compat.js"></script>
    <script src="../lib/utils.js"></script>
    <script src="../lib/lutils.js"></script>
    <script src="help.js"></script>
  </body>
</html>