<?xml version="1.0" encoding="utf-8"?>
<resources>

    <string name="webview_html_template" translatable="false"><![CDATA[
<!DOCTYPE html>
<html>
    <head>
        <meta charset=\"UTF-8\">
        <meta name=\"viewport\" content=\"width=device-width, initial-scale=1.0\">
        <style type=\"text/css\">

        /*
            %1$s: accent color
            %2$s: text color
            %3$s: background color
        */

        @font-face {
            font-family: Inter;
            font-style: normal;
            font-weight: normal;
            font-display: swap;
            src: url("fonts/Inter-Regular.woff2") format("woff2");
        }

        a:link, a:active, a:hover { color: %1$s }

        * {
            word-wrap: break-word !important;
            line-height: 1.4;
        }

        body, blockquote, img, iframe, video, div, table, tbody, tr, td, blockquote, p, em, b, span {
            max-width: 100%% !important;
        }

        body {
            margin-left: 3%%;
            margin-right: 3%%;
            color: %2$s;
            background-color: %3$s;
            font-family: Inter !important;
        }

        figure, img, iframe, video {
            margin: 0px;
            display: inline;
            height: auto;
            max-width: 100%%;
        }

        iframe {
            margin-top: 10px;
            margin-bottom: 10px;
        }

        h1, p, div {
            margin-top: 0px;
        }

        pre, code {
            color: #FFFFFF;
            background-color: #757575;
        }

        pre {
            padding: 6px;
            overflow: auto;
            border-radius: 4px;
        }

        code {
            padding: 2px;
            border-radius: 2px;
        }

        pre > code {
            padding: 0px;
            border-radius: 0px;
        }

        figcaption {
            font-style: italic;
            font-size: small;
            overflow: auto;
            text-align: center;
            padding-left: 3px;
            padding-right: 3px;
            padding-bottom: 10px;
        }

        blockquote {
            width:60%%;
            margin:30px auto;
            padding:0px 3em;
            border-left: 5px solid %1$s;
            line-height: 1.6;
            position: relative;
        }

        blockquote::before {
            content: \"\\201C\";
            color: %1$s;
            font-size: 4em;
            position: absolute;
            left: 10px;
            top: -10px;
        }

        blockquote::after{
            content: \'\';
        }
        </style>
    </head>

    <body>
      %4$s
    </body>
</html>]]></string>
</resources>