Skip to content

Commit 3d0daad

Browse files
pgrimardpgrimard
committed
Update example and docs
1 parent 04a0a3b commit 3d0daad

13 files changed

+2977
-191
lines changed

‎docs/fonts/674f50d287a8c48dc19ba404d20fe713.eot

162 KB
Binary file not shown.

‎docs/fonts/912ec66d7572ff821749319396470bde.svg

Lines changed: 2671 additions & 0 deletions
Loading

‎docs/fonts/af7ae505a9eed503f8b8e6982036873e.woff2

75.4 KB
Binary file not shown.

‎docs/fonts/b06871f281fee6b241d60582ae9369b9.ttf

162 KB
Binary file not shown.

‎docs/fonts/fee66e712a8a08eef5805a46892932ad.woff

95.7 KB
Binary file not shown.

‎docs/index.html

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1 +1 @@
1-
<!doctype html><html lang="en"><head><meta charset="utf-8"><title></title><meta name="description" content=""><meta name="viewport" content="width=device-width,initial-scale=1"></head><body><div id="app"></div><script type="text/javascript" src="scripts/bundle.min.js"></script></body></html>
1+
<!doctype html><html lang="en"><head><meta charset="utf-8"><title></title><meta name="description" content=""><meta name="viewport" content="width=device-width,initial-scale=1"></head><body><div class="container" id="app"></div><script type="text/javascript" src="scripts/bundle.min.js"></script></body></html>

‎docs/scripts/bundle.min.js

Lines changed: 263 additions & 175 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎example/css/styles.css

Lines changed: 0 additions & 1 deletion
This file was deleted.

‎example/css/styles.scss

Lines changed: 4 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,4 @@
1+
$fa-font-path: '/fonts';
2+
@import "../node_modules/react-toggle-switch/dist/css/switch.min.css";
3+
@import "../node_modules/bootstrap/dist/css/bootstrap.min.css";
4+
@import "../node_modules/font-awesome/css/font-awesome.min.css";

‎example/index.html

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -8,7 +8,7 @@
88
</head>
99
<body>
1010

11-
<div id="app"></div>
11+
<div class="container" id="app"></div>
1212
<script type="text/javascript" src="scripts/bundle.min.js"></script>
1313
</body>
1414
</html>

‎example/package.json

Lines changed: 6 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -21,14 +21,20 @@
2121
"clean-css-cli": "^4.1.10",
2222
"css-loader": "^0.28.7",
2323
"extract-text-webpack-plugin": "^3.0.0",
24+
"file-loader": "^0.11.2",
2425
"html-webpack-plugin": "^2.30.1",
26+
"node-sass": "^4.5.3",
2527
"postcss-loader": "^2.0.6",
2628
"rimraf": "^2.6.2",
29+
"sass-loader": "^6.0.6",
2730
"style-loader": "^0.18.2",
31+
"url-loader": "^0.5.9",
2832
"webpack": "^3.6.0"
2933
},
3034
"author": "Patrick Grimard <pgrimard@gmail.com>",
3135
"dependencies": {
36+
"bootstrap": "^4.0.0-beta",
37+
"font-awesome": "^4.7.0",
3238
"react": "^15.6.1",
3339
"react-dom": "^15.6.1",
3440
"react-toggle-switch": "file:///Users/Patrick/IdeaProjects/react-toggle-switch"

‎example/scripts/index.js

Lines changed: 28 additions & 12 deletions
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,7 @@
11
import React, {Component} from 'react';
22
import {render} from 'react-dom';
33
import Switch from 'react-toggle-switch';
4-
import 'styles/styles.css';
4+
import 'styles/styles.scss';
55

66
class Example extends Component {
77
constructor(props) {
@@ -13,20 +13,36 @@ class Example extends Component {
1313

1414
render() {
1515
return (
16-
<div>
17-
<p>Basic</p>
18-
<Switch onClick={() => this.setState({on: !this.state.on})} on={this.state.on}/>
16+
<div className="row">
17+
<div className="card col-sm">
18+
<div className="card-body">
19+
<p>Basic</p>
20+
<Switch onClick={() => this.setState({on: !this.state.on})} on={this.state.on}/>
21+
</div>
22+
</div>
1923

20-
<p>With Children</p>
21-
<Switch onClick={() => this.setState({on: !this.state.on})} on={this.state.on}>
22-
<div>i</div>
23-
</Switch>
24+
<div className="card col-sm">
25+
<div className="card-body">
26+
<p>With Children</p>
27+
<Switch onClick={() => this.setState({on: !this.state.on})} on={this.state.on}>
28+
<i className="fa fa-bolt text-center"></i>
29+
</Switch>
30+
</div>
31+
</div>
2432

25-
<p>Disabled</p>
26-
<Switch onClick={() => this.setState({on: !this.state.on})} on={this.state.on} enabled={false}/>
33+
<div className="card col-sm">
34+
<div className="card-body">
35+
<p>Disabled</p>
36+
<Switch onClick={() => this.setState({on: !this.state.on})} on={this.state.on} enabled={false}/>
37+
</div>
38+
</div>
2739

28-
<p>Custom Classnames</p>
29-
<Switch onClick={() => this.setState({on: !this.state.on})} on={this.state.on} className="other-class"/>
40+
<div className="card col-sm">
41+
<div className="card-body">
42+
<p>Custom Classnames</p>
43+
<Switch onClick={() => this.setState({on: !this.state.on})} on={this.state.on} className="other-class"/>
44+
</div>
45+
</div>
3046
</div>
3147
);
3248
}

‎example/webpack.config.babel.js

Lines changed: 3 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -50,7 +50,9 @@ module.exports = {
5050
module: {
5151
loaders: [
5252
{test: /\.js$/, exclude: /node_modules/, loader: 'babel-loader'},
53-
{test: /\.css$/, exclude: /node_modules/, loader: 'style-loader!css-loader'}
53+
{test: /\.(css|scss)$/, exclude: /node_modules/, loader: 'style-loader!css-loader!sass-loader'},
54+
{test: /\.woff(2)?(\?v=[0-9]\.[0-9]\.[0-9])?$/, loader: "url-loader?limit=10000&mimetype=application/font-woff&outputPath=../docs/fonts/"},
55+
{test: /\.(ttf|eot|svg)(\?v=[0-9]\.[0-9]\.[0-9])?$/, loader: "file-loader?outputPath=../docs/fonts/"}
5456
]
5557
},
5658
plugins: [

0 commit comments

Comments
 (0)