-
Notifications
You must be signed in to change notification settings - Fork 5
/
index.html
66 lines (54 loc) · 3.17 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
<!DOCTYPE html>
<html class="no-js">
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<title>SVGsplit</title>
<meta name="description" content="Splitting SVG groups into separate files to make working with SVG files less of a pain">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="css/normalize.css">
<link rel="stylesheet" href="css/main.css">
<link href='http://fonts.googleapis.com/css?family=Open+Sans:400,700' rel='stylesheet' type='text/css'>
<script src="js/vendor/modernizr-2.7.0.min.js"></script>
</head>
<body>
<!--[if lt IE 8]>
<p class="browsehappy">You are using an <strong>outdated</strong> browser. Please <a href="http://browsehappy.com/">upgrade your browser</a> to improve your experience.</p>
<![endif]-->
<section>
<h1 id="title"><b>SVG</b>split</h1>
<div id="holder"><div id="cta">drag & drop svg file here</div></div>
<p id="upload" class="hidden"><label>Drag & drop not supported, but you can still upload via this input field:<br><input id="file-input" type="file"></label></p>
<div id="svg-file" class="hiddenA"></div>
<p id="filereader" class="hidden">File API & FileReader API not supported</p>
<p id="formdata" class="hidden">XHR2's FormData is not supported</p>
<p id="progress" class="hidden">XHR2's upload progress isn't supported</p>
<p class="hidden">Upload progress: <progress id="uploadprogress" min="0" max="100" value="0">0</progress></p>
<div id="help">
<h3>What is this thing?</h3>
<p>
SVGsplit is made for splitting "groups" (<g> tags) in svg files down into seperate svg files. It then outputs them on the page and automatically downloads them, packaged up as a zip file. This is useful for creating SVG icons and works quite well with Adobe Illustrator or Inkscape. Just save your source file as an SVG and drop it in the box above. All the layer names will become the new file names for the split up SVGs. Email me if you have any questions: tim[at]tscanlin.com
</p>
</div>
<div id="split-svgs">
<h2>Preview <span class="small">(enabled <input id="enable-preview" type="checkbox" checked>)</span></h2>
</div>
</section>
<br><br>
<span id="credit">© 2020 <a href="http://timscanlin.net">Tim Scanlin</a></span>
<br>
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
<script>window.jQuery || document.write('<script src="js/vendor/jquery-1.10.2.min.js"><\/script>')</script>
<script src="js/vendor/jszip.js"></script>
<script src="js/vendor/zip.js"></script>
<script src="js/main.js"></script>
<script>
(function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
(i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
})(window,document,'script','//www.google-analytics.com/analytics.js','ga');
ga('create', 'UA-59343135-1', 'auto');
ga('send', 'pageview');
</script>
</body>
</html>