MainRoute-Core.github.io/offline.html at main · MainRoute-Core/MainRoute-Core.github.io · 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
<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no">

    <meta name="theme-color" content="#f44234">
    <meta name="title" content="404 - Route Not Found | MainRoute Core" />
    <meta name="description" content="The data packet you requested has drifted into the digital void." />
    <meta name="keywords"
        content="MainRoute, MainRoute Core, MR Core, MRC, M Ramzan Ch, MegaMind-Solution, Web Development, Software Development, Modifications, Git Folder Downloader,  Pro Bandey" />
    <meta name="author" content="M Ramzan Ch" />
    <meta name="copyright" content="MainRoute Core" />

    <meta property="og:type" content="website" />
    <meta property="og:url" content="https://mainroute-core.github.io/" />
    <meta property="og:title" content="MainRoute Core | Be Passionate For Future" />
    <meta property="og:description"
        content="A specialized technology powerhouse delivering PWA, open-source, and custom software solutions." />
    <meta property="og:image" content="/src/social.png" />

    <!-- <script>navigator.serviceWorker.register("/js/sw.js")</script>  -->
    <script>
        if ('serviceWorker' in navigator) { window.addEventListener('load', () => { navigator.serviceWorker.register('/sw.js') .then(reg => { console.log('Core Service Worker Active. Scope:', reg.scope); }) .catch(err => { console.error('× Service Worker Registration Failed:', err); }); }); }
    </script>
    <link rel="manifest" href="/manifest.webmanifest">
    <link rel="canonical" href="https://mainroute-core.github.io/">
    <link rel="shortcut icon" type="image/x-icon" sizes="any" href="/favicon.ico">
    <link rel="icon" type="image/png" sizes="16x16" href="/src/16.png">
    <link rel="icon" type="image/png" sizes="32x32" href="/src/32.png">
    <link rel="apple-touch-icon" type="image/png" sizes="180x180" href="/src/apple-touch-icon.png">
    <link rel="apple-touch-icon" type="image/png" sizes="167x167" href="/src/apple-touch-167.png">

    <title id="core-game-title">520 - Core Interrupted | MainRoute Core</title>

    <link href="/src/CoreSans-Regular_en.otf" rel="stylesheet">
    <style>
        @import url(/css/global.css); @font-face{ font-family: 'Core Sans'; src: url(/src/CoreSans-Regular_en.otf); font-display: swap;} :root{ --mrc: #f44234; --mrc-light: #ff7063; --mrc-glow: rgba(244, 66, 52, .4); --bg-dark: #09090b; --bg-surface: #18181b; --bg-surface-elevated: #27272a; --text-main: #f8fafc; --text-muted: #a1a1aa; --glass-bg: rgba(24, 24, 27, .65); --glass-border: rgba(255, 255, 255, .4); --glass-shadow: 0 8px 32px 0 rgba(0, 0, 0, .3); --font-sans: 'Core Sans', system-ui, -apple-system, sans-serif; --font-mono: 'Space Mono', ui-monospace, monospace; --container-width: 1280px; --nav-height: 80px} *{ margin: 0; padding: 0; box-sizing: border-box} html{ scroll-behavior: smooth; font-size: 16px} body{ font-family: var(--font-sans); background-color: var(--bg-dark); color: var(--text-main); overflow-x: hidden; -webkit-font-smoothing: antialiased; line-height: 1.5} a{ text-decoration: none; color: inherit; transition: all .3s ease} img, svg{ max-width: 100%; display: block} button{ cursor: pointer; border: none; background: none; font-family: inherit} .tech-grid{ position: fixed; inset: 0; z-index: 0; pointer-events: none; background-image: linear-gradient(var(--glass-border) 1px, rgb(244 66 52 / 40%) 1px), linear-gradient(90deg, rgb(255 255 255 / 40%) 1px, rgb(0 0 0 / 20%) 1px); background-size: 40px 40px; mask-image: radial-gradient(ellipse at center, black 20%, transparent 80%); -webkit-mask-image: radial-gradient(ellipse at center, black 20%, transparent 80%)} html, body{ -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; -webkit-tap-highlight-color: transparent; overscroll-behavior-y: none} [selectable], [selectable] *{ -webkit-user-select: text !important; -moz-user-select: text !important; -ms-user-select: text !important; user-select: text !important; cursor: text} img, svg{ -webkit-user-drag: none; pointer-events: none} .pointer-events-auto{ pointer-events: auto !important} .main{ display: flex; justify-content: center; align-items: center; padding: 4rem; margin-top: clamp(5rem, 16vw, 8rem); position: relative; height: 100%; width: 100%} .div{ content: ""} .div .error{ display: flex; justify-content: center; align-items: center; pointer-events: none} .div .error{ font-size: 10rem; font-weight: 900; color: var(--mrc); line-height: .7} .div .error img{ height: 120px; width: 120px} .div .error img.trytryagain{ filter: grayscale(1) contrast(1); will-change: filter, opacity} @keyframes bulbFail{ 0%{ opacity: .65; filter: grayscale(1)} 6%{ opacity: .9; filter: grayscale(.5) saturate(1.1)} 10%{ opacity: .55; filter: grayscale(1)} 18%{ opacity: 1; filter: grayscale(.82) saturate(1.2)} 24%{ opacity: .45; filter: grayscale(1)} 34%{ opacity: .95; filter: grayscale(.75) saturate(1.25)} 42%{ opacity: .4; filter: grayscale(1)} 56%{ opacity: 1; filter: grayscale(.65) saturate(1.35) contrast(1.05)} 66%{ opacity: .45; filter: grayscale(1)} 78%{ opacity: .75; filter: grayscale(.9)} 100%{ opacity: .65; filter: grayscale(1)}} .div h2{ color: var(--text-main); font-weight: 700; text-align: center; font-size: 2.5rem; margin: 1rem 0} .div p{ color: var(--text-muted); max-width: 500px; margin: 0 auto; font-size: 1.1rem; line-height: 1.6} .div p.alt{ color: var(--text-main);} .div .div2{ display: flex; justify-content: center;} .div .div2 .btn-home-play{ display: inline-flex; justify-content: center; align-items: center; gap: .75rem; padding: 1rem; margin: 0 .5rem; border-radius: .7rem; background: var(--mrc); color: #fff; font-size: clamp(.75rem, 2vw, 1.1rem); font-weight: 700; text-transform: uppercase; letter-spacing: .1em; transition: all .3s ease; box-shadow: 0 5px 20px var(--mrc-glow); width: clamp(12rem, 30vw, 15rem); margin-top: 1rem} .div .div2 .btn-home-play:hover{ background: var(--mrc-light); transform: translateY(-2px); box-shadow: 0 8px 25px var(--mrc-glow)} .div .div2 .icon{ width: 1.25em; height: 1.25em; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round;}
    </style>
</head>

<body>

    <div class="tech-grid"></div>

    <main class="main">
        <div class="div" id="div-container">
            <div class="error">
                <span>5</span>
                <span>2</span>
                <img class="trytryagain" src="/src/144.png" alt="Not Found">
            </div>
            <h2> Core Interrupted. </h2>
            <p selectable>
                <strong>Try:</strong><br>
                Checking the network cables, modem, and router
            </p>
            <p style="margin-bottom: 2rem;">
                Reconnecting to Wi-Fi<br>
                <code style="color: var(--text-main);">ERR_INTERNET_DISCONNECTED</code>
            </p>

            <div class="div2">
                <a href="/" class="btn-home-play" style="pointer-events: auto;">
                    Return to Core
                    <svg class="icon">
                        <use href="/src/global.svg#icon-home"></use>
                    </svg>
                </a>
            </div>
        </div>
    </main>
    <script>
        const trytryagain = document.querySelector('.trytryagain'); function tryGlow() { trytryagain.style.animation = 'none'; trytryagain.offsetHeight; trytryagain.style.animation = 'bulbFail 1.4s linear'; } setTimeout(tryGlow, 2000); setInterval(tryGlow, 7000);
    </script>
</body>

</html>