---
interface Props {
  torUrl: string;
}

const { torUrl } = Astro.props;

const headerText = "This site is accessible via Tor!";
const maxLine = torUrl.length > headerText.length ? torUrl.length : headerText.length;

// Account for padding and borders: +2 for borders, +2 for padding spaces
const tableWidth = maxLine + 4;

const borderTop = "+" + "-".repeat(tableWidth) + "+";
const borderBottom = "+" + "-".repeat(tableWidth) + "+";
---

<div class="section tor-notice">
  <pre>
{borderTop}
|{" ".repeat(Math.floor((tableWidth - headerText.length) / 2))}{headerText}{" ".repeat(Math.ceil((tableWidth - headerText.length) / 2))}|
|{" ".repeat(Math.floor((tableWidth - torUrl.length) / 2))}<a href={torUrl}>{torUrl}</a>{" ".repeat(Math.ceil((tableWidth - torUrl.length) / 2))}|
{borderBottom}
  </pre>
</div>