From 8fccf114f59f876c078c65a426afe4b1c7ba21e6 Mon Sep 17 00:00:00 2001 From: Peter Cai Date: Mon, 17 Feb 2020 21:14:05 +0800 Subject: [PATCH] basic style for the home component at least it looks okay now. let's implement all the other stuff later --- package-lock.json | 187 ++++++++++++++++++++++++++++++++++++++ package.json | 3 + src/web/assets/spikes.png | Bin 0 -> 15676 bytes src/web/home.coffee | 14 +++ src/web/index.coffee | 6 +- src/web/styles/home.css | 28 ++++++ src/web/styles/index.css | 4 + webpack.config.web.js | 10 +- 8 files changed, 248 insertions(+), 4 deletions(-) create mode 100644 src/web/assets/spikes.png create mode 100644 src/web/home.coffee create mode 100644 src/web/styles/home.css create mode 100644 src/web/styles/index.css diff --git a/package-lock.json b/package-lock.json index f026e50..e908681 100644 --- a/package-lock.json +++ b/package-lock.json @@ -2012,6 +2012,38 @@ "randomfill": "^1.0.3" } }, + "css-loader": { + "version": "3.4.2", + "resolved": "https://registry.npm.taobao.org/css-loader/download/css-loader-3.4.2.tgz?cache=0&sync_timestamp=1578676111891&other_urls=https%3A%2F%2Fregistry.npm.taobao.org%2Fcss-loader%2Fdownload%2Fcss-loader-3.4.2.tgz", + "integrity": "sha1-0/2zNYtD8jO3hQHF7XscbaYTMgI=", + "dev": true, + "requires": { + "camelcase": "^5.3.1", + "cssesc": "^3.0.0", + "icss-utils": "^4.1.1", + "loader-utils": "^1.2.3", + "normalize-path": "^3.0.0", + "postcss": "^7.0.23", + "postcss-modules-extract-imports": "^2.0.0", + "postcss-modules-local-by-default": "^3.0.2", + "postcss-modules-scope": "^2.1.1", + "postcss-modules-values": "^3.0.0", + "postcss-value-parser": "^4.0.2", + "schema-utils": "^2.6.0" + }, + "dependencies": { + "schema-utils": { + "version": "2.6.4", + "resolved": "https://registry.npm.taobao.org/schema-utils/download/schema-utils-2.6.4.tgz?cache=0&other_urls=https%3A%2F%2Fregistry.npm.taobao.org%2Fschema-utils%2Fdownload%2Fschema-utils-2.6.4.tgz", + "integrity": "sha1-on779uTnhonZGHLuPM+lfXvdD1M=", + "dev": true, + "requires": { + "ajv": "^6.10.2", + "ajv-keywords": "^3.4.1" + } + } + } + }, "css-select": { "version": "1.2.0", "resolved": "https://registry.npmjs.org/css-select/-/css-select-1.2.0.tgz", @@ -2030,6 +2062,12 @@ "integrity": "sha512-a+EPoD+uZiNfh+5fxw2nO9QwFa6nJe2Or35fGY6Ipw1R3R4AGz1d1TEZrCegvw2YTmZ0jXirGYlzxxpYSHwpEg==", "dev": true }, + "cssesc": { + "version": "3.0.0", + "resolved": "https://registry.npm.taobao.org/cssesc/download/cssesc-3.0.0.tgz", + "integrity": "sha1-N3QZGZA7hoVl4cCep0dEXNGJg+4=", + "dev": true + }, "cyclist": { "version": "1.0.1", "resolved": "https://registry.npmjs.org/cyclist/-/cyclist-1.0.1.tgz", @@ -3537,6 +3575,15 @@ "integrity": "sha1-7AbBDgo0wPL68Zn3/X/Hj//QPHM=", "dev": true }, + "icss-utils": { + "version": "4.1.1", + "resolved": "https://registry.npm.taobao.org/icss-utils/download/icss-utils-4.1.1.tgz", + "integrity": "sha1-IRcLU3ie4nRHwvR91oMIFAP5pGc=", + "dev": true, + "requires": { + "postcss": "^7.0.14" + } + }, "ieee754": { "version": "1.1.13", "resolved": "https://registry.npmjs.org/ieee754/-/ieee754-1.1.13.tgz", @@ -3565,6 +3612,12 @@ "integrity": "sha1-khi5srkoojixPcT7a21XbyMUU+o=", "dev": true }, + "indexes-of": { + "version": "1.0.1", + "resolved": "https://registry.npm.taobao.org/indexes-of/download/indexes-of-1.0.1.tgz", + "integrity": "sha1-8w9xbI4r00bHtn0985FVZqfAVgc=", + "dev": true + }, "infer-owner": { "version": "1.0.4", "resolved": "https://registry.npmjs.org/infer-owner/-/infer-owner-1.0.4.tgz", @@ -4039,6 +4092,12 @@ "brorand": "^1.0.1" } }, + "mime": { + "version": "2.4.4", + "resolved": "https://registry.npm.taobao.org/mime/download/mime-2.4.4.tgz", + "integrity": "sha1-vXuRE1/GsBzePpuuM9ZZtj2IV+U=", + "dev": true + }, "mimic-fn": { "version": "2.1.0", "resolved": "https://registry.npmjs.org/mimic-fn/-/mimic-fn-2.1.0.tgz", @@ -4554,6 +4613,83 @@ "integrity": "sha1-AerA/jta9xoqbAL+q7jB/vfgDqs=", "dev": true }, + "postcss": { + "version": "7.0.26", + "resolved": "https://registry.npm.taobao.org/postcss/download/postcss-7.0.26.tgz?cache=0&sync_timestamp=1577751092087&other_urls=https%3A%2F%2Fregistry.npm.taobao.org%2Fpostcss%2Fdownload%2Fpostcss-7.0.26.tgz", + "integrity": "sha1-XtYVz8qzW6m7uCQUpPqI6hBClYc=", + "dev": true, + "requires": { + "chalk": "^2.4.2", + "source-map": "^0.6.1", + "supports-color": "^6.1.0" + }, + "dependencies": { + "source-map": { + "version": "0.6.1", + "resolved": "https://registry.npm.taobao.org/source-map/download/source-map-0.6.1.tgz", + "integrity": "sha1-dHIq8y6WFOnCh6jQu95IteLxomM=", + "dev": true + } + } + }, + "postcss-modules-extract-imports": { + "version": "2.0.0", + "resolved": "https://registry.npm.taobao.org/postcss-modules-extract-imports/download/postcss-modules-extract-imports-2.0.0.tgz", + "integrity": "sha1-gYcZoa4doyX5gyRGsBE27rSTzX4=", + "dev": true, + "requires": { + "postcss": "^7.0.5" + } + }, + "postcss-modules-local-by-default": { + "version": "3.0.2", + "resolved": "https://registry.npm.taobao.org/postcss-modules-local-by-default/download/postcss-modules-local-by-default-3.0.2.tgz", + "integrity": "sha1-6KZWG+kUqvPAUodjd1JMqQ27eRU=", + "dev": true, + "requires": { + "icss-utils": "^4.1.1", + "postcss": "^7.0.16", + "postcss-selector-parser": "^6.0.2", + "postcss-value-parser": "^4.0.0" + } + }, + "postcss-modules-scope": { + "version": "2.1.1", + "resolved": "https://registry.npm.taobao.org/postcss-modules-scope/download/postcss-modules-scope-2.1.1.tgz?cache=0&sync_timestamp=1574936968130&other_urls=https%3A%2F%2Fregistry.npm.taobao.org%2Fpostcss-modules-scope%2Fdownload%2Fpostcss-modules-scope-2.1.1.tgz", + "integrity": "sha1-M9T8lGYC616TVcQWXWihBydonbo=", + "dev": true, + "requires": { + "postcss": "^7.0.6", + "postcss-selector-parser": "^6.0.0" + } + }, + "postcss-modules-values": { + "version": "3.0.0", + "resolved": "https://registry.npm.taobao.org/postcss-modules-values/download/postcss-modules-values-3.0.0.tgz", + "integrity": "sha1-W1AA1uuuKbQlUwG0o6VFdEI+fxA=", + "dev": true, + "requires": { + "icss-utils": "^4.0.0", + "postcss": "^7.0.6" + } + }, + "postcss-selector-parser": { + "version": "6.0.2", + "resolved": "https://registry.npm.taobao.org/postcss-selector-parser/download/postcss-selector-parser-6.0.2.tgz?cache=0&other_urls=https%3A%2F%2Fregistry.npm.taobao.org%2Fpostcss-selector-parser%2Fdownload%2Fpostcss-selector-parser-6.0.2.tgz", + "integrity": "sha1-k0z3mdAWyDQRhZ4J3Oyt4BKG7Fw=", + "dev": true, + "requires": { + "cssesc": "^3.0.0", + "indexes-of": "^1.0.1", + "uniq": "^1.0.1" + } + }, + "postcss-value-parser": { + "version": "4.0.2", + "resolved": "https://registry.npm.taobao.org/postcss-value-parser/download/postcss-value-parser-4.0.2.tgz", + "integrity": "sha1-SCKCwJpCcG0fyaBptz9E7Ag5Hck=", + "dev": true + }, "pretty-error": { "version": "2.1.1", "resolved": "https://registry.npmjs.org/pretty-error/-/pretty-error-2.1.1.tgz", @@ -5399,6 +5535,28 @@ "integrity": "sha1-u0P/VZim6wXYm1n80SnJgzE2Br8=", "dev": true }, + "style-loader": { + "version": "1.1.3", + "resolved": "https://registry.npm.taobao.org/style-loader/download/style-loader-1.1.3.tgz", + "integrity": "sha1-noJuacaDxNm/nbkk+F6auzDV4gA=", + "dev": true, + "requires": { + "loader-utils": "^1.2.3", + "schema-utils": "^2.6.4" + }, + "dependencies": { + "schema-utils": { + "version": "2.6.4", + "resolved": "https://registry.npm.taobao.org/schema-utils/download/schema-utils-2.6.4.tgz?cache=0&other_urls=https%3A%2F%2Fregistry.npm.taobao.org%2Fschema-utils%2Fdownload%2Fschema-utils-2.6.4.tgz", + "integrity": "sha1-on779uTnhonZGHLuPM+lfXvdD1M=", + "dev": true, + "requires": { + "ajv": "^6.10.2", + "ajv-keywords": "^3.4.1" + } + } + } + }, "supports-color": { "version": "6.1.0", "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-6.1.0.tgz", @@ -5619,6 +5777,12 @@ "set-value": "^2.0.1" } }, + "uniq": { + "version": "1.0.1", + "resolved": "https://registry.npm.taobao.org/uniq/download/uniq-1.0.1.tgz", + "integrity": "sha1-sxxa6CVIRKOoKBVBzisEuGWnNP8=", + "dev": true + }, "unique-filename": { "version": "1.1.1", "resolved": "https://registry.npmjs.org/unique-filename/-/unique-filename-1.1.1.tgz", @@ -5722,6 +5886,29 @@ } } }, + "url-loader": { + "version": "3.0.0", + "resolved": "https://registry.npm.taobao.org/url-loader/download/url-loader-3.0.0.tgz?cache=0&sync_timestamp=1574768599602&other_urls=https%3A%2F%2Fregistry.npm.taobao.org%2Furl-loader%2Fdownload%2Furl-loader-3.0.0.tgz", + "integrity": "sha1-nx8Rs3Gs9uUe0VpQ22NeAu7Bg2g=", + "dev": true, + "requires": { + "loader-utils": "^1.2.3", + "mime": "^2.4.4", + "schema-utils": "^2.5.0" + }, + "dependencies": { + "schema-utils": { + "version": "2.6.4", + "resolved": "https://registry.npm.taobao.org/schema-utils/download/schema-utils-2.6.4.tgz?cache=0&other_urls=https%3A%2F%2Fregistry.npm.taobao.org%2Fschema-utils%2Fdownload%2Fschema-utils-2.6.4.tgz", + "integrity": "sha1-on779uTnhonZGHLuPM+lfXvdD1M=", + "dev": true, + "requires": { + "ajv": "^6.10.2", + "ajv-keywords": "^3.4.1" + } + } + } + }, "use": { "version": "3.1.1", "resolved": "https://registry.npmjs.org/use/-/use-3.1.1.tgz", diff --git a/package.json b/package.json index e6dabe8..da8e258 100644 --- a/package.json +++ b/package.json @@ -20,6 +20,7 @@ "babel-loader": "^8.0.6", "coffee-loader": "^0.9.0", "coffeescript": "^2.5.1", + "css-loader": "^3.4.2", "fast-xml-parser": "^3.16.0", "html-webpack-inline-source-plugin": "0.0.10", "html-webpack-plugin": "^3.2.0", @@ -27,6 +28,8 @@ "raw-loader": "^4.0.0", "react": "^16.12.0", "react-dom": "^16.12.0", + "style-loader": "^1.1.3", + "url-loader": "^3.0.0", "webpack": "^4.41.6", "webpack-cli": "^3.3.11" } diff --git a/src/web/assets/spikes.png b/src/web/assets/spikes.png new file mode 100644 index 0000000000000000000000000000000000000000..742aa60b6727511a974b43d9fc1eae45cbdec730 GIT binary patch literal 15676 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 + super props + + render: -> +
+
+
+
+ +export default Home \ No newline at end of file diff --git a/src/web/index.coffee b/src/web/index.coffee index cae493e..e756225 100644 --- a/src/web/index.coffee +++ b/src/web/index.coffee @@ -1,9 +1,9 @@ import React from "react" import ReactDOM from "react-dom" +import "./styles/index.css" +import Home from "./home" elem = document.createElement "div" document.body.appendChild elem -ReactDOM.render
-

Hello, world

-
, elem \ No newline at end of file +ReactDOM.render , elem \ No newline at end of file diff --git a/src/web/styles/home.css b/src/web/styles/home.css new file mode 100644 index 0000000..66d3669 --- /dev/null +++ b/src/web/styles/home.css @@ -0,0 +1,28 @@ +.content-wrapper { + width: 100vw; + padding-top: 100px; + padding-bottom: 100px; + background-image: url('../assets/spikes.png'); + background-repeat: repeat; + text-align: center; +} + +.content { + display: inline-block; + background-color: #FFFFFF; + width: 1000px; + height: 600px; + box-shadow: 0 2px 5px 5px rgba(0, 0, 0, 0.15); + border-radius: 20px; +} + +/* + * 800 = 600 + 200 + */ +@media screen and ( min-height: 800px ) { + .content-wrapper { + max-height: 100vh; + padding-top: calc((100vh - 600px) / 2); + padding-bottom: calc((100vh - 600px) / 2); + } +} \ No newline at end of file diff --git a/src/web/styles/index.css b/src/web/styles/index.css new file mode 100644 index 0000000..4b72c98 --- /dev/null +++ b/src/web/styles/index.css @@ -0,0 +1,4 @@ +body, html { + margin: 0px; + padding: 0px; +} \ No newline at end of file diff --git a/webpack.config.web.js b/webpack.config.web.js index 9cbf789..d9be898 100644 --- a/webpack.config.web.js +++ b/webpack.config.web.js @@ -5,7 +5,7 @@ var path = require("path") module.exports = { target: "web", entry: "./index-web.js", - mode: "production", + mode: "development", output: { path: path.resolve(__dirname, "./worker"), filename: "web.js" @@ -26,6 +26,14 @@ module.exports = { ], module: { rules: [ + { + test: /\.css$/, + use: [ 'style-loader', 'css-loader' ] + }, + { + test: /\.(png|jpg|gif)$/, + use: [ 'url-loader' ] + }, { test: /\.coffee$/, use: [ 'babel-loader', 'coffee-loader' ]