From b2d4714c903b403eb4c5cbe0d0d218769408188f Mon Sep 17 00:00:00 2001 From: Andrey Okonetchnikov Date: Thu, 15 Sep 2016 18:53:24 +0200 Subject: [PATCH] Integrated material-ui --- package.json | 6 ++++++ src/index.css | 2 ++ src/index.js | 5 +++-- src/material-icons.css | 35 +++++++++++++++++++++++++++++++++++ webpack.config.js | 9 ++++++++- 5 files changed, 54 insertions(+), 3 deletions(-) create mode 100644 src/material-icons.css diff --git a/package.json b/package.json index 5a578c53..a5e4846f 100644 --- a/package.json +++ b/package.json @@ -53,6 +53,7 @@ "lint-staged": "^3.0.2", "mocha": "^2.4.5", "moment": "^2.11.2", + "node-sass": "^3.10.0", "normalizr": "^2.0.0", "postcss-cssnext": "^2.7.0", "postcss-import": "^8.1.2", @@ -69,6 +70,7 @@ "react-router-redux": "^4.0.5", "redux": "^3.3.1", "redux-thunk": "^1.0.3", + "sass-loader": "^4.0.2", "style-loader": "^0.13.0", "url-loader": "^0.5.7", "webpack": "^1.13.2", @@ -80,11 +82,14 @@ "bricks.js": "^1.7.0", "dateformat": "^1.0.12", "fuzzy": "^0.1.1", + "immutability-helper": "^2.0.0", "js-base64": "^2.1.9", "json-loader": "^0.5.4", "localforage": "^1.4.2", "lodash": "^4.13.1", "markup-it": "git+https://github.com/cassiozen/markup-it.git", + "material-design-icons": "^3.0.1", + "normalize.css": "^4.2.0", "pluralize": "^3.0.0", "prismjs": "^1.5.1", "react-addons-css-transition-group": "^15.3.1", @@ -92,6 +97,7 @@ "react-dnd": "^2.1.4", "react-dnd-html5-backend": "^2.1.2", "react-portal": "^2.2.1", + "react-toolbox": "^1.2.1", "selection-position": "^1.0.0", "semaphore": "^1.0.5", "slate": "^0.13.6" diff --git a/src/index.css b/src/index.css index b4d39330..aae19802 100644 --- a/src/index.css +++ b/src/index.css @@ -1,3 +1,5 @@ +@import "material-icons.css"; + html { box-sizing: border-box; -ms-text-size-adjust: 100%; diff --git a/src/index.js b/src/index.js index ae127d1e..e7c8ffe1 100644 --- a/src/index.js +++ b/src/index.js @@ -1,9 +1,10 @@ import React from 'react'; import { render } from 'react-dom'; -import { AppContainer } from 'react-hot-loader' -import Root from './root' +import { AppContainer } from 'react-hot-loader'; +import Root from './root'; import registry from './lib/registry'; import 'file?name=index.html!../example/index.html'; +import 'react-toolbox/lib/commons.scss'; import './index.css'; // Create mount element dynamically diff --git a/src/material-icons.css b/src/material-icons.css new file mode 100644 index 00000000..a2807ad5 --- /dev/null +++ b/src/material-icons.css @@ -0,0 +1,35 @@ +@font-face { + font-family: 'Material Icons'; + font-style: normal; + font-weight: 400; + src: local('Material Icons'), + local('MaterialIcons-Regular'), + url('material-design-icons/iconfont/MaterialIcons-Regular.woff2') format('woff2'), + url('material-design-icons/iconfont/MaterialIcons-Regular.woff') format('woff'), + url('material-design-icons/iconfont/MaterialIcons-Regular.ttf') format('truetype'); +} + +:global .material-icons { + font-family: 'Material Icons'; + font-weight: normal; + font-style: normal; + font-size: 24px; /* Preferred icon size */ + display: inline-block; + line-height: 1; + text-transform: none; + letter-spacing: normal; + word-wrap: normal; + white-space: nowrap; + direction: ltr; + + /* Support for all WebKit browsers. */ + -webkit-font-smoothing: antialiased; + /* Support for Safari and Chrome. */ + text-rendering: optimizeLegibility; + + /* Support for Firefox. */ + -moz-osx-font-smoothing: grayscale; + + /* Support for IE. */ + font-feature-settings: 'liga'; +} diff --git a/webpack.config.js b/webpack.config.js index 94222a49..f58687d1 100644 --- a/webpack.config.js +++ b/webpack.config.js @@ -12,7 +12,14 @@ module.exports = { test: /\.((png)|(eot)|(woff)|(woff2)|(ttf)|(svg)|(gif))(\?v=\d+\.\d+\.\d+)?$/, loader: 'url-loader?limit=100000' }, - { test: /\.json$/, loader: 'json-loader' }, + { + test: /\.json$/, + loader: 'json-loader' + }, + { + test: /\.scss$/, + loader: 'style!css?modules!sass', + }, { test: /\.css$/, loader: 'style!css?modules&importLoaders=1&&localIdentName=cms__[name]__[local]!postcss',