feat(pwa): Create an offline page

Signed-off-by: Khusika Dhamar Gusti <[email protected]>

assets/css/_page/_404.scss

@@ -12,6 +12,7 @@
     font-weight: 900;
     color: $global-font-color;
     letter-spacing: 1rem;
+    text-transform: uppercase;
     margin-bottom: 5rem;
     [theme=dark] & {
       color: $global-font-color-dark;

content/offline.md

@@ -0,0 +1,5 @@
+---
+title: "Offline"
+draft: false
+offline: true
+---

i18n/de.toml

@@ -149,6 +149,11 @@ other = "Seite nicht gefunden"
 other = "Leider konnte die von Ihnen angeforderte Seite nicht aufgerufen werden."
 # === 404.html ===
 
+# === Offline Page ===
+[pageOffline]
+other = "Sie sind offline. Prüfe deine Internetverbindung."
+# === Offline Page ===
+
 # === shortcodes/admonition.html ===
 [note]
 other = "Notiz"

i18n/en.toml

@@ -145,6 +145,11 @@ other = "Page not found"
 other = "The page you're looking for doesn't exist. Sorry."
 # === 404.html ===
 
+# === Offline Page ===
+[pageOffline]
+other = "You're offline. Check your internet connection."
+# === Offline Page ===
+
 # === shortcodes/admonition.html ===
 [note]
 other = "Note"

i18n/es.toml

@@ -149,6 +149,11 @@ other = "Página no encontrada"
 other = "La página que estás buscando no existe. Lo siento."
 # === 404.html ===
 
+# === Offline Page ===
+[pageOffline]
+other = "Estás desconectado. Comprueba tu conexión a Internet."
+# === Offline Page ===
+
 # === shortcodes/admonition.html ===
 [note]
 other = "Nota"

i18n/fr.toml

@@ -149,6 +149,11 @@ other = "Page non trouvée"
 other = "Désolé, la page recherchée n'existe pas."
 # === 404.html ===
 
+# === Offline Page ===
+[pageOffline]
+other = "Tu es hors ligne. Vérifiez votre connection internet."
+# === Offline Page ===
+
 # === shortcodes/admonition.html ===
 [note]
 other = "Remarque"

i18n/id.toml

@@ -148,6 +148,11 @@ other = "Halaman tidak ditemukan"
 other = "Maaf, halaman yang Anda cari tidak ada."
 # === 404.html ===
 
+# === Offline Page ===
+[pageOffline]
+other = "Anda sedang offline. Periksa koneksi internet Anda."
+# === Offline Page ===
+
 # === shortcodes/admonition.html ===
 [note]
 other = "Catatan"

i18n/it.toml

@@ -149,6 +149,11 @@ other = "Pagina non trovata"
 other = "Mi spiace, la pagina cercata non esiste."
 # === 404.html ===
 
+# === Offline Page ===
+[pageOffline]
+other = "Sei offline. Controlla la tua connessione Internet."
+# === Offline Page ===
+
 # === shortcodes/admonition.html ===
 [note]
 other = "Note"

i18n/pl.toml

@@ -146,6 +146,11 @@ other = "Nie znaleziono strony"
 other = "Wybacz, chyba coś namieszaliśmy."
 # === 404.html ===
 
+# === Offline Page ===
+[pageOffline]
+other = "Jesteś offline. Sprawdź swoje łącze internetowe."
+# === Offline Page ===
+
 # === shortcodes/admonition.html ===
 [note]
 other = "Notka"

i18n/pt-BR.toml

@@ -149,6 +149,11 @@ other = "Página não encontrada"
 other = "A página que você procura não existe. Desculpe"
 # === 404.html ===
 
+# === Offline Page ===
+[pageOffline]
+other = "Você está offline. Verifique sua conexão com a internet."
+# === Offline Page ===
+
 # === shortcodes/admonition.html ===
 [note]
 other = "Nota"

i18n/ro.toml

@@ -149,6 +149,11 @@ other = "Pagina nu a fost găsită"
 other = "Pagina pe care o căutați nu există. Ne cerem scuze."
 # === 404.html ===
 
+# === Offline Page ===
+[pageOffline]
+other = "Ești offline. Verificați conexiunea la internet."
+# === Offline Page ===
+
 # === shortcodes/admonition.html ===
 [note]
 other = "Notă"

i18n/ru.toml

@@ -149,6 +149,11 @@ other = "Страница не найдена"
 other = "Страница, которую вы ищете, не существует. Приносим извинения."
 # === 404.html ===
 
+# === Offline Page ===
+[pageOffline]
+other = "Ты не в сети. Проверьте ваше интернет-соединение."
+# === Offline Page ===
+
 # === shortcodes/admonition.html ===
 [note]
 other = "Замечание"

i18n/sr.toml

@@ -146,6 +146,11 @@ other = "Страница није пронађена"
 other = "Страница коју тражите не постоји. Жао нам је."
 # === 404.html ===
 
+# === Offline Page ===
+[pageOffline]
+other = "Ван мреже сте. Проверите интернет везу."
+# === Offline Page ===
+
 # === shortcodes/admonition.html ===
 [note]
 other = "Напомена"

i18n/vi.toml

@@ -148,6 +148,11 @@ other = "Không tìm thấy trang"
 other = "Trang bạn đang tìm kiếm không tồn tại. Xin lỗi."
 # === 404.html ===
 
+# === Offline Page ===
+[pageOffline]
+other = "Bạn đang ngoại tuyến. Kiểm tra kết nối Internet của bạn."
+# === Offline Page ===
+
 # === shortcodes/admonition.html ===
 [note]
 other = "Ghi chú"

i18n/zh-CN.toml

@@ -150,6 +150,11 @@ other = "页面没找到"
 other = "抱歉，您要查找的页面不存在。"
 # === 404.html ===
 
+# === Offline Page ===
+[pageOffline]
+other = "你离线了。 检查您的互联网连接。"
+# === Offline Page ===
+
 # === shortcodes/admonition.html ===
 [note]
 other = "注意"

layouts/_default/single.html

@@ -3,6 +3,9 @@
 {{- define "content" -}}
     {{- $params := .Scratch.Get "params" -}}
 
+    {{- $offline := $params.offline -}}
+    {{- if ne $offline true -}}
+
     {{- $toc := $params.toc -}}
     {{- if eq $toc true -}}
         {{- $toc = .Site.Params.page.toc | default dict -}}
@@ -68,4 +71,14 @@ <h2 class="single-subtitle animated fadeInDown faster">{{ . }}</h2>
         {{- /* Comment */ -}}
         {{- partial "comment.html" . -}}
     </article>
+    {{- else if eq $offline true -}}
+    <article class="page" id="content-404">
+        <h2>{{ .Title }}</h2>
+        <p>
+            {{- T "pageOffline" -}}
+        </p>
+        <a href="{{ .Site.Home.RelPermalink }}" title="{{ T `home` }}">{{ T `home` }}</a>
+        <a href="javascript:void(0);" title="{{ T `back` }}" onclick="window.history.back();">{{ T `back` }}</a>
+    </article>
+    {{- end -}}
 {{- end -}}