| 1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757677787980818283848586878889 |
- <!DOCTYPE html>
- <html>
- <head>
- <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
- <link rel="icon" type="image/png" href="/favicon.png">
- <!-- HTML Meta Tags -->
- <title>Homepage | WebStick</title>
- <meta name="description" content="A tiny web server powered by ESP8266, designed by tobychui">
- <meta name="viewport" content="width=device-width, initial-scale=1" >
-
- <!-- Facebook Meta Tags -->
- <meta property="og:url" content="https://imuslab.com">
- <meta property="og:type" content="website">
- <meta property="og:title" content="Welcome to WebStick!">
- <meta property="og:description" content="A tiny web server powered by ESP8266, designed by tobychui">
- <meta property="og:image" content=" ">
- <!-- Twitter Meta Tags -->
- <meta name="twitter:card" content="summary_large_image">
- <meta property="twitter:domain" content="imuslab.com">
- <meta property="twitter:url" content="https://imuslab.com">
- <meta name="twitter:title" content="Welcome to WebStick!">
- <meta name="twitter:description" content="A tiny web server powered by ESP8266, designed by tobychui">
- <meta name="twitter:image" content=" ">
- <!-- CDN -->
- <script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
- <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/tocas-ui/5.0.2/tocas.min.css">
- <script src="https://cdnjs.cloudflare.com/ajax/libs/tocas-ui/5.0.2/tocas.min.js"></script>
- <link rel="preconnect" href="https://fonts.googleapis.com">
- <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
- <link href="https://fonts.googleapis.com/css2?family=Noto+Sans+TC:wght@400;500;700&display=swap" rel="stylesheet">
- <style>
- #banner{
- background: linear-gradient(48deg, rgba(108,172,255,1) 8%, rgba(141,235,255,1) 65%)
- }
- </style>
- </head>
- <body>
- <div class="ts-content">
- <div class="ts-tab is-segmented">
- <a class="item is-active" data-tab="home">Home</a>
- <a class="item" data-tab="about">About</a>
- <a class="item" data-tab="posts">Posts</a>
- <a class="item" data-tab="qr">QR</a>
- </div>
- <div class="has-top-spaced-small"></div>
- <div class="ts-content " id="home">
- <div id="banner" class="ts-content is-rounded is-padded has-top-spaced-large" style=" color: var(--ts-gray-50)">
- <div style="max-width: 300px">
- <div id="pageTitle" class="ts-header is-huge is-heavy">WebStick</div>
- <p id="pageDesc">A personal web server hosted on an ESP8266 using a micro SD card</p>
- <a href="/admin" class="ts-button is-outlined" style="color: var(--ts-gray-50)">Login</a>
- </div>
- </div>
- <!-- Contact Information, change these to yours -->
- <div class="ts-content is-center-aligned has-top-spaced-large">
- <a href="https://www.youtube.com/channel/UCzbcGOZHO2BH-ANX7W0MGIg"><span class="ts-icon is-huge is-youtube-icon"></span></a>
- <a class="has-start-spaced-large" href="https://blog.imuslab.com"><span class="ts-icon is-huge is-newspaper-icon"></span></a>
- <a class="has-start-spaced-large" href="mailto:[email protected]"><span class="ts-icon is-huge is-envelope-icon"></span></a>
- <a class="has-start-spaced-large" href="https://github.com/tobychui/webstick"><span class="ts-icon is-huge is-code-icon"></span></a>
- </div>
- </div>
- <div class="ts-content" id="about">
- <!-- Dynmaically loaded by ajax from about.html -->
- </div>
- <div class="ts-content" id="posts">
- <!-- Dynmaically loaded by ajax from post.html -->
- </div>
- <div class="ts-content" id="qr">
- <!-- An iframe will be append here for the QR code generator -->
- </div>
-
- <div class="ts-divider"></div>
- <div class="ts-content">
- <p class="ts-text">This site is hosted on a WebStick designed by <a href="https://imuslab.com" target="_blank">tobychui</a></p>
- </div>
- </div>
-
- <script>
- /* Ajax load of the pages */
- $("#about").load("about.html");
- $("#posts").load("posts.html");
- $("#qr").html('<iframe src="tool/qr.html" style="border: none; width: 100%; height: calc(100vh - 200px);"></iframe>');
- </script>
- </body>
- </html>
|
