render a simple captive portal in each language reusing butter styles

This commit is contained in:
John Hess 2021-11-30 16:16:17 -06:00
parent 06bced877f
commit c9fe5cdc58
6 changed files with 85 additions and 44 deletions

View file

@ -29,3 +29,8 @@ modal_data:
- '/assets/images/slide-img-5.png' - '/assets/images/slide-img-5.png'
warning: | warning: |
You will need to enable downloads from unknown sources to install this app on your Android phone. You will need to enable downloads from unknown sources to install this app on your Android phone.
captive_data:
welcome_message: |
Welcome to the butterbox. Press continue to connect.
continue_button: 'Continue'

View file

@ -27,3 +27,7 @@ modal_data:
warning: | warning: |
Debes 'habilitar descargas de fuentes desconocidas' para descargar esta aplicación en tu teléfono Android. Debes 'habilitar descargas de fuentes desconocidas' para descargar esta aplicación en tu teléfono Android.
captive_data:
welcome_message: |
Bienvenido. Esto es "como la mantequilla." Oprima continuar para conectar.
continue_button: 'Continuar'

View file

@ -2,8 +2,8 @@ site_name: 'Butter'
page_logo: ['/assets/images/butter-logo-feature-large.svg', 'Butter App Feature Logo'] page_logo: ['/assets/images/butter-logo-feature-large.svg', 'Butter App Feature Logo']
title: 'Life without internet made smoother. <br /> Get access to tools that help.' title: 'Life without internet made smoother. <br /> Get access to tools that help.'
text: | text: |
The Butter app features a collection of apps to make life without <br /> the internet a little smoother. Butter features a collection of apps to make life without <br /> the internet a little smoother.
Use it to discover and download <br /> free, ad-free apps or to spread the love and share apps offline. Use it to discover and download <br /> free, ad-free apps or to spread the love and share offline.
button_text: 'Download Android App' button_text: 'Download Android App'
image: ['/assets/images/butter-collection-features-offline-essentials.svg', 'Butter App features collection'] image: ['/assets/images/butter-collection-features-offline-essentials.svg', 'Butter App features collection']
@ -29,3 +29,8 @@ modal_data:
- '/assets/images/slide-img-5.png' - '/assets/images/slide-img-5.png'
warning: | warning: |
You will need to enable downloads from unknown sources to install this app on your Android phone. You will need to enable downloads from unknown sources to install this app on your Android phone.
captive_data:
welcome_message: |
Welcome to the butterbox. Press continue to connect.
continue_button: 'Continue'

43
_layouts/basic.html Normal file
View file

@ -0,0 +1,43 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
{% include seo.html %}
<title>{{ site.title }}</title>
<link rel="icon" href="{{ '/assets/images/butter-favicon-120.png' | relative_url }}" type="image/png" />
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/slick-carousel/1.8.1/slick.min.css" integrity="sha512-yHknP1/AwR+yx26cB1y0cjvQUMvEa2PFzt1c9LlS4pRQ5NOTZFWbhBig+X9G9eYW/8m0/4OXNx8pxJ6z57x0dw==" crossorigin="anonymous" referrerpolicy="no-referrer" />
<link rel="stylesheet" href="{{ site.baseurl }}/assets/css/style.css" />
</head>
<body>
<main class="main-area">
{{ content }}
</main>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.6.0/jquery.min.js" integrity="sha512-894YE6QWD5I59HgZOGReFYm4dnWc1Qt5NtvYSaNcOP+u1T9qYdvdihz0PPSiiqn/+/3e7Jo4EaG7TubfWGUrMQ==" crossorigin="anonymous" referrerpolicy="no-referrer"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/slick-carousel/1.8.1/slick.min.js" integrity="sha512-XtmMtDEcNz2j7ekrtHvOVR4iwwaD6o/FUJe6+Zq+HgcCsk3kj4uSQQR8weQ2QVj1o0Pk6PwYLohm206ZzNfubg==" crossorigin="anonymous" referrerpolicy="no-referrer"></script>
<script src="{{ site.baseurl }}/assets/js/micromodal.min.js"></script>
<script src="{{ site.baseurl }}/assets/js/main.js"></script>
<!-- Matomo -->
<script>
var _paq = window._paq = window._paq || [];
/* tracker methods like "setCustomDimension" should be called before "trackPageView" */
_paq.push(['trackPageView']);
_paq.push(['enableLinkTracking']);
(function() {
var u="//metrics.cleaninsights.org/";
_paq.push(['setTrackerUrl', u+'matomo.php']);
_paq.push(['setSiteId', '20']);
var d=document, g=d.createElement('script'), s=d.getElementsByTagName('script')[0];
g.async=true; g.src=u+'matomo.js'; s.parentNode.insertBefore(g,s);
})();
</script>
<!-- End Matomo Code -->
</body>
</html>

View file

@ -1,45 +1,9 @@
<!DOCTYPE html> ---
<html lang="en"> layout: basic
<head> ---
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
{% include seo.html %}
<title>{{ site.title }}</title>
<link rel="icon" href="{{ '/assets/images/butter-favicon-120.png' | relative_url }}" type="image/png" />
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/slick-carousel/1.8.1/slick.min.css" integrity="sha512-yHknP1/AwR+yx26cB1y0cjvQUMvEa2PFzt1c9LlS4pRQ5NOTZFWbhBig+X9G9eYW/8m0/4OXNx8pxJ6z57x0dw==" crossorigin="anonymous" referrerpolicy="no-referrer" />
<link rel="stylesheet" href="{{ site.baseurl }}/assets/css/style.css" />
</head>
<body>
<main class="main-area">
{% include header.html %} {% include header.html %}
{{ content }} {{ content }}
{% include footer.html %} {% include footer.html %}
</main>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.6.0/jquery.min.js" integrity="sha512-894YE6QWD5I59HgZOGReFYm4dnWc1Qt5NtvYSaNcOP+u1T9qYdvdihz0PPSiiqn/+/3e7Jo4EaG7TubfWGUrMQ==" crossorigin="anonymous" referrerpolicy="no-referrer"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/slick-carousel/1.8.1/slick.min.js" integrity="sha512-XtmMtDEcNz2j7ekrtHvOVR4iwwaD6o/FUJe6+Zq+HgcCsk3kj4uSQQR8weQ2QVj1o0Pk6PwYLohm206ZzNfubg==" crossorigin="anonymous" referrerpolicy="no-referrer"></script>
<script src="{{ site.baseurl }}/assets/js/micromodal.min.js"></script>
<script src="{{ site.baseurl }}/assets/js/main.js"></script>
<!-- Matomo -->
<script>
var _paq = window._paq = window._paq || [];
/* tracker methods like "setCustomDimension" should be called before "trackPageView" */
_paq.push(['trackPageView']);
_paq.push(['enableLinkTracking']);
(function() {
var u="//metrics.cleaninsights.org/";
_paq.push(['setTrackerUrl', u+'matomo.php']);
_paq.push(['setSiteId', '20']);
var d=document, g=d.createElement('script'), s=d.getElementsByTagName('script')[0];
g.async=true; g.src=u+'matomo.js'; s.parentNode.insertBefore(g,s);
})();
</script>
<!-- End Matomo Code -->
</body>
</html>

20
captive.html Normal file
View file

@ -0,0 +1,20 @@
---
layout: basic
---
{% assign page_data = site.data.home %}
<section class="content-area" style="height: 100vh; padding-top: 40px;">
<div class="container">
<div class="content-area-wrapper text-center">
<img src="{{site.baseurl}}{{ page_data.page_logo[0] }}" alt="{{ page_data.page_logo[1] }}" />
<h1 class="content-title mb-2">{{ page_data.captive_data.welcome_message }}</h1>
<!-- Use NoDogSplash-provided variables to render a "continue" button -->
<form method="get" action="$authaction">
<input type="hidden" name="tok" value="$tok">
<input type="hidden" name="redir" value="$redir">
<input type="submit" value="{{ page_data.captive_data.continue_button }}">
</form>
</div>
</div>
</section>