-
Notifications
You must be signed in to change notification settings - Fork 17
/
index.html
72 lines (66 loc) · 4.33 KB
/
index.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
<!doctype html>
<html>
<head>
<title>Upgrade Bootstrap 2 HTML to Bootstrap 3 - Brought to you by Divshot</title>
<meta name="viewport" content="width=device-width">
<meta name="description" value="A handy reference guide and automated tool for upgrading from Bootstrap 2.3 to Bootstrap 3">
<link rel="stylesheet" href="https://netdna.bootstrapcdn.com/bootstrap/3.0.0-rc1/css/bootstrap.min.css">
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/2.0.0/jquery.min.js"></script>
<script type="text/javascript" src="https://netdna.bootstrapcdn.com/bootstrap/3.0.0-rc1/js/bootstrap.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.1.5/angular.min.js"></script>
<script src="lib/dom_html.js"></script>
<script src="src/upgrader.js"></script>
<script src="src/app.js"></script>
<style>
textarea.form-control { font-size: 11px; font-family: monospace; }
footer { margin: 30px 0; padding-top: 10px; border-top: 1px solid #ddd; }
.bs-upgrader-nav { background-color: #563d7c; }
.bs-upgrader-nav .navbar-brand { color: white; }
.bs-upgrader-nav .navbar-text, .bs-upgrader-nav .navbar-link { color: #edf; }
</style>
</head>
<body ng-app ng-controller="ConverterCtrl">
<header class="navbar navbar-static-top navbar-inverse bs-upgrader-nav">
<div class="container">
<a class="navbar-brand pull-left" href="index.html">Bootstrap Upgrader</a>
<div class="navbar-text pull-right">created by <a href="http://www.divshot.com" class="navbar-link">Divshot</a></div>
<div class="navbar-text pull-left visible-lg">Update your Bootstrap 2.3 HTML to be 3.0 compatible!</div>
<div class="navbar-text pull-right"><a href="https://twitter.com/share" class="twitter-share-button" data-via="divshot">Tweet</a>
<script>!function(d,s,id){var js,fjs=d.getElementsByTagName(s)[0],p=/^http:/.test(d.location)?'http':'https';if(!d.getElementById(id)){js=d.createElement(s);js.id=id;js.src=p+'://platform.twitter.com/widgets.js';fjs.parentNode.insertBefore(js,fjs);}}(document, 'script', 'twitter-wjs');</script></div>
</div>
</header>
<div class="container">
<div class="alert alert-warning"><a class="close" data-dismiss="alert">×</a> <b>Warning:</b> This tool should be considered a "best effort" and may have gaps. If something seems wonky, <a href="https://github.com/divshot/bootstrap3_upgrader/issues" class="alert-link"><b>report it on GitHub</b></a>!</div>
<p class='lead'>We've gone through the Bootstrap 3 documentation and tried our best to extract out all the changes into an automatic tool. These are the rules our automated upgrader takes when it modifies your HTML, but it's also a handy checklist to keep in mind if you're upgrading code manually!</p>
<div class="row">
<div class="col-lg-6">
<div class="panel panel-primary">
<div class="panel-heading">The Process</div>
<ul class="list-group list-group-flush">
<li class="list-group-item" ng-repeat="rule in rules">
<h4 class="list-group-item-heading">{{rule.title}} <span class="label pull-right" ng-class="rule.runClass" ng-show="hasRun">{{rule.runMessage}}</span></h4>
<div ng-bind-html-unsafe="rule.description"></div>
</li>
</ul>
</div>
</div>
<div class="col-lg-6">
<form ng-submit="runRules()"><div class="panel panel-warning">
<div class="panel-heading">Source HTML
</div>
<textarea id="source" class="form-control" rows="10" ng-model="source"></textarea>
<div class="panel-footer"><button type="submit" class="btn btn-success btn-block">Convert This Code</button></div>
</div></form>
<div class="panel panel-success">
<div class="panel-heading">Result HTML
</div>
<textarea id="result" class="form-control" rows="16" ng-model="result"></textarea>
</div>
</div>
</div>
<footer>
<p class='text-muted text-center'>Brought to you by your Bootstrap-loving friends at <a href="http://www.divshot.com/">Divshot</a>. <a href="https://github.com/divshot/bootstrap3_upgrader">Fork this on GitHub</a>.</p>
</footer>
</div>
</body>
</html>