2020-05-19 11:43:42 +03:00

60 lines
1.7 KiB
HTML

<!doctype html>
<html>
<head>
<title>angular-react hello example</title>
<link rel="stylesheet" href="http://yui.yahooapis.com/pure/0.5.0/pure-min.css">
<style>
.content {
margin: 0 auto;
padding: 0 2em;
max-width: 800px;
margin-bottom: 50px;
line-height: 2em;
}
.header {
max-width: 768px;
margin: 0 auto;
padding: 1em;
text-align: center;
background: #fff;
}
.header h1 {
font-size: 300%;
font-weight: 100;
margin: 0;
margin-bottom: 40px;
}
.header small {
font-size: 16px;
}
</style>
</head>
<body ng-controller="mainCtrl">
<div class="content">
<div class="header">
<h1>
<div><hello fname="person.fname" lname="person.lname"/></div>
<small>
<code>&lt;hello fname="person.fname" lname="person.lname"/&gt;</code>
</small>
</h1>
</div>
<form class="pure-form">
<fieldset>
<legend>Enter Name</legend>
<input type="text" ng-model="person.fname" placeholder="First Name"/>
<input type="text" ng-model="person.lname" placeholder="Last Name"/>
</fieldset>
</form>
</div>
<script src="../../bower_components/angular/angular.js"></script>
<script src="../../bower_components/react/react.js"></script>
<script src="../../bower_components/react/react-dom.js"></script>
<script src="../../bower_components/react/JSXTransformer.js"></script>
<script src="../../ngReact.js"></script>
<script src="Hello.jsx" type="text/jsx"></script>
<script src="app.js"></script>
</body>
</html>