mirror of https://github.com/jpanther/congo.git
274 lines
26 KiB
HTML
274 lines
26 KiB
HTML
<!doctype html><html lang=en-au dir=ltr class=scroll-smooth data-default-appearance=light data-auto-appearance=true><head>
|
|
<meta charset=utf-8>
|
|
<meta http-equiv=content-language content="en-au">
|
|
<meta name=viewport content="width=device-width,initial-scale=1">
|
|
<meta http-equiv=x-ua-compatible content="ie=edge">
|
|
<title>Hosting & Deployment · Congo</title>
|
|
<meta name=title content="Hosting & Deployment · Congo">
|
|
<meta name=description content="A powerful, lightweight theme for Hugo built with Tailwind CSS.">
|
|
<link rel=canonical href=https://jpanther.github.io/congo/docs/hosting-deployment/>
|
|
<link type=text/css rel=stylesheet href=/congo/css/main.bundle.min.8668fddbcbb932886633e4aa81083d40daba23f947de11d220d65a81de2f1d305d46f22ba639bfadba00f888260183fce15757d95b0f94ea337f3361f3ccf098.css integrity="sha512-hmj928u5MohmM+SqgQg9QNq6I/lH3hHSINZagd4vHTBdRvIrpjm/rboA+IgmAYP84VdX2VsPlOozfzNh88zwmA==">
|
|
<script defer type=text/javascript id=script-bundle src=/congo/js/main.bundle.min.ac8bae0637d2c85a05cf0fb654b22607333000c82c6c5222850c59bef9243e6ea1233806da173e50066dc88f4da82b08a9a64e27104c31d56d4d02a05a7efbae.js integrity="sha512-rIuuBjfSyFoFzw+2VLImBzMwAMgsbFIihQxZvvkkPm6hIzgG2hc+UAZtyI9NqCsIqaZOJxBMMdVtTQKgWn77rg==" data-copy=Copy data-copied=Copied></script>
|
|
<link rel=apple-touch-icon sizes=180x180 href=/congo/apple-touch-icon.png>
|
|
<link rel=icon type=image/png sizes=32x32 href=/congo/favicon-32x32.png>
|
|
<link rel=icon type=image/png sizes=16x16 href=/congo/favicon-16x16.png>
|
|
<link rel=manifest href=/congo/site.webmanifest>
|
|
<meta property="og:title" content="Hosting & Deployment">
|
|
<meta property="og:description" content="Learn how to deploy a Congo site.">
|
|
<meta property="og:type" content="article">
|
|
<meta property="og:url" content="https://jpanther.github.io/congo/docs/hosting-deployment/"><meta property="article:section" content="docs">
|
|
<meta property="article:published_time" content="2020-08-07T00:00:00+00:00">
|
|
<meta property="article:modified_time" content="2020-08-07T00:00:00+00:00"><meta property="og:site_name" content="Congo">
|
|
<meta name=twitter:card content="summary">
|
|
<meta name=twitter:title content="Hosting & Deployment">
|
|
<meta name=twitter:description content="Learn how to deploy a Congo site.">
|
|
<script type=application/ld+json>[{"@context":"https://schema.org","@type":"Article","articleSection":"Documentation","name":"Hosting \u0026 Deployment","headline":"Hosting \u0026 Deployment","description":"Learn how to deploy a Congo site.","abstract":"There are many ways to deploy your Hugo website built with Congo.","inLanguage":"en-au","url":"https:\/\/jpanther.github.io\/congo\/docs\/hosting-deployment\/","author":{"@type":"Person","name":"Congo"},"copyrightYear":"2020","dateCreated":"2020-08-07T00:00:00\u002b00:00","datePublished":"2020-08-07T00:00:00\u002b00:00","dateModified":"2020-08-07T00:00:00\u002b00:00","keywords":["hosting","deployment","docs","github","netlify","render"],"mainEntityOfPage":"true","wordCount":"619"}]</script>
|
|
<meta name=generator content="Hugo 0.92.1">
|
|
<meta name=author content="Congo">
|
|
<link href=https://twitter.com/ rel=me>
|
|
<link href=https://facebook.com/ rel=me>
|
|
<link href=https://linkedin.com/ rel=me>
|
|
<link href=https://youtube.com/ rel=me>
|
|
</head>
|
|
<body class="flex flex-col h-screen px-6 m-auto text-lg leading-7 bg-neutral text-neutral-900 sm:px-14 md:px-24 lg:px-32 dark:bg-neutral-800 dark:text-neutral max-w-7xl">
|
|
<div id=the-top class="absolute flex self-center">
|
|
<a class="px-3 py-1 text-sm -translate-y-8 rounded-b-lg bg-primary-200 dark:bg-neutral-600 focus:translate-y-0" href=#main-content><span class="font-bold ltr:pr-2 rtl:pl-2 text-primary-600 dark:text-primary-400">↓</span>Skip to main content</a>
|
|
</div><header class="flex justify-between py-6 font-semibold sm:items-center sm:py-10 text-neutral-900 dark:text-neutral">
|
|
<div>
|
|
<a class="hover:underline hover:decoration-primary-500 hover:decoration-2 hover:underline-offset-2" rel=me href=/congo/>Congo</a>
|
|
</div>
|
|
<nav>
|
|
<ul class="flex flex-col list-none sm:flex-row">
|
|
<li class="mb-1 ltr:text-right rtl:text-left sm:mb-0 ltr:sm:mr-7 ltr:sm:last:mr-0 rtl:sm:ml-7 rtl:sm:last:ml-0">
|
|
<a class="hover:underline hover:decoration-primary-500 hover:decoration-2 hover:underline-offset-2" href=/congo/docs/ title=Documentation>Docs</a>
|
|
</li>
|
|
<li class="mb-1 ltr:text-right rtl:text-left sm:mb-0 ltr:sm:mr-7 ltr:sm:last:mr-0 rtl:sm:ml-7 rtl:sm:last:ml-0">
|
|
<a class="hover:underline hover:decoration-primary-500 hover:decoration-2 hover:underline-offset-2" href=/congo/samples/ title="Content Samples">Samples</a>
|
|
</li>
|
|
<li class="mb-1 ltr:text-right rtl:text-left sm:mb-0 ltr:sm:mr-7 ltr:sm:last:mr-0 rtl:sm:ml-7 rtl:sm:last:ml-0">
|
|
<a class="hover:underline hover:decoration-primary-500 hover:decoration-2 hover:underline-offset-2" href=/congo/users/ title=Users>Users</a>
|
|
</li>
|
|
<li class="mb-1 ltr:text-right rtl:text-left sm:mb-0 ltr:sm:mr-7 ltr:sm:last:mr-0 rtl:sm:ml-7 rtl:sm:last:ml-0">
|
|
<a class="hover:underline hover:decoration-primary-500 hover:decoration-2 hover:underline-offset-2" href=https://github.com/jpanther/congo title>GitHub</a>
|
|
</li>
|
|
<li class="ltr:text-right rtl:text-left ltr:sm:mr-7 ltr:sm:last:mr-0 rtl:sm:ml-7 rtl:sm:last:ml-0">
|
|
<button id=search-button class="text-base hover:text-primary-600 dark:hover:text-primary-400" title="Search (/)">
|
|
<span class="relative inline-block align-text-bottom icon"><svg aria-hidden="true" focusable="false" data-prefix="fas" data-icon="search" class="svg-inline--fa fa-search fa-w-16" role="img" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512"><path fill="currentcolor" d="M505 442.7 405.3 343c-4.5-4.5-10.6-7-17-7H372c27.6-35.3 44-79.7 44-128C416 93.1 322.9.0 208 0S0 93.1.0 208s93.1 208 208 208c48.3.0 92.7-16.4 128-44v16.3c0 6.4 2.5 12.5 7 17l99.7 99.7c9.4 9.4 24.6 9.4 33.9.0l28.3-28.3c9.4-9.4 9.4-24.6.1-34zM208 336c-70.7.0-128-57.2-128-128 0-70.7 57.2-128 128-128 70.7.0 128 57.2 128 128 0 70.7-57.2 128-128 128z"/></svg>
|
|
</span>
|
|
</button>
|
|
</li>
|
|
</ul>
|
|
</nav>
|
|
</header>
|
|
<main id=main-content class=relative>
|
|
<article>
|
|
<header class=max-w-prose>
|
|
<ol class="text-sm text-neutral-500 dark:text-neutral-400">
|
|
<li class="inline hidden">
|
|
<a class="hover:underline hover:decoration-neutral-300 dark:underline-neutral-600" href=/congo/>Welcome to Congo! :tada:</a><span class="px-1 text-primary-500">/</span>
|
|
</li>
|
|
<li class=inline>
|
|
<a class="hover:underline hover:decoration-neutral-300 dark:underline-neutral-600" href=/congo/docs/>Documentation</a><span class="px-1 text-primary-500">/</span>
|
|
</li>
|
|
<li class="inline hidden">
|
|
<a class="hover:underline hover:decoration-neutral-300 dark:underline-neutral-600" href=/congo/docs/hosting-deployment/>Hosting & Deployment</a><span class="px-1 text-primary-500">/</span>
|
|
</li>
|
|
</ol>
|
|
<h1 class="mt-0 text-4xl font-extrabold text-neutral-900 dark:text-neutral">
|
|
Hosting & Deployment
|
|
</h1>
|
|
<div class="mt-8 mb-12 text-base text-neutral-500 dark:text-neutral-400">
|
|
<div class="flex flex-row flex-wrap items-center">
|
|
<span title="Reading time">3 mins</span><span class="px-2 text-primary-500">·</span>
|
|
<span class=mb-[2px]>
|
|
<a href=https://github.com/jpanther/congo/tree/dev/exampleSite/content/docs/hosting-deployment/index.md class="text-lg hover:text-primary-500" rel="noopener noreferrer" target=_blank title="Edit content">
|
|
<span class="relative inline-block align-text-bottom icon"><svg aria-hidden="true" focusable="false" data-prefix="far" data-icon="edit" class="svg-inline--fa fa-edit fa-w-18" role="img" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 576 512"><path fill="currentcolor" d="M402.3 344.9l32-32c5-5 13.7-1.5 13.7 5.7V464c0 26.5-21.5 48-48 48H48c-26.5.0-48-21.5-48-48V112c0-26.5 21.5-48 48-48h273.5c7.1.0 10.7 8.6 5.7 13.7l-32 32c-1.5 1.5-3.5 2.3-5.7 2.3H48v352h352V350.5c0-2.1.8-4.1 2.3-5.6zm156.6-201.8L296.3 405.7l-90.4 10c-26.2 2.9-48.5-19.2-45.6-45.6l10-90.4L432.9 17.1c22.9-22.9 59.9-22.9 82.7.0l43.2 43.2c22.9 22.9 22.9 60 .1 82.8zM460.1 174 402 115.9 216.2 301.8l-7.3 65.3 65.3-7.3L460.1 174zm64.8-79.7-43.2-43.2c-4.1-4.1-10.8-4.1-14.8.0L436 82l58.1 58.1 30.9-30.9c4-4.2 4-10.8-.1-14.9z"/></svg>
|
|
</span>
|
|
</a>
|
|
</span>
|
|
</div>
|
|
</div>
|
|
</header>
|
|
<section class="flex flex-col max-w-full mt-0 prose lg:flex-row dark:prose-invert">
|
|
<div class="order-first px-0 lg:max-w-xs ltr:lg:pl-8 rtl:lg:pr-8 lg:order-last">
|
|
<div class="ltr:pl-5 rtl:pr-5 toc lg:sticky lg:top-10">
|
|
<details open class="mt-0 overflow-hidden rounded-lg rtl:pr-5 ltr:pl-5 ltr:-ml-5 rtl:-mr-5 lg:mt-3">
|
|
<summary class="block py-1 text-lg font-semibold cursor-pointer rtl:pr-5 ltr:pl-5 ltr:-ml-5 rtl:-mr-5 text-neutral-800 dark:text-neutral-100 lg:hidden bg-neutral-100 dark:bg-neutral-700">
|
|
Table of Contents
|
|
</summary>
|
|
<div class="py-2 border-dotted ltr:border-l rtl:border-r rtl:pr-5 ltr:pl-5 ltr:-ml-5 rtl:-mr-5 border-neutral-300 dark:border-neutral-600">
|
|
<nav id=TableOfContents>
|
|
<ul>
|
|
<li><a href=#github-pages>GitHub Pages</a></li>
|
|
<li><a href=#netlify>Netlify</a></li>
|
|
<li><a href=#render>Render</a></li>
|
|
<li><a href=#shared-hosting-vps-or-private-web-server>Shared hosting, VPS or private web server</a></li>
|
|
</ul>
|
|
</nav>
|
|
</div>
|
|
</details>
|
|
</div>
|
|
</div>
|
|
<div class="min-w-0 min-h-0 max-w-prose">
|
|
<p>There are many ways to deploy your Hugo website built with Congo. The theme is designed to be flexible in almost any deployment scenario.</p>
|
|
<p>Congo is built using relative URLs throughout the theme. This enables sites to easily be deployed to sub-folders and hosts like GitHub Pages. There’s usually no special configuration required for this to work as long as the <code>baseURL</code> parameter has been configured in the <code>config.toml</code> file.</p>
|
|
<p>The official Hugo <a href=https://gohugo.io/hosting-and-deployment/>Hosting and Deployment</a> docs are the best place to learn how to deploy your site. The sections below contain some specific theme configuration details that can help you deploy smoothly with certain providers.</p>
|
|
<p><strong>Choose your provider:</strong></p>
|
|
<ul>
|
|
<li><a href=#github-pages>GitHub Pages</a></li>
|
|
<li><a href=#netlify>Netlify</a></li>
|
|
<li><a href=#render>Render</a></li>
|
|
<li><a href=#shared-hosting-vps-or-private-web-server>Shared hosting, VPS or private web server</a></li>
|
|
</ul>
|
|
<hr>
|
|
<h2 id=github-pages class="relative group">GitHub Pages <span class="absolute top-0 w-6 transition-opacity opacity-0 ltr:-left-6 rtl:-right-6 not-prose group-hover:opacity-100"><a class="group-hover:text-primary-300 dark:group-hover:text-neutral-700" style=text-decoration-line:none!important href=#github-pages aria-label=Anchor>#</a></span></h2>
|
|
<p>GitHub allows hosting on <a href=https://docs.github.com/en/pages/getting-started-with-github-pages/about-github-pages>GitHub Pages</a> using Actions. To enable this functionality, enable Pages on your repo and create a new Actions workflow to build and deploy your site.</p>
|
|
<p>The file needs to be in YAML format, placed within the <code>.github/workflows/</code> directory of your GitHub repository and named with a <code>.yml</code> extension.</p>
|
|
<div class=highlight><pre tabindex=0 class=chroma><code class=language-yaml data-lang=yaml><span class=c># .github/workflows/gh-pages.yml</span><span class=w>
|
|
</span><span class=w>
|
|
</span><span class=w></span><span class=nt>name</span><span class=p>:</span><span class=w> </span><span class=l>GitHub Pages</span><span class=w>
|
|
</span><span class=w>
|
|
</span><span class=w></span><span class=nt>on</span><span class=p>:</span><span class=w>
|
|
</span><span class=w> </span><span class=nt>push</span><span class=p>:</span><span class=w>
|
|
</span><span class=w> </span><span class=nt>branches</span><span class=p>:</span><span class=w>
|
|
</span><span class=w> </span>- <span class=l>main</span><span class=w> </span><span class=c># change to the branch name for your project</span><span class=w>
|
|
</span><span class=w>
|
|
</span><span class=w></span><span class=nt>jobs</span><span class=p>:</span><span class=w>
|
|
</span><span class=w> </span><span class=nt>build-deploy</span><span class=p>:</span><span class=w>
|
|
</span><span class=w> </span><span class=nt>runs-on</span><span class=p>:</span><span class=w> </span><span class=l>ubuntu-20.04</span><span class=w>
|
|
</span><span class=w> </span><span class=nt>concurrency</span><span class=p>:</span><span class=w>
|
|
</span><span class=w> </span><span class=nt>group</span><span class=p>:</span><span class=w> </span><span class=l>${{ github.workflow }}-${{ github.ref }}</span><span class=w>
|
|
</span><span class=w> </span><span class=nt>steps</span><span class=p>:</span><span class=w>
|
|
</span><span class=w> </span>- <span class=nt>name</span><span class=p>:</span><span class=w> </span><span class=l>Checkout</span><span class=w>
|
|
</span><span class=w> </span><span class=nt>uses</span><span class=p>:</span><span class=w> </span><span class=l>actions/checkout@v2</span><span class=w>
|
|
</span><span class=w> </span><span class=nt>with</span><span class=p>:</span><span class=w>
|
|
</span><span class=w> </span><span class=nt>submodules</span><span class=p>:</span><span class=w> </span><span class=kc>true</span><span class=w>
|
|
</span><span class=w> </span><span class=nt>fetch-depth</span><span class=p>:</span><span class=w> </span><span class=m>0</span><span class=w>
|
|
</span><span class=w>
|
|
</span><span class=w> </span>- <span class=nt>name</span><span class=p>:</span><span class=w> </span><span class=l>Setup Hugo</span><span class=w>
|
|
</span><span class=w> </span><span class=nt>uses</span><span class=p>:</span><span class=w> </span><span class=l>peaceiris/actions-hugo@v2</span><span class=w>
|
|
</span><span class=w> </span><span class=nt>with</span><span class=p>:</span><span class=w>
|
|
</span><span class=w> </span><span class=nt>hugo-version</span><span class=p>:</span><span class=w> </span><span class=s2>"latest"</span><span class=w>
|
|
</span><span class=w>
|
|
</span><span class=w> </span>- <span class=nt>name</span><span class=p>:</span><span class=w> </span><span class=l>Build</span><span class=w>
|
|
</span><span class=w> </span><span class=nt>run</span><span class=p>:</span><span class=w> </span><span class=l>hugo --minify</span><span class=w>
|
|
</span><span class=w>
|
|
</span><span class=w> </span>- <span class=nt>name</span><span class=p>:</span><span class=w> </span><span class=l>Deploy</span><span class=w>
|
|
</span><span class=w> </span><span class=nt>uses</span><span class=p>:</span><span class=w> </span><span class=l>peaceiris/actions-gh-pages@v3</span><span class=w>
|
|
</span><span class=w> </span><span class=nt>if</span><span class=p>:</span><span class=w> </span><span class=l>${{ github.ref == 'refs/heads/main' }}</span><span class=w>
|
|
</span><span class=w> </span><span class=nt>with</span><span class=p>:</span><span class=w>
|
|
</span><span class=w> </span><span class=nt>github_token</span><span class=p>:</span><span class=w> </span><span class=l>${{ secrets.GITHUB_TOKEN }}</span><span class=w>
|
|
</span><span class=w> </span><span class=nt>publish_branch</span><span class=p>:</span><span class=w> </span><span class=l>gh-pages</span><span class=w>
|
|
</span><span class=w> </span><span class=nt>publish_dir</span><span class=p>:</span><span class=w> </span><span class=l>./public</span><span class=w>
|
|
</span></code></pre></div><p>Push the config file to GitHub and the action should automatically run. It may fail the first time and you’ll need to visit the <strong>Settings > Pages</strong> section of your GitHub repo to check the source is correct. It should be set to use the <code>gh-pages</code> branch.</p>
|
|
<figure><img src=/congo/docs/hosting-deployment/github-pages-source.jpg alt="Screen capture of GitHub Pages source" width=100% height=auto style=max-width:565px;max-height:95px>
|
|
</figure>
|
|
<p>Once the settings are configured, re-run the action and the site should build and deploy correctly. You can consult the actions log to check everything deployed successfully.</p>
|
|
<h2 id=netlify class="relative group">Netlify <span class="absolute top-0 w-6 transition-opacity opacity-0 ltr:-left-6 rtl:-right-6 not-prose group-hover:opacity-100"><a class="group-hover:text-primary-300 dark:group-hover:text-neutral-700" style=text-decoration-line:none!important href=#netlify aria-label=Anchor>#</a></span></h2>
|
|
<p>To deploy to <a href=https://www.netlify.com>Netlify</a>, create a new continuous deployment site and link it to your source code. The build settings can be left blank in the Netlify UI. You will only need to configure the domain you’ll be using.</p>
|
|
<figure><img src=/congo/docs/hosting-deployment/netlify-build-settings.jpg alt="Screen capture of Netlify build settings" width=100% height=auto style=max-width:479px;max-height:331px>
|
|
</figure>
|
|
<p>Then in the root of your site repository, create a <code>netlify.toml</code> file:</p>
|
|
<div class=highlight><pre tabindex=0 class=chroma><code class=language-toml data-lang=toml><span class=c># netlify.toml</span>
|
|
|
|
<span class=p>[</span><span class=nx>build</span><span class=p>]</span>
|
|
<span class=nx>command</span> <span class=p>=</span> <span class=s2>"hugo mod get -u && hugo --gc --minify -b $URL"</span>
|
|
<span class=nx>publish</span> <span class=p>=</span> <span class=s2>"public"</span>
|
|
|
|
<span class=p>[</span><span class=nx>build</span><span class=p>.</span><span class=nx>environment</span><span class=p>]</span>
|
|
<span class=nx>NODE_ENV</span> <span class=p>=</span> <span class=s2>"production"</span>
|
|
<span class=nx>GO_VERSION</span> <span class=p>=</span> <span class=s2>"1.16"</span>
|
|
<span class=nx>TZ</span> <span class=p>=</span> <span class=s2>"UTC"</span> <span class=c># Set to preferred timezone</span>
|
|
|
|
<span class=p>[</span><span class=nx>context</span><span class=p>.</span><span class=nx>production</span><span class=p>.</span><span class=nx>environment</span><span class=p>]</span>
|
|
<span class=nx>HUGO_VERSION</span> <span class=p>=</span> <span class=s2>"0.87.0"</span>
|
|
<span class=nx>HUGO_ENV</span> <span class=p>=</span> <span class=s2>"production"</span>
|
|
</code></pre></div><p>This configuration assumes you are deploying Congo as a Hugo module. If you have installed the theme using another method, change the build command to simply <code>hugo --gc --minify -b $URL</code>.</p>
|
|
<p>When you push the config file to your repo, Netlify should automatically deploy your site. You can check the deploy logs in the Netlify UI to check for any errors.</p>
|
|
<h2 id=render class="relative group">Render <span class="absolute top-0 w-6 transition-opacity opacity-0 ltr:-left-6 rtl:-right-6 not-prose group-hover:opacity-100"><a class="group-hover:text-primary-300 dark:group-hover:text-neutral-700" style=text-decoration-line:none!important href=#render aria-label=Anchor>#</a></span></h2>
|
|
<p>Deploying to <a href=https://render.com>Render</a> is very straightforward and all configuration is via the Render UI.</p>
|
|
<p>Create a new <strong>Static Site</strong> and link it to your project’s code repository. Then simply configure the build command to be <code>hugo --gc --minify</code> and publish directory to be <code>public</code>.</p>
|
|
<figure><img src=/congo/docs/hosting-deployment/render-settings.jpg alt="Screen capture of Render settings" width=100% height=auto style=max-width:628px;max-height:227px>
|
|
</figure>
|
|
<p>The site will automatically build and deploy whenever you push a change to your repo.</p>
|
|
<h2 id=shared-hosting-vps-or-private-web-server class="relative group">Shared hosting, VPS or private web server <span class="absolute top-0 w-6 transition-opacity opacity-0 ltr:-left-6 rtl:-right-6 not-prose group-hover:opacity-100"><a class="group-hover:text-primary-300 dark:group-hover:text-neutral-700" style=text-decoration-line:none!important href=#shared-hosting-vps-or-private-web-server aria-label=Anchor>#</a></span></h2>
|
|
<p>Using traditional web hosting, or deploying to your own web server, is as simple as building your Hugo site and transferring the files to your host.</p>
|
|
<p>Make sure that the <code>baseURL</code> parameter in <code>config.toml</code> is set to the full URL to the root of your website (including any sub domains or sub-folders).</p>
|
|
<p>Then build your site using <code>hugo</code> and copy the contents of the output directory to the root of your web server and you will be ready to go. By default, the output directory is named <code>public</code>.</p>
|
|
<p><em>If you need a hosting provider, check out <a href="https://www.vultr.com/?ref=8957394-8H">Vultr</a> or <a href=https://m.do.co/c/36841235e565>DigitalOcean</a>. Signing up using these affiliate links will give you up to $100 in free credit so you can try the service.</em></p>
|
|
</div>
|
|
</section>
|
|
<footer class="pt-8 max-w-prose">
|
|
<div class=pt-8>
|
|
<hr class="border-dotted border-neutral-300 dark:border-neutral-600">
|
|
<div class="flex justify-between pt-3">
|
|
<span>
|
|
<a class="flex group" href=/congo/docs/advanced-customisation/>
|
|
<span class="mr-3 ltr:inline rtl:hidden text-neutral-700 dark:text-neutral group-hover:text-primary-600 dark:group-hover:text-primary-400">←</span>
|
|
<span class="ml-3 ltr:hidden rtl:inline text-neutral-700 dark:text-neutral group-hover:text-primary-600 dark:group-hover:text-primary-400">→</span>
|
|
<span class="flex flex-col">
|
|
<span class="mt-[0.1rem] leading-6 group-hover:underline group-hover:decoration-primary-500">Advanced Customisation</span>
|
|
<span class="mt-[0.1rem] text-xs text-neutral-500 dark:text-neutral-400">
|
|
</span>
|
|
</span>
|
|
</a>
|
|
</span>
|
|
<span>
|
|
</span>
|
|
</div>
|
|
</div>
|
|
</footer>
|
|
</article>
|
|
<div class="absolute top-[110vh] ltr:right-0 rtl:left-0 w-12 pointer-events-none bottom-[-5.5rem]">
|
|
<a href=#the-top class="w-12 h-12 sticky pointer-events-auto top-[calc(100vh-5rem)] bg-neutral/50 dark:bg-neutral-800/50 backdrop-blur rounded-full text-xl flex items-center justify-center text-neutral-700 dark:text-neutral hover:text-primary-600 dark:hover:text-primary-400" aria-label="Scroll to top" title="Scroll to top">
|
|
↑
|
|
</a>
|
|
</div>
|
|
</main>
|
|
<div id=search-wrapper class="fixed inset-0 z-50 flex flex-col p-4 sm:p-6 md:p-[10vh] lg:p-[12vh] w-screen h-screen cursor-default bg-neutral-500/50 backdrop-blur-sm dark:bg-neutral-900/50 invisible" data-url=https://jpanther.github.io/congo/>
|
|
<div id=search-modal class="flex flex-col w-full max-w-3xl min-h-0 mx-auto border rounded-md shadow-lg border-neutral-200 top-20 bg-neutral dark:bg-neutral-800 dark:border-neutral-700">
|
|
<header class="relative z-10 flex items-center justify-between flex-none px-2">
|
|
<form class="flex items-center flex-auto min-w-0">
|
|
<div class="flex items-center justify-center w-8 h-8 text-neutral-400">
|
|
<span class="relative inline-block align-text-bottom icon"><svg aria-hidden="true" focusable="false" data-prefix="fas" data-icon="search" class="svg-inline--fa fa-search fa-w-16" role="img" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512"><path fill="currentcolor" d="M505 442.7 405.3 343c-4.5-4.5-10.6-7-17-7H372c27.6-35.3 44-79.7 44-128C416 93.1 322.9.0 208 0S0 93.1.0 208s93.1 208 208 208c48.3.0 92.7-16.4 128-44v16.3c0 6.4 2.5 12.5 7 17l99.7 99.7c9.4 9.4 24.6 9.4 33.9.0l28.3-28.3c9.4-9.4 9.4-24.6.1-34zM208 336c-70.7.0-128-57.2-128-128 0-70.7 57.2-128 128-128 70.7.0 128 57.2 128 128 0 70.7-57.2 128-128 128z"/></svg>
|
|
</span>
|
|
</div>
|
|
<input type=search id=search-query class="flex flex-auto h-12 mx-1 bg-transparent appearance-none focus:outline-dotted focus:outline-transparent focus:outline-2" placeholder=Search tabindex=0>
|
|
</form>
|
|
<button id=close-search-button class="flex items-center justify-center w-8 h-8 text-neutral-700 dark:text-neutral hover:text-primary-600 dark:hover:text-primary-400" title="Close (Esc)">
|
|
<span class="relative inline-block align-text-bottom icon"><svg aria-hidden="true" focusable="false" data-prefix="fas" data-icon="times" class="svg-inline--fa fa-times fa-w-11" role="img" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 352 512"><path fill="currentcolor" d="M242.72 256l100.07-100.07c12.28-12.28 12.28-32.19.0-44.48l-22.24-22.24c-12.28-12.28-32.19-12.28-44.48.0L176 189.28 75.93 89.21c-12.28-12.28-32.19-12.28-44.48.0L9.21 111.45c-12.28 12.28-12.28 32.19.0 44.48L109.28 256 9.21 356.07c-12.28 12.28-12.28 32.19.0 44.48l22.24 22.24c12.28 12.28 32.2 12.28 44.48.0L176 322.72l100.07 100.07c12.28 12.28 32.2 12.28 44.48.0l22.24-22.24c12.28-12.28 12.28-32.19.0-44.48L242.72 256z"/></svg>
|
|
</span>
|
|
</button>
|
|
</header>
|
|
<section class="flex-auto px-2 overflow-auto">
|
|
<ul id=search-results>
|
|
</ul>
|
|
</section>
|
|
</div>
|
|
</div>
|
|
<footer class=py-10>
|
|
<div class="flex justify-between">
|
|
<div>
|
|
<p class="text-sm text-neutral-500 dark:text-neutral-400">
|
|
© 2022 Congo contributors
|
|
</p>
|
|
<p class="text-xs text-neutral-500 dark:text-neutral-400">
|
|
Powered by <a class="hover:underline hover:decoration-primary-400 hover:text-primary-500" href=https://gohugo.io/ target=_blank rel="noopener noreferrer">Hugo</a> & <a class="hover:underline hover:decoration-primary-400 hover:text-primary-500" href=https://git.io/hugo-congo target=_blank rel="noopener noreferrer">Congo</a>
|
|
</p>
|
|
</div>
|
|
<div class="text-sm cursor-pointer text-neutral-700 dark:text-neutral hover:text-primary-600 dark:hover:text-primary-400 ltr:mr-14 rtl:ml-14">
|
|
<button id=appearance-switcher class="w-12 h-12" type=button title="Switch to dark appearance">
|
|
<span class="inline dark:hidden">
|
|
<span class="relative inline-block align-text-bottom icon"><svg aria-hidden="true" focusable="false" data-prefix="fas" data-icon="moon" class="svg-inline--fa fa-moon fa-w-16" role="img" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512"><path fill="currentcolor" d="M283.211 512c78.962.0 151.079-35.925 198.857-94.792 7.068-8.708-.639-21.43-11.562-19.35-124.203 23.654-238.262-71.576-238.262-196.954.0-72.222 38.662-138.635 101.498-174.394 9.686-5.512 7.25-20.197-3.756-22.23A258.156 258.156.0 00283.211.0c-141.309.0-256 114.511-256 256 0 141.309 114.511 256 256 256z"/></svg>
|
|
</span>
|
|
</span>
|
|
<span class="hidden dark:inline">
|
|
<span class="relative inline-block align-text-bottom icon"><svg aria-hidden="true" focusable="false" data-prefix="fas" data-icon="sun" class="svg-inline--fa fa-sun fa-w-16" role="img" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512"><path fill="currentcolor" d="M256 160c-52.9.0-96 43.1-96 96s43.1 96 96 96 96-43.1 96-96-43.1-96-96-96zm246.4 80.5-94.7-47.3 33.5-100.4c4.5-13.6-8.4-26.5-21.9-21.9l-100.4 33.5-47.4-94.8c-6.4-12.8-24.6-12.8-31 0l-47.3 94.7L92.7 70.8c-13.6-4.5-26.5 8.4-21.9 21.9l33.5 100.4-94.7 47.4c-12.8 6.4-12.8 24.6.0 31l94.7 47.3-33.5 100.5c-4.5 13.6 8.4 26.5 21.9 21.9l100.4-33.5 47.3 94.7c6.4 12.8 24.6 12.8 31 0l47.3-94.7 100.4 33.5c13.6 4.5 26.5-8.4 21.9-21.9l-33.5-100.4 94.7-47.3c13-6.5 13-24.7.2-31.1zm-155.9 106c-49.9 49.9-131.1 49.9-181 0s-49.9-131.1.0-181 131.1-49.9 181 0 49.9 131.1.0 181z"/></svg>
|
|
</span>
|
|
</span>
|
|
</button>
|
|
</div>
|
|
</div>
|
|
</footer>
|
|
</body>
|
|
</html> |