Browse code

add banner image

Dario Rodriguez authored on 10/07/2014 17:17:13
Showing 1 changed files
... ...
@@ -10,8 +10,9 @@
10 10
     <link rel="stylesheet" href="newpost.css">
11 11
   </head>
12 12
   <body>
13
+   <div class='banner'><img src="banner.png" /></div>
13 14
     <div id="wysihtml5-editor-toolbar">
14
-      <header>
15
+	<header>
15 16
         <ul class="commands">
16 17
           <li data-wysihtml5-command="bold" title="Make text bold (CTRL + B)" class="command"></li>
17 18
           <li data-wysihtml5-command="italic" title="Make text italic (CTRL + I)" class="command"></li>
... ...
@@ -54,7 +55,7 @@
54 55
       </div>
55 56
     </div>
56 57
 
57
-    <section>
58
+    <section class="editorsection">
58 59
       <textarea id="wysihtml5-editor" spellcheck="false" wrap="off" autofocus placeholder="Escribe aquí ...">
59 60
       </textarea>
60 61
     </section>
... ...
@@ -63,7 +64,7 @@
63 64
     </div>
64 65
 
65 66
     <div class='titlediv'>
66
-    <p><input id="title" class="roundedtext" placeholder="T&iacute;tulo"></input></p>
67
+    <p><input id="title" class="roundedtext" placeholder="T&iacute;tulo"/></p>
67 68
     </div>
68 69
 
69 70
     <script>
Browse code

Add titles to the posts

Dario Rodriguez authored on 08/07/2014 11:34:03
Showing 1 changed files
... ...
@@ -53,21 +53,26 @@
53 53
         <a data-wysihtml5-dialog-action="save">OK</a>&nbsp;<a data-wysihtml5-dialog-action="cancel">Cancel</a>
54 54
       </div>
55 55
     </div>
56
-    
56
+
57 57
     <section>
58 58
       <textarea id="wysihtml5-editor" spellcheck="false" wrap="off" autofocus placeholder="Escribe aquí ...">
59 59
       </textarea>
60 60
     </section>
61 61
     <div class='buttondiv'>
62
-	<span class='buttonspan'><input class='rounded' id='donewpost' type ='button' value='Enviar'/></span>
62
+        <span class='buttonspan'><input class='rounded' id='donewpost' type ='button' value='Enviar'/></span>
63
+    </div>
64
+
65
+    <div class='titlediv'>
66
+    <p><input id="title" class="roundedtext" placeholder="T&iacute;tulo"></input></p>
63 67
     </div>
68
+
64 69
     <script>
65 70
       var editor = new wysihtml5.Editor("wysihtml5-editor", {
66 71
         toolbar:     "wysihtml5-editor-toolbar",
67 72
         stylesheets: ["wysihtml5/reset-min.css", "wysihtml5/wysihtml5-editor.css"],
68 73
         parserRules: wysihtml5ParserRules
69 74
       });
70
-      
75
+
71 76
       editor.on("load", function() {
72 77
         var composer = editor.composer,
73 78
             h1 = editor.composer.element.querySelector("h1");
Browse code

add the editor and the posts part

Dario Rodriguez authored on 26/06/2014 22:41:33
Showing 1 changed files
1 1
new file mode 100644
... ...
@@ -0,0 +1,81 @@
1
+<!DOCTYPE html>
2
+<html>
3
+  <head>
4
+    <meta charset="utf-8"/>
5
+    <title>New post</title>
6
+    <script src="wysihtml5/parser_rules/advanced.js" ></script>
7
+    <script src="wysihtml5/wysihtml5-0.3.0.js" ></script>
8
+    <link rel="stylesheet" href="wysihtml5/reset-min.css">
9
+    <link rel="stylesheet" href="wysihtml5/wysihtml5-stylesheet.css">
10
+    <link rel="stylesheet" href="newpost.css">
11
+  </head>
12
+  <body>
13
+    <div id="wysihtml5-editor-toolbar">
14
+      <header>
15
+        <ul class="commands">
16
+          <li data-wysihtml5-command="bold" title="Make text bold (CTRL + B)" class="command"></li>
17
+          <li data-wysihtml5-command="italic" title="Make text italic (CTRL + I)" class="command"></li>
18
+          <li data-wysihtml5-command="insertUnorderedList" title="Insert an unordered list" class="command"></li>
19
+          <li data-wysihtml5-command="insertOrderedList" title="Insert an ordered list" class="command"></li>
20
+          <li data-wysihtml5-command="createLink" title="Insert a link" class="command"></li>
21
+          <li data-wysihtml5-command="insertImage" title="Insert an image" class="command"></li>
22
+          <li data-wysihtml5-command="formatBlock" data-wysihtml5-command-value="h1" title="Insert headline 1" class="command"></li>
23
+          <li data-wysihtml5-command="formatBlock" data-wysihtml5-command-value="h2" title="Insert headline 2" class="command"></li>
24
+          <li data-wysihtml5-command-group="foreColor" class="fore-color" title="Color the selected text" class="command">
25
+            <ul>
26
+              <li data-wysihtml5-command="foreColor" data-wysihtml5-command-value="silver"></li>
27
+              <li data-wysihtml5-command="foreColor" data-wysihtml5-command-value="gray"></li>
28
+              <li data-wysihtml5-command="foreColor" data-wysihtml5-command-value="maroon"></li>
29
+              <li data-wysihtml5-command="foreColor" data-wysihtml5-command-value="red"></li>
30
+              <li data-wysihtml5-command="foreColor" data-wysihtml5-command-value="purple"></li>
31
+              <li data-wysihtml5-command="foreColor" data-wysihtml5-command-value="green"></li>
32
+              <li data-wysihtml5-command="foreColor" data-wysihtml5-command-value="olive"></li>
33
+              <li data-wysihtml5-command="foreColor" data-wysihtml5-command-value="navy"></li>
34
+              <li data-wysihtml5-command="foreColor" data-wysihtml5-command-value="blue"></li>
35
+            </ul>
36
+          </li>
37
+          <li data-wysihtml5-action="change_view" title="Show HTML" class="action"></li>
38
+        </ul>
39
+      </header>
40
+      <div data-wysihtml5-dialog="createLink" style="display: none;">
41
+        <label>
42
+          Link:
43
+          <input data-wysihtml5-dialog-field="href" value="http://">
44
+        </label>
45
+        <a data-wysihtml5-dialog-action="save">OK</a>&nbsp;<a data-wysihtml5-dialog-action="cancel">Cancel</a>
46
+      </div>
47
+
48
+      <div data-wysihtml5-dialog="insertImage" style="display: none;">
49
+        <label>
50
+          Image:
51
+          <input data-wysihtml5-dialog-field="src" value="http://">
52
+        </label>
53
+        <a data-wysihtml5-dialog-action="save">OK</a>&nbsp;<a data-wysihtml5-dialog-action="cancel">Cancel</a>
54
+      </div>
55
+    </div>
56
+    
57
+    <section>
58
+      <textarea id="wysihtml5-editor" spellcheck="false" wrap="off" autofocus placeholder="Escribe aquí ...">
59
+      </textarea>
60
+    </section>
61
+    <div class='buttondiv'>
62
+	<span class='buttonspan'><input class='rounded' id='donewpost' type ='button' value='Enviar'/></span>
63
+    </div>
64
+    <script>
65
+      var editor = new wysihtml5.Editor("wysihtml5-editor", {
66
+        toolbar:     "wysihtml5-editor-toolbar",
67
+        stylesheets: ["wysihtml5/reset-min.css", "wysihtml5/wysihtml5-editor.css"],
68
+        parserRules: wysihtml5ParserRules
69
+      });
70
+      
71
+      editor.on("load", function() {
72
+        var composer = editor.composer,
73
+            h1 = editor.composer.element.querySelector("h1");
74
+        if (h1) {
75
+          composer.selection.selectNode(h1);
76
+        }
77
+      });
78
+    </script>
79
+    <script src='newpost.js'></script>
80
+  </body>
81
+</html>