Browse Source

Got the first SCSS and Pug integration going, now rewriting all the things.

pull/5/head
Zed A. Shaw 4 months ago
parent
commit
3ae084afc2
5 changed files with 99 additions and 44 deletions
  1. +54
    -9
      package-lock.json
  2. +5
    -2
      package.json
  3. +7
    -2
      rollup.config.js
  4. +2
    -0
      src/routes/auth/index.html
  5. +31
    -31
      src/routes/register/index.svelte

+ 54
- 9
package-lock.json View File

@@ -1877,6 +1877,12 @@
"resolved": "https://registry.npmjs.org/@types/node/-/node-13.7.0.tgz",
"integrity": "sha512-GnZbirvmqZUzMgkFn70c74OQpTTUcCzlhQliTzYjQMqg+hVKcDnxdL19Ne3UdYzdMA/+W3eb646FWn/ZaT1NfQ=="
},
"@types/pug": {
"version": "2.0.4",
"resolved": "https://registry.npmjs.org/@types/pug/-/pug-2.0.4.tgz",
"integrity": "sha1-h3L80EGOPNLMFxVV1zAHQVBR9LI=",
"dev": true
},
"@types/resolve": {
"version": "0.0.8",
"resolved": "https://registry.npmjs.org/@types/resolve/-/resolve-0.0.8.tgz",
@@ -1886,6 +1892,15 @@
"@types/node": "*"
}
},
"@types/sass": {
"version": "1.16.0",
"resolved": "https://registry.npmjs.org/@types/sass/-/sass-1.16.0.tgz",
"integrity": "sha512-2XZovu4NwcqmtZtsBR5XYLw18T8cBCnU2USFHTnYLLHz9fkhnoEMoDsqShJIOFsFhn5aJHjweiUUdTrDGujegA==",
"dev": true,
"requires": {
"@types/node": "*"
}
},
"@types/stack-utils": {
"version": "1.0.1",
"resolved": "https://registry.npmjs.org/@types/stack-utils/-/stack-utils-1.0.1.tgz",
@@ -3760,6 +3775,12 @@
"integrity": "sha1-8NZtA2cqglyxtzvbP+YjEMjlUrc=",
"dev": true
},
"detect-indent": {
"version": "6.0.0",
"resolved": "https://registry.npmjs.org/detect-indent/-/detect-indent-6.0.0.tgz",
"integrity": "sha512-oSyFlqaTHCItVRGK5RmrmjB+CmaMOW7IaNA/kdxqhoa6d17j/5ce9O9eWXmV/KEdRwqpQA+Vqe8a8Bsybu4YnA==",
"dev": true
},
"detect-newline": {
"version": "3.1.0",
"resolved": "https://registry.npmjs.org/detect-newline/-/detect-newline-3.1.0.tgz",
@@ -5919,8 +5940,7 @@
"version": "1.3.0",
"resolved": "https://registry.npmjs.org/growly/-/growly-1.3.0.tgz",
"integrity": "sha1-8QdIy+dq+WS3yWyTxrzCivEgwIE=",
"dev": true,
"optional": true
"dev": true
},
"gulp": {
"version": "4.0.2",
@@ -6954,8 +6974,7 @@
"version": "2.1.1",
"resolved": "https://registry.npmjs.org/is-wsl/-/is-wsl-2.1.1.tgz",
"integrity": "sha512-umZHcSrwlDHo2TGMXv0DZ8dIUGunZ2Iv68YZnrmCiBPkZ4aaOhtv7pXJKeki9k3qJ3RJr0cDyitcl5wEH3AYog==",
"dev": true,
"optional": true
"dev": true
},
"is2": {
"version": "2.0.1",
@@ -9308,6 +9327,12 @@
"dom-walk": "^0.1.0"
}
},
"min-indent": {
"version": "1.0.0",
"resolved": "https://registry.npmjs.org/min-indent/-/min-indent-1.0.0.tgz",
"integrity": "sha1-z8RcN+nsDY8KDsPdTvf3w6vjklY=",
"dev": true
},
"minimatch": {
"version": "3.0.4",
"resolved": "https://registry.npmjs.org/minimatch/-/minimatch-3.0.4.tgz",
@@ -9686,7 +9711,6 @@
"resolved": "https://registry.npmjs.org/node-notifier/-/node-notifier-6.0.0.tgz",
"integrity": "sha512-SVfQ/wMw+DesunOm5cKqr6yDcvUTDl/yc97ybGHMrteNEY6oekXpNpS3lZwgLlwz0FLgHoiW28ZpmBHUDg37cw==",
"dev": true,
"optional": true,
"requires": {
"growly": "^1.3.0",
"is-wsl": "^2.1.1",
@@ -9699,8 +9723,7 @@
"version": "6.3.0",
"resolved": "https://registry.npmjs.org/semver/-/semver-6.3.0.tgz",
"integrity": "sha512-b39TBaTSfV6yBrapU89p5fKekE2m/NwnDocOVruQFS1/veMgdzuPcnOM34M6CwxW8jH/lxEa5rBoDeUwu5HHTw==",
"dev": true,
"optional": true
"dev": true
}
}
},
@@ -12345,8 +12368,7 @@
"version": "0.1.1",
"resolved": "https://registry.npmjs.org/shellwords/-/shellwords-0.1.1.tgz",
"integrity": "sha512-vFwSUfQvqybiICwZY5+DAWIPLKsWO31Q91JSKl3UYv+K5c2QRPzn0qzec6QPu1Qc9eHYItiP3NdJqNVqetYAww==",
"dev": true,
"optional": true
"dev": true
},
"shimmer": {
"version": "1.2.1",
@@ -12960,6 +12982,29 @@
"integrity": "sha512-jRk7jdYULb9V4Z+0BKlfofombmdIIQph4leojrOSHzvZBRmCredz7fZsJBiUDLO6h83XYekuLbwfy5zx1i95GQ==",
"dev": true
},
"svelte-preprocess": {
"version": "3.4.0",
"resolved": "https://registry.npmjs.org/svelte-preprocess/-/svelte-preprocess-3.4.0.tgz",
"integrity": "sha512-XujaaZP777ivvlE+Oy8CnDySJRSWtWO2Okqa+gt93Xq92SLR0KwE9hLDPe0UzTwWEuMfIUi7xqAj9hAoub01tQ==",
"dev": true,
"requires": {
"@types/pug": "^2.0.4",
"@types/sass": "^1.16.0",
"detect-indent": "^6.0.0",
"strip-indent": "^3.0.0"
},
"dependencies": {
"strip-indent": {
"version": "3.0.0",
"resolved": "https://registry.npmjs.org/strip-indent/-/strip-indent-3.0.0.tgz",
"integrity": "sha512-laJTa3Jb+VQpaC6DseHhF7dXVqHTfJPCRDaEbid/drOhgitgYku/letMUqOXFoWV0zIIUbjpdH2t+tYj4bQMRQ==",
"dev": true,
"requires": {
"min-indent": "^1.0.0"
}
}
}
},
"sver-compat": {
"version": "1.5.0",
"resolved": "https://registry.npmjs.org/sver-compat/-/sver-compat-1.5.0.tgz",

+ 5
- 2
package.json View File

@@ -8,7 +8,7 @@
"export": "sapper export --legacy",
"start": "node __sapper__/build",
"test": "jest",
"testwatch": "jest --watch",
"testwatch": "jest --watch --notify",
"deploy": "npx sapper export && rsync -azzv __sapper__/export/ $DEP_USER@learnjsthehardway.com:/srv/http/www/learnjsthehardway.com/"
},
"dependencies": {
@@ -53,14 +53,17 @@
"gulp-sass": "^4.0.2",
"jest": "^25.1.0",
"jest-transform-stub": "^2.0.0",
"node-notifier": "^6.0.0",
"npm-run-all": "^4.1.5",
"pm2": "^4.2.3",
"pug": "^2.0.4",
"puppeteer": "^2.1.1",
"rollup": "^1.20.0",
"rollup-plugin-babel": "^4.0.2",
"rollup-plugin-svelte": "^5.0.1",
"rollup-plugin-terser": "^4.0.4",
"sapper": "^0.27.0",
"svelte": "^3.0.0"
"svelte": "^3.0.0",
"svelte-preprocess": "^3.4.0"
}
}

+ 7
- 2
rollup.config.js View File

@@ -6,6 +6,9 @@ import babel from 'rollup-plugin-babel';
import { terser } from 'rollup-plugin-terser';
import config from 'sapper/config/rollup.js';
import pkg from './package.json';
import autoPreprocess from 'svelte-preprocess';

const preprocopts = {};

const mode = process.env.NODE_ENV;
const dev = mode === 'development';
@@ -25,7 +28,8 @@ export default {
svelte({
dev,
hydratable: true,
emitCss: true
emitCss: true,
preprocess: autoPreprocess(preprocopts)
}),
resolve({
browser: true,
@@ -68,7 +72,8 @@ export default {
}),
svelte({
generate: 'ssr',
dev
dev,
preprocess: autoPreprocess(preprocopts)
}),
resolve({
dedupe: ['svelte']

+ 2
- 0
src/routes/auth/index.html View File

@@ -87,6 +87,8 @@
<div class="input-group">
<input class="form-input" data-testid="email" name="email" bind:value="{ email }" placeholder="Email"><br/>
<Submit testid="email-button" on:click="{request_auth}">Sign in</Submit>


</div>
{/if}
</div>

+ 31
- 31
src/routes/register/index.svelte View File

@@ -23,37 +23,37 @@ const register = (event) => {
}
</script>

<style>

<style lang="scss">
</style>

<template lang="pug">

div(class="container grid-lg" id="content")
div(class="columns" data-testid="register-page")
div(class="column col-sm-12 col-xs-12")
h1 Please Register
p We know nothing of your email {$session.user.email} so please register. Once you register you will have full access to the introductory free courses.
div(class="column col-6 col-sm-12 col-xs-12")
div(class="form-group")
label(class="form-label" for="full-name") Full Name
input(class="form-input" type="text" id="full-name" placeholder="Full Name")

label(class="form-label" for="email-const") Email
input(class="form-input" type="text" disabled value="{$session.user.email}")

label(class="form-switch")
input(type="checkbox")
i(class="form-icon")
| Send me emails with news and tips
label(class="form-checkbox")
input(type="checkbox")
i(class="form-icon")
| Agree to the ToS and Privacy Policy.
Submit(testid="register-submit" style="btn-lg" disabled="{form_valid == false}" on:click="{register}" icon="{form_valid ? 'check' : 'alert-circle'}") Register
</template>

<div class="container grid-lg" id="content">
<div class="columns" data-testid="register-page">
<div class="column col-6 col-sm-12 col-xs-12">

<h1>Please Register</h1>
<p>We know nothing of your email {$session.user.email} so please register. Once you register you will have full access to the introductory free courses.</p>
</div>

<div class="column col-6 col-sm-12 col-xs-12">
<div class="form-group">
<label class="form-label" for="full-name">Full Name</label>
<input class="form-input" type="text" id="full-name" placeholder="Full Name">
<label class="form-label" for="email-const">Email</label>
<input class="form-input" type="text" disabled value="{$session.user.email}">
<label class="form-switch">
<input type="checkbox">
<i class="form-icon"></i> Send me emails with news and tips
</label>
<div class="form-group">
<label class="form-checkbox">
<input type="checkbox">
<i class="form-icon"></i> Agree to the ToS and Privacy Policy.
</label>
</div>
<Submit testid="register-submit" style="btn-lg" disabled="{form_valid == false}" on:click="{register}" icon="{form_valid ? 'check' : 'alert-circle'}">Register</Submit>
</div>
</div>
</div>
</div>

Loading…
Cancel
Save