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