error-404.hbs

<!DOCTYPE html>
<html lang="{{@site.lang}}" data-theme="dark">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no"/>
    <title>{{t "Page not found"}}</title>

    {{!--  Font Source sans Pro && roboto mono --}}
    <link href="https://fonts.googleapis.com/css?family=Roboto+Mono|Rubik:400,500,700&display=swap" rel="stylesheet">

    <link rel="stylesheet" type="text/css" href="{{asset "styles/main.css"}}" />

    {{!-- Ghost outputs important style and meta data with this tag --}}
    {{ghost_head}}

    <script>
        if (typeof(Storage) !== 'undefined') {
            if (localStorage.getItem('selected-theme') === 'dark') {
                document.documentElement.setAttribute('data-theme', 'dark')
            } else {
                document.documentElement.setAttribute('data-theme', 'light');
            }
        }
    </script>
</head>
<body class="u-bgColorGrayLight">
    {{!-- Header Content --}}
    {{>"header"}}

    <main class="u-paddingBottom30 u-paddingTop30">
        {{!-- Content Emojis --}}
        <section class="errorPage u-lineHeight1">
            <div class="errorPage-wrap u-marginAuto u-maxWidth1000 u-textAlignCenter u-textMuted">
                <div id="emoji" class="errorPage-emoji" style="font-size:100px">(>_<)</div>
                <div class="errorPage-text">{{t "Unfortunately, this page doesn't exist"}}</div>
            </div>
        </section>

        {{!-- Articles style Card --}}
        {{#get "posts" limit="6" as |recents| }}

        <div class="u-paddingTop30 u-paddingBottom20">
            <div class="container">
                <div class="row">
                    {{#foreach recents}}
                    <div class="col s12 m6 l4">
                        {{!-- Meta - partials/story/story-card-small.hbs --}}
                        {{> "story/story-card-small"}}
                    </div>
                    {{/foreach}}
                </div>
            </div>
        </div>

        {{/get}}
    </main>

    {{!-- Search box --}}
    {{>"widget/search"}}

    {{!-- Subscribe Modal --}}
    {{> "widget/modal-subscribe"}}

    {{!-- Icons --}}
    {{> "icons/icons-symbol-defs"}}

    <script>
        var emoji = ['(·.·)', '(>_<)', '(^-^*)', '(˚Δ˚)', '(·_·)', '(;-;)']
        var emojiRandom = emoji[Math.floor(Math.random()*emoji.length)];
        document.getElementById('emoji').innerHTML = emojiRandom;
    </script>

    {{!-- Ghost outputs important scripts and data with this tag --}}
    {{ghost_foot}}

    {{!-- Footer Content --}}
    {{>"footer"}}

    {{!-- Blog URL --}}
    <script>
        var siteUrl = '{{@site.url}}';
        var siteSearch = '{{asset "scripts/search.js"}}';
    </script>

    {{!-- Main scripts --}}
    <script src="{{asset "scripts/main.js"}}" defer async></script>
</body>
</html>