Skip to content

Commit 068b40d

Browse files
author
☮ elf Pavlik ☮
committed
Merge pull request #2 from acorbi/master
Wrapping and layout draft
2 parents d1775d7 + 2a269e0 commit 068b40d

File tree

4 files changed

+227
-16
lines changed

4 files changed

+227
-16
lines changed

‎bower.json

+14-4
Original file line numberDiff line numberDiff line change
@@ -2,12 +2,22 @@
22
"name": "plp-generator",
33
"version": "0.0.0",
44
"authors": [
5-
"elf Pavlik <[email protected]>"
5+
"elf Pavlik <[email protected]>",
6+
"Alex Corbi <[email protected]>"
67
],
78
"license": "Unlicense",
89
"private": true,
910
"dependencies": {
10-
"json-editor": "~0.7.6",
11-
"bootstrap": "~3.2.0"
12-
}
11+
"json-editor": "~0.7.7",
12+
"bootstrap": "~3.2.0",
13+
"jquery": "~2.1.1"
14+
},
15+
"homepage": "https://github.com/elf-pavlik/plp-generator",
16+
"ignore": [
17+
"**/.*",
18+
"node_modules",
19+
"bower_components",
20+
"test",
21+
"tests"
22+
]
1323
}

‎creator.html

+52
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,52 @@
1+
<!DOCTYPE html>
2+
<html>
3+
4+
<head>
5+
6+
<meta http-equiv="content-type" content="text/html; charset=utf-8" />
7+
8+
<title>PLP Generator</title>
9+
10+
<link rel="stylesheet" href="bower_components/bootstrap/dist/css/bootstrap.css" />
11+
12+
<script src="bower_components/jquery/dist/jquery.js"></script>
13+
<script src="bower_components/bootstrap/dist/js/bootstrap.js"></script>
14+
<script src="bower_components/json-editor/dist/jsoneditor.js"></script>
15+
<script src="app.js"></script>
16+
17+
</head>
18+
19+
<body>
20+
21+
<div class="row">
22+
23+
<div class="col-md-4 col-md-offset-1">
24+
25+
<h1>Profile editor</h1>
26+
27+
</div>
28+
29+
</div>
30+
31+
<div class="row">
32+
33+
<div class="col-md-2 col-md-offset-1">
34+
35+
<h2>How to use it</h2>
36+
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec a diam lectus. Sed sit amet ipsum mauris. Maecenas congue ligula ac quam viverra nec consectetur ante hendrerit. Donec et mollis dolor. Praesent et diam eget libero egestas mattis sit amet vitae augue. Nam tincidunt congue enim, ut porta lorem lacinia consectetur.</p>
37+
38+
</div>
39+
40+
<div class="col-md-7">
41+
42+
<div id="editor_holder" class="medium-12 columns"></div>
43+
44+
<a id="generate_btn" href="profile.html" class="btn btn-primary btn-lg">Generate your profile</a>
45+
46+
</div>
47+
48+
</div>
49+
50+
</body>
51+
52+
</html>

‎index.html

+75-12
Original file line numberDiff line numberDiff line change
@@ -1,16 +1,79 @@
1+
<!DOCTYPE html>
12
<html>
2-
<head>
3-
<meta http-equiv="content-type" content="text/html; charset=utf-8" />
43

5-
<title>PLP Generator</title>
6-
<link rel="stylesheet" href="bower_components/bootstrap/dist/css/bootstrap.css" />
4+
<head>
5+
6+
<meta http-equiv="content-type" content="text/html; charset=utf-8" />
77

8-
<script src="bower_components/jquery/dist/jquery.js"></script>
9-
<script src="bower_components/bootstrap/dist/js/bootstrap.js"></script>
10-
<script src="bower_components/json-editor/dist/jsoneditor.js"></script>
11-
<script src="app.js"></script>
12-
</head>
13-
<body>
14-
<div id="editor_holder"></div>
15-
</body>
8+
<title>PLP Generator</title>
9+
10+
<link rel="stylesheet" href="bower_components/bootstrap/dist/css/bootstrap.css" />
11+
12+
<script src="bower_components/jquery/dist/jquery.js"></script>
13+
<script src="bower_components/bootstrap/dist/js/bootstrap.js"></script>
14+
<script src="bower_components/json-editor/dist/jsoneditor.js"></script>
15+
<script src="app.js"></script>
16+
17+
</head>
18+
19+
<body>
20+
21+
<div class="row">
22+
23+
<div class="col-md-4 col-md-offset-1">
24+
25+
<h1>Profile editor</h1>
26+
27+
</div>
28+
29+
</div>
30+
31+
<div class="row">
32+
33+
<div class="col-md-4 col-md-offset-1">
34+
35+
<h2>What is this?</h2>
36+
37+
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec a diam lectus. Sed sit amet ipsum mauris. Maecenas congue ligula ac quam viverra nec consectetur ante hendrerit. Donec et mollis dolor. Praesent et diam eget libero egestas mattis sit amet vitae augue. Nam tincidunt congue enim, ut porta lorem lacinia consectetur.</p>
38+
39+
<h2>What is it good for?</h2>
40+
41+
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec a diam lectus. Sed sit amet ipsum mauris. Maecenas congue ligula ac quam viverra nec consectetur ante hendrerit. Donec et mollis dolor. Praesent et diam eget libero egestas mattis sit amet vitae augue. Nam tincidunt congue enim, ut porta lorem lacinia consectetur.</p>
42+
43+
<h2>Spread the word</h2>
44+
45+
<p>Share it on FB / Twitter and so on....</p>
46+
47+
</div>
48+
49+
<div class="col-md-4 col-md-offset-1">
50+
51+
<h2>If you have already one</h2>
52+
53+
<form role="form">
54+
55+
<div class="form-group">
56+
57+
<label for="exampleInputEmail1">Input the URL where you have stored it. File will be parsed and editor initialised with data stored on it.</label>
58+
59+
<input type="text" class="form-control" id="profile_url" placeholder="http://">
60+
61+
</div>
62+
63+
<button type="submit" class="btn btn-primary btn-lg">Edit</button>
64+
65+
<h2>If not, create one</h2>
66+
67+
<p>This takes you to the profile creator</p>
68+
69+
<a id="create_btn" href="creator.html" class="btn btn-primary btn-lg">Create or edit your profile</a>
70+
71+
</form>
72+
73+
</div>
74+
75+
</div>
76+
77+
</body>
78+
1679
</html>

‎profile.html

+86
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,86 @@
1+
<!DOCTYPE html>
2+
<html>
3+
4+
<head>
5+
6+
<meta http-equiv="content-type" content="text/html; charset=utf-8" />
7+
8+
<title>PLP Generator</title>
9+
10+
<link rel="stylesheet" href="bower_components/bootstrap/dist/css/bootstrap.css" />
11+
12+
<script src="bower_components/jquery/dist/jquery.js"></script>
13+
<script src="bower_components/bootstrap/dist/js/bootstrap.js"></script>
14+
<script src="bower_components/json-editor/dist/jsoneditor.js"></script>
15+
<script src="app.js"></script>
16+
17+
</head>
18+
19+
<body>
20+
21+
<div class="row">
22+
23+
<div class="col-md-4 col-md-offset-1">
24+
25+
<h1>Profile editor</h1>
26+
27+
</div>
28+
29+
</div>
30+
31+
<div class="row">
32+
33+
<div class="col-md-4 col-md-offset-1">
34+
35+
<h1> Here it is!</h1>
36+
37+
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec a diam lectus. Sed sit amet ipsum mauris. Maecenas congue ligula ac quam viverra nec consectetur ante hendrerit. Donec et mollis dolor. Praesent et diam eget libero egestas mattis sit amet vitae augue. Nam tincidunt congue enim, ut porta lorem lacinia consectetur.</p>
38+
39+
<ul class="nav nav-tabs" role="tablist">
40+
<li class="active"><a href="#json" role="tab" data-toggle="tab">JSON</a></li>
41+
<li><a href="#ld" role="tab" data-toggle="tab">LD</a></li>
42+
<li><a href="#other" role="tab" data-toggle="tab">Other</a></li>
43+
</ul>
44+
45+
<!-- Tab panes -->
46+
<div class="tab-content">
47+
48+
<div class="tab-pane active" id="json">
49+
50+
<textarea class="form-control" rows="10">JSON profile</textarea>
51+
52+
</div>
53+
54+
<div class="tab-pane" id="ld">
55+
56+
<textarea class="form-control" rows="10">LD profile</textarea>
57+
58+
</div>
59+
60+
<div class="tab-pane" id="other">
61+
62+
<textarea class="form-control" rows="10">other formatst</textarea>
63+
64+
</div>
65+
66+
</div>
67+
68+
</div>
69+
70+
<div class="col-md-4 col-md-offset-1">
71+
72+
<h1>You can also download it</h1>
73+
74+
<a id="download_btn" href="#" class="btn btn-primary btn-lg">Download profile</a>
75+
76+
<h1>Or use the following URL</h1>
77+
78+
<input class="form-control" type="text" placeholder="http://ldpc/0EA5&FXCA.json" input>
79+
80+
</div>
81+
82+
</div>
83+
84+
</body>
85+
86+
</html>

0 commit comments

Comments
 (0)