add example www site
This commit is contained in:
Fred K. Schott
parent
9ab1f52a1c
commit
4ff1822bb9
10 changed files with 5088 additions and 0 deletions
4
examples/landing-page/.gitignore
vendored
Normal file
4
examples/landing-page/.gitignore
vendored
Normal file
|
|
@ -0,0 +1,4 @@
|
|||
.DS_Store
|
||||
build
|
||||
node_modules
|
||||
_site
|
||||
4
examples/landing-page/.prettierrc
Normal file
4
examples/landing-page/.prettierrc
Normal file
|
|
@ -0,0 +1,4 @@
|
|||
{
|
||||
"singleQuote": true,
|
||||
"trailingComma": "all"
|
||||
}
|
||||
15
examples/landing-page/.stylelintrc.js
Normal file
15
examples/landing-page/.stylelintrc.js
Normal file
|
|
@ -0,0 +1,15 @@
|
|||
module.exports = {
|
||||
extends: [
|
||||
'stylelint-config-standard',
|
||||
'stylelint-config-rational-order',
|
||||
'stylelint-config-prettier',
|
||||
],
|
||||
rules: {
|
||||
'at-rule-no-unknown': [
|
||||
true,
|
||||
{ ignoreAtRules: ['use', 'each', 'for', 'mixin', 'extend', 'include'] },
|
||||
], // allow Sass syntax,
|
||||
'no-descending-specificity': null,
|
||||
},
|
||||
syntax: 'scss',
|
||||
};
|
||||
21
examples/landing-page/LICENSE
Normal file
21
examples/landing-page/LICENSE
Normal file
|
|
@ -0,0 +1,21 @@
|
|||
MIT License
|
||||
|
||||
Copyright (c) 2019 Fred K. Schott
|
||||
|
||||
Permission is hereby granted, free of charge, to any person obtaining a copy
|
||||
of this software and associated documentation files (the "Software"), to deal
|
||||
in the Software without restriction, including without limitation the rights
|
||||
to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
|
||||
copies of the Software, and to permit persons to whom the Software is
|
||||
furnished to do so, subject to the following conditions:
|
||||
|
||||
The above copyright notice and this permission notice shall be included in all
|
||||
copies or substantial portions of the Software.
|
||||
|
||||
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
|
||||
IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
|
||||
FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
|
||||
AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
|
||||
LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
|
||||
OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
|
||||
SOFTWARE.
|
||||
37
examples/landing-page/README.md
Normal file
37
examples/landing-page/README.md
Normal file
|
|
@ -0,0 +1,37 @@
|
|||
# Astro Demo
|
||||
|
||||
## Getting setup
|
||||
|
||||
1. Checkout Astro at: https://github.com/snowpackjs/astro
|
||||
|
||||
1. Install and build Astro:
|
||||
|
||||
```shell
|
||||
npm install
|
||||
npm run build
|
||||
```
|
||||
|
||||
2. Link Astro:
|
||||
|
||||
```shell
|
||||
npm link
|
||||
```
|
||||
|
||||
2. In this project link Astro and install other deps:
|
||||
|
||||
```shell
|
||||
npm link astro
|
||||
npm install
|
||||
```
|
||||
|
||||
3. Run the Astro dev environment.
|
||||
|
||||
```shell
|
||||
npm run start
|
||||
```
|
||||
|
||||
4. Build the website. (Not yet working.)
|
||||
|
||||
```shell
|
||||
npm run build
|
||||
```
|
||||
15
examples/landing-page/astro.config.mjs
Normal file
15
examples/landing-page/astro.config.mjs
Normal file
|
|
@ -0,0 +1,15 @@
|
|||
export default {
|
||||
projectRoot: '.',
|
||||
astroRoot: './astro',
|
||||
dist: './_site',
|
||||
extensions: {
|
||||
'.jsx': 'preact',
|
||||
},
|
||||
snowpack: {
|
||||
optimize: {
|
||||
bundle: false,
|
||||
minify: true,
|
||||
target: 'es2018',
|
||||
},
|
||||
},
|
||||
};
|
||||
81
examples/landing-page/astro/pages/index.astro
Normal file
81
examples/landing-page/astro/pages/index.astro
Normal file
|
|
@ -0,0 +1,81 @@
|
|||
---
|
||||
let title = 'Snowpack';
|
||||
let description = 'Snowpack is a lightning-fast frontend build tool, designed for the modern web.';
|
||||
---
|
||||
|
||||
<html>
|
||||
<head>
|
||||
<link rel="preconnect" href="https://fonts.gstatic.com">
|
||||
<link href="https://fonts.googleapis.com/css2?family=Roboto+Mono:wght@700&display=swap" rel="stylesheet">
|
||||
|
||||
<style lang="scss">
|
||||
body {
|
||||
background-color: #111;
|
||||
background-image: url("/cswbd0.svg");
|
||||
text-align: center;
|
||||
}
|
||||
.centered-logo {
|
||||
margin: 5rem auto;
|
||||
padding: 3rem;
|
||||
text-align: center;
|
||||
background: #222C;
|
||||
display: inline-block;
|
||||
border: 2px solid #666;
|
||||
}
|
||||
.header {
|
||||
font-family: 'Roboto Mono', monospace;
|
||||
color: white;
|
||||
font-size: 52pt;
|
||||
margin-left: -3rem;
|
||||
}
|
||||
.wait-list-input {
|
||||
font-family: 'Roboto Mono', monospace;
|
||||
display: block;
|
||||
margin: 0rem auto;
|
||||
box-sizing: inherit;
|
||||
font-size: 100%;
|
||||
width: 344px;
|
||||
-webkit-appearance: none;
|
||||
border-radius: 6px;
|
||||
padding: 0 12px;
|
||||
background: #EEE;
|
||||
color: #222;
|
||||
height: 42px;
|
||||
line-height: normal;
|
||||
order: 1;
|
||||
outline: none;
|
||||
transition: border-color .15s ease;
|
||||
}
|
||||
.wait-list-text {
|
||||
font-family: 'Roboto Mono', monospace;
|
||||
display: block;
|
||||
margin: 1rem auto 0;
|
||||
box-sizing: inherit;
|
||||
font-size: 100%;
|
||||
width: 344px;
|
||||
-webkit-appearance: none;
|
||||
border-radius: 6px;
|
||||
padding: 0 12px;
|
||||
color: #EEE;
|
||||
height: 42px;
|
||||
line-height: normal;
|
||||
order: 1;
|
||||
outline: none;
|
||||
transition: border-color .15s ease;
|
||||
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<div class="centered-logo">
|
||||
<svg width="344" height="340" viewBox="0 0 86 85" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<circle cx="43.0005" cy="42.4265" r="40" transform="rotate(45 43.0005 42.4265)" fill="black"/>
|
||||
<path fill-rule="evenodd" clip-rule="evenodd" d="M54.572 20.0569L65.4131 30.8979L47.754 64.0134C46.5495 60.183 44.7599 56.4968 42.3852 53.0949L53.3315 32.9475L52.4685 32.0845L32.3842 43.0781C28.971 40.6874 25.2703 38.8867 21.4241 37.676L54.572 20.0569Z" fill="white"/>
|
||||
<path fill-rule="evenodd" clip-rule="evenodd" d="M37.9733 57.684C35.1799 58.4766 32.0514 57.7734 29.8524 55.5744C27.6534 53.3754 26.9502 50.2471 27.7427 47.4537C27.3662 47.71 27.0083 48.0052 26.6744 48.3391C22.1409 52.8725 22.4943 62.9325 22.4943 62.9325C22.4943 62.9325 32.5239 63.3164 37.0878 58.7525C37.4217 58.4186 37.7169 58.0605 37.9733 57.684Z" fill="white"/>
|
||||
</svg>
|
||||
<!-- <p class="wait-list-text">join the waitlist</p> -->
|
||||
<!-- <input class="wait-list-input" type="text" placeholder="enter your email" /> -->
|
||||
<!-- <h1 class="header" placeholder="">.astro</h1> -->
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
||||
4826
examples/landing-page/package-lock.json
generated
Normal file
4826
examples/landing-page/package-lock.json
generated
Normal file
File diff suppressed because it is too large
Load diff
15
examples/landing-page/package.json
Normal file
15
examples/landing-page/package.json
Normal file
|
|
@ -0,0 +1,15 @@
|
|||
{
|
||||
"name": "snowpack-www",
|
||||
"version": "3.0.0",
|
||||
"scripts": {
|
||||
"start": "nodemon -w ../../lib -x 'astro dev .'",
|
||||
"build": "astro build",
|
||||
"format": "prettier --write \"src/**/*.js\" && yarn format:css",
|
||||
"format:css": "stylelint 'src/**/*.scss' --fix"
|
||||
},
|
||||
"dependencies": {},
|
||||
"devDependencies": {
|
||||
"astro": "file:../../",
|
||||
"nodemon": "^2.0.7"
|
||||
}
|
||||
}
|
||||
70
examples/landing-page/public/cswbd0.svg
Normal file
70
examples/landing-page/public/cswbd0.svg
Normal file
|
|
@ -0,0 +1,70 @@
|
|||
<?xml version="1.0"?>
|
||||
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"
|
||||
viewBox="0 0 256 256" width="64px" height="64px">
|
||||
<style type="text/css">
|
||||
@keyframes ld-pulse
|
||||
{
|
||||
0% {
|
||||
animation-timing-function: cubic-bezier(0.0413,0.3905,0.5086,0.6902);
|
||||
transform: scale(1);
|
||||
}
|
||||
24.3% {
|
||||
animation-timing-function: cubic-bezier(0.2248,0.6332,0.5246,1);
|
||||
transform: scale(0.8458);
|
||||
}
|
||||
55% {
|
||||
animation-timing-function: cubic-bezier(0.3036,0.3393,0.655,0.6144);
|
||||
transform: scale(0.8022);
|
||||
}
|
||||
70.2% {
|
||||
animation-timing-function: cubic-bezier(0.4464,0.2728,0.5562,0.7288);
|
||||
transform: scale(0.8294);
|
||||
}
|
||||
82.3% {
|
||||
animation-timing-function: cubic-bezier(0.6826,0.1845,1,0.7358);
|
||||
transform: scale(0.869);
|
||||
}
|
||||
100% {
|
||||
transform: scale(1);
|
||||
}
|
||||
}
|
||||
.ld.ld-pulse {
|
||||
animation: ld-pulse 0.5s infinite;
|
||||
}
|
||||
@keyframes ld-move {
|
||||
0% { transform: translate(0,0) }
|
||||
100% { transform: translate(256px,0) }
|
||||
}
|
||||
</style>
|
||||
<defs><g id="id-0.536816420380452">
|
||||
|
||||
<g>
|
||||
|
||||
<line fill="none" stroke="#666" stroke-width="6" stroke-linecap="round" stroke-linejoin="round" stroke-miterlimit="10" x1="192" y1="168" x2="192" y2="216"/>
|
||||
|
||||
<line fill="none" stroke="#666" stroke-width="6" stroke-linecap="round" stroke-linejoin="round" stroke-miterlimit="10" x1="168" y1="192" x2="216" y2="192"/>
|
||||
</g>
|
||||
<g>
|
||||
|
||||
<line fill="none" stroke="#EEE" stroke-width="6" stroke-linecap="round" stroke-linejoin="round" stroke-miterlimit="6" x1="64" y1="40" x2="64" y2="88"/>
|
||||
|
||||
<line fill="none" stroke="#EEE" stroke-width="6" stroke-linecap="round" stroke-linejoin="round" stroke-miterlimit="6" x1="40" y1="64" x2="88" y2="64"/>
|
||||
</g>
|
||||
|
||||
|
||||
</g></defs>
|
||||
<rect x="0" y="0" transform="matrix(-8.980568e-11 1 -1 -8.980568e-11 256 1.724223e-08)" fill="#222222" width="256" height="256"/>
|
||||
<g>
|
||||
<use xlink:href="#id-0.536816420380452" x="-256" y="-256"/>
|
||||
<use xlink:href="#id-0.536816420380452" x="0" y="-256"/>
|
||||
<use xlink:href="#id-0.536816420380452" x="256" y="-256"/>
|
||||
<use xlink:href="#id-0.536816420380452" x="-256" y="0"/>
|
||||
<use xlink:href="#id-0.536816420380452" x="0" y="0"/>
|
||||
<use xlink:href="#id-0.536816420380452" x="256" y="0"/>
|
||||
<use xlink:href="#id-0.536816420380452" x="-256" y="256"/>
|
||||
<use xlink:href="#id-0.536816420380452" x="0" y="256"/>
|
||||
<use xlink:href="#id-0.536816420380452" x="256" y="256"/>
|
||||
<animateTransform attributeName="transform" type="translate"
|
||||
dur="6s" repeatCount="indefinite" keyTimes="0;1" values="256;0"/>
|
||||
</g>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 2.5 KiB |
Loading…
Reference in a new issue