pulse/default.hbs at main · frontendweb3/pulse · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
<!DOCTYPE html>
<html lang="{{@site.locale}}" class="no-js">

<head>
    <meta charset="utf-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1">
    {{#is "error"}}
    <title>{{statusCode}} — {{message}}</title>
    <meta name="robots" content="noindex, follow">
    {{else}}
    {{#is "paged"}}
    <title>Page {{pagination.page}} | {{@site.title}}</title>
    {{else}}
    <title>{{meta_title}}</title>
    {{/is}}
    {{/is}}
    <!-- BEGIN HMR DEV SCRIPT -->
    <script id="ghost-vite-hmr">
        (function () {
            const host = window.location.hostname || 'localhost';
            const isLocal = host === 'localhost' || host === '127.0.0.1' || host.endsWith('.local');

            if (isLocal) {
                const port = 5173;
                const viteBaseUrl = `http://${host}:${port}`;

                fetch(`${viteBaseUrl}/@vite/client`, { mode: 'no-cors' })
                    .then(() => {
                        const hmrScript = document.createElement('script');
                        hmrScript.type = 'module';
                        hmrScript.src = `${viteBaseUrl}/assets/js/hmr.js`;
                        document.head.appendChild(hmrScript);
                    })
                    .catch(() => { });
            }
        })();
    </script>
    <!-- END HMR DEV SCRIPT -->

    <link rel="preconnect" href="https://cdn.jsdelivr.net" crossorigin />
    <link rel="dns-prefetch" href="https://cdn.jsdelivr.net" />

    {{!-- Prevent FOUC: hide body until CSS loads --}}
    <style>
        html.no-js body {
            opacity: 0;
        }
    </style>

    {{!-- No-JS fallback: load CSS normally when JS is disabled --}}
    <noscript>
        <style>
            html.no-js body {
                opacity: 1;
            }
        </style>
        <link rel="stylesheet" href="{{asset 'dist/css/main.css'}}" />
        {{#is "post, page"}}
        <link rel="stylesheet" href="{{asset 'dist/css/post.css'}}" />
        {{/is}}
    </noscript>

    {{> "style-script"}} {{!-- partials/style-script.hbs --}}

    {{ghost_head}}

</head>

<body
    class="{{body_class}} dark bg-background text-foreground antialiased min-h-screen flex flex-col font-sans selection:bg-[#0b0b0b] selection:text-foreground relative">

    {{#if @site.cover_image}}
    <!-- Futuristic Cover Image & Gradient Blend System -->
    <div class="fixed inset-0 pointer-events-none z-0 overflow-hidden">
        <!-- Base Cover Image Layer (Controlled by cover_image_display_mode & cover_image_opacity) -->
        <div class="absolute inset-0 bg-cover bg-center bg-no-repeat mix-blend-luminosity {{#match @custom.cover_image_display_mode "
            Fade on Entire Website"}}mask-[linear-gradient(to_bottom,rgba(0,0,0,1)_0%,rgba(0,0,0,0)_350px)]{{else match
            @custom.cover_image_display_mode "Fade on Post Only" }}{{#is "post"
            }}mask-[linear-gradient(to_bottom,rgba(0,0,0,1)_0%,rgba(0,0,0,0)_350px)]{{/is}}{{else match
            @custom.cover_image_display_mode "Full Background (All Pages)" }}{{else match
            @custom.cover_image_display_mode "Hide on Post & Page" }}{{#is "post, page"
            }}hidden{{/is}}{{else}}{{#is "post, page"
            }}mask-[linear-gradient(to_bottom,rgba(0,0,0,1)_0%,rgba(0,0,0,0)_350px)]{{/is}}{{/match}}"
            style="background-image: url('{{img_url @site.cover_image size=" xl"}}'); opacity: {{#if
            @custom.cover_image_opacity}}{{@custom.cover_image_opacity}}{{else}}15%{{/if}};">
        </div>

        <!-- Visual Atmosphere Overlay Layer (Controlled by cover_image_gradient_style) -->
        {{#unless (match @custom.cover_image_display_mode "Full Background (All Pages)")}}
        {{#match @custom.cover_image_gradient_style "Radial Vignette"}}
        <div
            class="absolute inset-0 [background:radial-gradient(ellipse_at_top,transparent_20%,hsl(var(--background))_95%)]">
        </div>
        {{else match @custom.cover_image_gradient_style "Top Ambient Glow"}}
        <div class="absolute inset-0 bg-linear-to-b from-transparent via-background/40 to-background"></div>
        {{else match @custom.cover_image_gradient_style "None"}}
        {{else}}
        <!-- Default: Futuristic Dark Fade -->
        <div class="absolute inset-0 bg-linear-to-b from-background/20 via-background/60 to-background"></div>
        {{/match}}
        {{/unless}}
    </div>
    {{/if}}

    <div class="relative z-10 flex flex-col min-h-screen text-foreground">

        {{> "header"}}

        <main class="grow">
            {{{body}}}
        </main>

        {{> "footer"}}

    </div>

    {{ghost_foot}}

</body>

</html>