<html>
<head>
<link rel="stylesheet" href="/styles/fonts.css" />
<link rel="stylesheet" href="/styles/reset.css" />
<link rel="stylesheet" href="/styles/globals.css" />
<meta charset="UTF-8" />
<meta name="author" content="wanhose" />
<script src="/scripts/popup.js"></script>
</head>
<body>
<header class="header">
<h1 class="header-title">Cookie Dialog Monster</h1>
<div class="header-actions">
<button aria-label="Reload page" id="reload">
<svg
xmlns="http://www.w3.org/2000/svg"
width="24"
height="24"
viewBox="0 0 24 24"
fill="none"
stroke="currentColor"
stroke-width="2"
stroke-linecap="round"
stroke-linejoin="round"
>
<polyline points="23 4 23 10 17 10"></polyline>
<polyline points="1 20 1 14 7 14"></polyline>
<path
d="M3.51 9a9 9 0 0 1 14.85-3.36L23 10M1 14l4.64 4.36A9 9 0 0 0 20.49 15"
></path>
</svg>
</button>
</div>
</header>
<main>
<label class="switch-label">
<span>
<span data-i18n="toggleText"></span>
<strong id="host"></strong>
</span>
<div class="switch">
<input checked="checked" id="power" type="checkbox" />
<span class="slider"></span>
</div>
</label>
<div class="separator"></div>
<div>
<div class="rating">
<span data-i18n="reviewText"></span>
<div class="rating-actions">
<button aria-label="Unlike" id="unlike">
<svg
xmlns="http://www.w3.org/2000/svg"
width="24"
height="24"
viewBox="0 0 24 24"
fill="none"
stroke="currentColor"
stroke-width="2"
stroke-linecap="round"
stroke-linejoin="round"
>
<path
d="M10 15v4a3 3 0 0 0 3 3l4-9V2H5.72a2 2 0 0 0-2 1.7l-1.38 9a2 2 0 0 0 2 2.3zm7-13h2.67A2.31 2.31 0 0 1 22 4v7a2.31 2.31 0 0 1-2.33 2H17"
></path>
</svg>
</button>
<button aria-label="Like" id="like">
<svg
xmlns="http://www.w3.org/2000/svg"
width="24"
height="24"
viewBox="0 0 24 24"
fill="none"
stroke="currentColor"
stroke-width="2"
stroke-linecap="round"
stroke-linejoin="round"
>
<path
d="M14 9V5a3 3 0 0 0-3-3l-4 9v11h11.28a2 2 0 0 0 2-1.7l1.38-9a2 2 0 0 0-2-2.3zM7 22H4a2 2 0 0 1-2-2v-7a2 2 0 0 1 2-2h3"
></path>
</svg>
</button>
</div>
</div>
<p data-i18n="negativeText" hidden="true" id="negative"></p>
<p data-i18n="positiveText" hidden="true" id="positive"></p>
</div>
<div class="separator"></div>
<div class="help">
<span data-i18n="helpText"></span>
<a href="mailto:wanhose.development@gmail.com" target="_blank">
<svg
xmlns="http://www.w3.org/2000/svg"
width="24"
height="24"
viewBox="0 0 24 24"
fill="none"
stroke="currentColor"
stroke-width="2"
stroke-linecap="round"
stroke-linejoin="round"
>
<line x1="22" y1="2" x2="11" y2="13"></line>
<polygon points="22 2 15 22 11 13 2 9 22 2"></polygon>
</svg>
</a>
</div>
</main>
<footer>
<span data-i18n="footerText"></span>
<a href="https://github.com/wanhose" target="_blank">wanhose</a>
</footer>
</body>
</html>