This commit is contained in:
tatianamac
2019-11-26 14:50:43 -08:00
parent 8a55660ed0
commit 6d5445ecc5
13894 changed files with 2233957 additions and 0 deletions

View File

@ -0,0 +1,35 @@
.hello-world {
margin: 200px 0;
font-size: 70px;
text-align: center;
}
.hello-world__i {
display: inline-block;
-webkit-animation: rotate 4000ms infinite linear;
animation: rotate 4000ms infinite linear;
}
@keyframes rotate {
from {
-webkit-transform: rotate(0);
transform: rotate(0);
}
to {
-webkit-transform: rotate(360deg);
transform: rotate(360deg);
}
}
@-webkit-keyframes rotate {
from {
-webkit-transform: rotate(0);
transform: rotate(0);
}
to {
-webkit-transform: rotate(360deg);
transform: rotate(360deg);
}
}

View File

@ -0,0 +1,16 @@
<!doctype html>
<html lang="en-US">
<head>
<meta charset="UTF-8">
<title>Browsersync, Webpack + Preact Hot Loader Example</title>
<link rel="stylesheet" href="css/main.css">
</head>
<body>
<h1>Browsersync, Webpack + Preact Hot Loader Example</h1>
<div id="preact-root"></div>
<script src="js/bundle.js"></script>
</body>
</html>

View File

@ -0,0 +1,14 @@
import {h, Component} from 'preact';
export default class HelloWorld extends Component {
render() {
// Play with it...
const name = 'World';
return (
<h2 className="hello-world">
<span className="hello-world__i">Hello, {name}</span>
</h2>
);
}
}

View File

@ -0,0 +1,16 @@
import {h, render} from 'preact';
if (module.hot) {
module.hot.accept('./HelloWorld.jsx', () => requestAnimationFrame(() => {
init();
}));
}
let root;
function init() {
const HellowWorld = require('./HelloWorld.jsx').default;
root = render(<HellowWorld />, document.getElementById('preact-root'), root);
}
init();