From 6dc4eccd564910d9bd3109c738266acc59a5482b Mon Sep 17 00:00:00 2001 From: Mashiro Date: Sun, 3 Nov 2019 03:03:07 +0800 Subject: [PATCH] auto commit 11/03/2019 Sun --- index.html | 20 ++++++++++++++++++++ package-lock.json | 4 ++-- package.json | 5 ++++- src/scss/components/mdc.scss | 2 -- src/scss/index.scss | 3 ++- src/scss/layouts/pageContent.scss | 2 +- src/scss/variables.scss | 14 +++++--------- src/ts/components/MDCHandler.ts | 22 +++++++++++----------- src/ts/components/index.ts | 1 - 9 files changed, 45 insertions(+), 28 deletions(-) delete mode 100644 src/ts/components/index.ts diff --git a/index.html b/index.html index d8d30fc..7bec225 100644 --- a/index.html +++ b/index.html @@ -46,6 +46,7 @@
+
+ + + + + + +
+
diff --git a/package-lock.json b/package-lock.json index a5f6a85..4daa703 100644 --- a/package-lock.json +++ b/package-lock.json @@ -1375,8 +1375,8 @@ }, "@material/textfield": { "version": "3.2.0", - "resolved": "https://registry.npmjs.org/@material/textfield/-/textfield-3.2.0.tgz", - "integrity": "sha512-xPWDkTzurMOxvH0+DsenzboF7dFoUeLcbqX/9vyhWe3aPlO6ZWFNn3lAmYN24ElqR5FEr5zXNYfeIQ4JLT5mYw==", + "resolved": "https://registry.npm.taobao.org/@material/textfield/download/@material/textfield-3.2.0.tgz", + "integrity": "sha1-xCcmAfmlfyb9f86LMIml1dZZWtE=", "requires": { "@material/animation": "^3.1.0", "@material/base": "^3.1.0", diff --git a/package.json b/package.json index 3b0036e..26ed227 100644 --- a/package.json +++ b/package.json @@ -10,6 +10,7 @@ "@material/layout-grid": "^3.1.0", "@material/line-ripple": "^3.1.0", "@material/ripple": "^3.2.0", + "@material/textfield": "^3.2.0", "@material/theme": "^3.1.0", "css-loader": "^3.2.0", "extract-loader": "^3.1.0", @@ -35,8 +36,10 @@ "uglifyjs-webpack-plugin": "^2.2.0" }, "scripts": { - "test": "echo \"Error: no test specified\" && exit 1", + "test_dafault": "echo \"Error: no test specified\" && exit 1", + "test": "rm -rf dist && mkdir dist", "start": "webpack-dev-server", + "dev": "webpack-dev-server", "build": "webpack", "clean": "rm dist/*" }, diff --git a/src/scss/components/mdc.scss b/src/scss/components/mdc.scss index 65c726b..17b93c7 100644 --- a/src/scss/components/mdc.scss +++ b/src/scss/components/mdc.scss @@ -1,3 +1 @@ -@import "@material/layout-grid/mdc-layout-grid"; -@import "@material/button/mdc-button"; @import "@material/textfield/mdc-text-field"; diff --git a/src/scss/index.scss b/src/scss/index.scss index 86dc837..f2ffba8 100644 --- a/src/scss/index.scss +++ b/src/scss/index.scss @@ -1,7 +1,8 @@ @import "./variables.scss"; @import "./components/normalize.scss"; -//@import "./components/mdc.scss"; + +@import "./components/mdc.scss"; //test @import "./layouts/header.scss"; @import "./layouts/coverImage.scss"; diff --git a/src/scss/layouts/pageContent.scss b/src/scss/layouts/pageContent.scss index 1e08d50..489d1b6 100644 --- a/src/scss/layouts/pageContent.scss +++ b/src/scss/layouts/pageContent.scss @@ -15,7 +15,7 @@ .main-center { height: 100%; width: 800px; - background: yellowgreen; + background: #9acd3220; } .side-bar-left { diff --git a/src/scss/variables.scss b/src/scss/variables.scss index 6d217fb..71ac6db 100644 --- a/src/scss/variables.scss +++ b/src/scss/variables.scss @@ -1,12 +1,8 @@ /* * MDC varibles - * must using before import + * must before import */ -// $mdc-theme-primary: #fcb8ab; -// $mdc-theme-secondary: #feeae6; -// $mdc-theme-on-primary: #442b2d; -// $mdc-theme-on-secondary: #442b2d; -// $mdc-theme-surface: #fedbd0; -// $mdc-theme-background: #feeae6; -// $mdc-theme-on-surface: #442c2e; -// $mdc-theme-on-background: #442c2e; \ No newline at end of file + $mdc-theme-primary: #fcb8ab; + $mdc-theme-secondary: #feeae6; + $mdc-theme-on-primary: #442b2d; + $mdc-theme-on-secondary: #442b2d; \ No newline at end of file diff --git a/src/ts/components/MDCHandler.ts b/src/ts/components/MDCHandler.ts index 10404c5..41321b8 100644 --- a/src/ts/components/MDCHandler.ts +++ b/src/ts/components/MDCHandler.ts @@ -3,20 +3,20 @@ * @author Mashiro * @since 19/11/1 */ -import { MDCRipple } from '@material/ripple/index' +import { MDCRipple } from '@material/ripple' import { MDCTextField } from '@material/textfield' import { MDCTopAppBar } from '@material/top-app-bar' export default function () { - interface LooseObject { - [key: string]: any - } + // const textField = new MDCTextField(document.querySelector('.mdc-text-field')) + + //const ripple = new MDCRipple(document.querySelector('.mdc-button')) + MDCRipple.attachTo(document.querySelector('.demo-card__primary-action')) + MDCRipple.attachTo(document.querySelector('.mdc-button')) + + // const topAppBar = new MDCTopAppBar(document.querySelector('.mdc-top-app-bar')) - let MDC: LooseObject = {} - - const topAppBarElement = document.querySelector('.mdc-top-app-bar') - const topAppBar = new MDCTopAppBar(topAppBarElement) - - // const textField = new MDCRipple(document.querySelector('.mdc-button')) - // if(textField) const textField = new MDCTextField(document.querySelector('.mdc-text-field')) + const textField = [].map.call(document.querySelectorAll('.mdc-text-field'), function (el) { + return new MDCTextField(el) + }) } \ No newline at end of file diff --git a/src/ts/components/index.ts b/src/ts/components/index.ts deleted file mode 100644 index 2cdc52e..0000000 --- a/src/ts/components/index.ts +++ /dev/null @@ -1 +0,0 @@ -export * from './MDCHandler'; \ No newline at end of file