-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathposter.html
117 lines (108 loc) · 5.46 KB
/
poster.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
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta property="og:title" content="END IT Movement :: #enditmovement" />
<meta property="og:description" content="END IT is a Coalition of the leading organizations in the world in the fight for FREEDOM. Each of our amazing Coalition Partners are doing the work, on the ground, everyday, to bring AWARENESS, PREVENTION, RESCUE, and RESTORATION." />
<meta property="og:type" content="website" />
<meta property="og:url" content="//enditmovement.com/" />
<meta name="title" content="END IT Movement :: #enditmovement">
<meta name="description" content="END IT is a Coalition of the leading organizations in the world in the fight for FREEDOM. Each of our amazing Coalition Partners are doing the work, on the ground, everyday, to bring AWARENESS, PREVENTION, RESCUE, and RESTORATION.">
<meta property="og:image" content="images/og-image.jpg" />
<meta property="og:url" content="//enditmovement.com/" />
<meta name="twitter:card" content="summary_large_image">
<meta name="twitter:site" content="@enditmovement">
<meta name="twitter:creator" content="@enditmovement">
<meta name="twitter:title" content="END IT Movement">
<meta name="twitter:description" content="END IT is a Coalition of the leading organizations in the world in the fight for FREEDOM. Each of our amazing Coalition Partners are doing the work, on the ground, everyday, to bring AWARENESS, PREVENTION, RESCUE, and RESTORATION.">
<meta name="twitter:image" content="images/og-image.jpg">
<link rel="shortcut icon" type="image/x-icon" href="images/favicon.png">
<title>END IT Movement - Poster</title>
<link rel="stylesheet" type="text/css" href="css/normalize.css">
<link rel="stylesheet" type="text/css" href="css/poster.css">
<!-- Fonts -->
<script type="text/javascript" src="//fast.fonts.net/jsapi/cc3ea01c-b8ef-4dd8-bd89-19376434e1e8.js"></script>
</head>
<body class="sketch">
<div class="center-column">
<div class="image-anchor">
<div class="draggable shadow pic1 poster-pic">
</div>
<div class="draggable shadow pic3 poster-pic">
</div>
<div class="draggable shadow pic2 poster-pic">
</div>
<div class="draggable shadow pic4 poster-pic">
</div>
<div class="draggable shadow pic5 poster-pic">
</div>
<div class="draggable shadow pic6 poster-pic">
</div>
<div class="draggable shadow pic7 poster-pic">
</div>
<div class="draggable shadow pic8 poster-pic">
</div>
</div><!-- imageColumn -->
<div class="hidden-xs">
<h1 class="h1">Make a poster. <br class="show-xs" />shine a light on slavery.</h1>
<p>
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
</p>
</div>
<div id="canvasWrapper">
</div>
<div id="canvasControls" class="text-center">
<span class="poster-control hidden-xs uploadImg">
<img src="images/icons/icon-camera.svg" alt="">
</span>
<span class="poster-control hidden-md hidden-lg hidden-sm" id="openImageDrawer">
<img src="images/icons/icon-camera.svg" alt="">
</span>
<span class="poster-control hidden-md hidden-lg hidden-sm" id="drawMobile">
<img src="images/icons/icon-pencil.svg" alt="">
</span>
<span class="poster-control hidden-xs" id="addText">
<img src="images/icons/icon-typography.svg" alt="">
</span>
<span class="poster-control" id="switchPoster">
<img src="images/icons/icon-bomb.svg" alt="">
</span>
<span class="poster-control" id="savePoster">
<img src="images/icons/icon-save.svg" alt="">
</span>
</div>
</div><!-- /center-column -->
<div class="mobile-image-folder__window visible-xs-block">
<div class="mobile-image-folder">
<div class="mobile-pic uploadImg mobile-pic--upload">
<span class="poster-control">
<i class="fa fa-camera" aria-hidden="true"></i>
</span>
<p class="text-center">upload a picture</p>
</div>
<img src="images/poster-1.jpg" class="mobile-pic" />
<img src="images/poster-2.jpg" class="mobile-pic" />
<img src="images/poster-3.jpg" class="mobile-pic" />
<img src="images/poster-4.jpg" class="mobile-pic" />
<img src="images/poster-5.jpg" class="mobile-pic" />
<img src="images/poster-6.jpg" class="mobile-pic" />
<img src="images/poster-7.jpg" class="mobile-pic" />
<img src="images/poster-8.jpg" class="mobile-pic" />
</div>
</div>
<div id="saveImageModal" class="modal__saveImage">
<span class="close-saveImageModal">close</span>
<div class="modal_image-container"></div>
<p class="text-center">Press and hold to save your custom poster.</p>
</div>
<!-- Scripts -->
<script src="https://code.jquery.com/jquery-2.2.4.min.js" integrity="sha256-BbhdlvQf/xTY9gja0Dq3HiwQF8LaCRTXxZKRutelT44=" crossorigin="anonymous"></script>
<script src="https://s3-us-west-2.amazonaws.com/matthewapower/duotone/jquery.duotone.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/p5.js/0.5.5/p5.js"></script>
<script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script>
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/p5.js/0.5.16/addons/p5.dom.js"></script>
<script src="js/poster.js"></script>
</body>
</html>