forked from kdzwinel/SnappySnippet
-
Notifications
You must be signed in to change notification settings - Fork 10
/
panel.html
143 lines (132 loc) · 7.05 KB
/
panel.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
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link href="css/bootstrap/css/bootstrap.css" rel="stylesheet">
<link href="css/css/flat-ui.css" rel="stylesheet">
<link href="css/panel.css" rel="stylesheet">
</head>
<body>
<div class="container">
<div class="row" id='main-button-row'>
<div class="col-xs-12">
<div id='error-box'>
<div class='alert alert-danger'><p><span class="fui-cross"></span> <strong>Error!</strong> <span class='error-message'></span></p></div>
</div>
<button id='create' class='btn btn-primary'><span class='fui-gear'></span> Create a snippet from inspected element</button>
</div>
</div>
<div class="row" id='textareas-row'>
<div class="col-xs-6">
<span class="label label-warning">HTML</span>
<textarea id='html' readonly class="form-control input-sm"></textarea>
</div>
<div class="col-xs-6">
<span class="label label-warning">CSS</span>
<textarea id='css' readonly class="form-control input-sm"></textarea>
</div>
</div>
<div class="row">
<div class="panel-group col-xs-12" id="accordion">
<div class="panel panel-default">
<div class="panel-heading">
<h4 class="panel-title">
<a class="accordion-toggle" data-toggle="collapse" data-parent="#accordion" href="#settings">
<span class="fui-list"></span> Settings
</a>
</h4>
</div>
<div id="settings" class="panel-collapse collapse">
<div class="accordion-inner">
<ul>
<li><label class="checkbox">
<input type='checkbox' checked="checked" id='properties-clean-up'/> Keep only shorthand
properties (e.g. keeps "border", but removes "border-width")
</label></li>
<li><label class="checkbox">
<input type='checkbox' checked="checked" id='remove-default-values'/> Remove properties
with default browser values
</label></li>
<li><label class="checkbox">
<input type='checkbox' checked="checked" id='remove-webkit-properties'/> Remove
everything prefixed with "-webkit"
</label></li>
<li><label class="checkbox">
<input type='checkbox' checked="checked" id='combine-same-rules'/> Combine same rules
together
</label></li>
<li><label class="checkbox">
<input type='checkbox' checked="checked" id='fix-html-indentation'/> Format and clean up
HTML
</label></li>
</ul>
</div>
</div>
</div>
<div class="panel panel-default">
<div class="panel-heading">
<h4 class="panel-title">
<a class="accordion-toggle" data-toggle="collapse" data-parent="#accordion" href="#about">
<span class="fui-heart"></span> Get help, give feedback & about
</a>
</h4>
</div>
<div id="about" class="panel-collapse collapse">
<ul>
<li>You can report errors, request new features and fork the code on <a href="https://github.com/kdzwinel/SnappySnippet" target="_blank">GitHub</a>.</li>
<li>Projects used:
<a href="http://getbootstrap.com" target="_blank">Bootstrap</a>,
<a href="http://designmodo.github.io/Flat-UI/" target="_blank">Flat-UI</a>,
<a href="https://code.google.com/p/jquery-clean/" target="_blank">jquery-clean</a>
</li>
<li>Inspiration: <a href="http://stackoverflow.com/questions/4911338/tools-to-selectively-copy-htmlcssjs-from-existing-sites" target="_blank">StackOverflow question by qntmfred</a></li>
<li>Author: Konrad Dzwinel (<a href="mailto:[email protected]" target="_blank">mail me!</a>)</li>
</ul>
</div>
</div>
</div>
</div>
<div class="row" id='export-buttons-row'>
<div class="col-xs-6">
<form action="http://codepen.io/pen/define" method="POST" target="_blank" id='codepen-form'>
<input type="hidden" name="data" value=''/>
<button type='submit' class='btn btn-primary'><span class="fui-mail"></span> Send to CodePen</button>
</form>
</div>
<div class="col-xs-6">
<form action="http://jsfiddle.net/api/post/library/pure/" method="POST" target="_blank" id='jsfiddle-form'>
<input type="hidden" name="html" value=''/>
<input type="hidden" name="css" value=''/>
<button type='submit' class='btn btn-primary'><span class="fui-mail"></span> Send to jsFiddle</button>
</form>
</div>
</div>
</div>
<div id="social-buttons">
<a href='http://www.facebook.com/plugins/like.php?href=https%3A%2F%2Fchrome.google.com%2Fwebstore%2Fdetail%2Fsnappysnippet%2Fblfngdefapoapkcdibbdkigpeaffgcil&width=450&height=80&colorscheme=light&layout=standard&action=like&show_faces=true&send=true' target='_blank'>
Like it on FB
</a>
<a href="https://twitter.com/share" class="twitter-share-button"
data-url="https://chrome.google.com/webstore/detail/snappysnippet/blfngdefapoapkcdibbdkigpeaffgcil"
data-text="SnappySnippet - Chrome extension for creating HTML+CSS snippets."
data-count="horizontal"> </a>
</div>
<div id='loader'>
<div class='alert alert-warning'><p><span class="fui-time"></span> <strong>Please wait.</strong> Creating a snapshot...</p></div>
<div class='alert alert-warning'><p><span class="fui-time"></span> <strong>Please wait.</strong> Processing...</p></div>
</div>
<script src="css/js/jquery-1.8.3.min.js"></script>
<script src="css/js/bootstrap.min.js"></script>
<script src="css/js/flatui-checkbox.js"></script>
<script src='js/libs/jquery.htmlClean.js'></script>
<script src='js/tools/CSSStringifier.js'></script>
<script src='js/tools/SameRulesCombiner.js'></script>
<script src='js/filters/DefaultValueFilter.js'></script>
<script src='js/filters/ShorthandPropertyFilter.js'></script>
<script src='js/filters/WebkitPropertiesFilter.js'></script>
<script src='js/tools/Snapshooter.js'></script>
<script src='js/panel.js'></script>
<script src="https://platform.twitter.com/widgets.js"></script>
</body>
</html>