Mercurial Hosting > sceditor
annotate src/examples/modified.html @ 47:16b61f228546 default tip
minor
author | Franklin Schmidt <fschmidt@gmail.com> |
---|---|
date | Mon, 31 Oct 2022 10:41:24 -0600 |
parents | eaecca025287 |
children |
rev | line source |
---|---|
0
4c4fc447baea
start with sceditor-3.1.1
Franklin Schmidt <fschmidt@gmail.com>
parents:
diff
changeset
|
1 <!DOCTYPE html> |
4c4fc447baea
start with sceditor-3.1.1
Franklin Schmidt <fschmidt@gmail.com>
parents:
diff
changeset
|
2 <html> |
4c4fc447baea
start with sceditor-3.1.1
Franklin Schmidt <fschmidt@gmail.com>
parents:
diff
changeset
|
3 <head> |
7
df1e18048d97
add examples/min.html and better defaults
Franklin Schmidt <fschmidt@gmail.com>
parents:
6
diff
changeset
|
4 <meta name="viewport" content="width=device-width, initial-scale=1"> |
0
4c4fc447baea
start with sceditor-3.1.1
Franklin Schmidt <fschmidt@gmail.com>
parents:
diff
changeset
|
5 <meta http-equiv="Content-Type" content="text/html;charset=utf-8" /> |
4c4fc447baea
start with sceditor-3.1.1
Franklin Schmidt <fschmidt@gmail.com>
parents:
diff
changeset
|
6 |
4c4fc447baea
start with sceditor-3.1.1
Franklin Schmidt <fschmidt@gmail.com>
parents:
diff
changeset
|
7 <title>SCEditor Demo</title> |
4c4fc447baea
start with sceditor-3.1.1
Franklin Schmidt <fschmidt@gmail.com>
parents:
diff
changeset
|
8 |
4
b7725dab7482
move /development/* to /
Franklin Schmidt <fschmidt@gmail.com>
parents:
2
diff
changeset
|
9 <link rel="stylesheet" href="/themes/default.css" id="theme-style" /> |
0
4c4fc447baea
start with sceditor-3.1.1
Franklin Schmidt <fschmidt@gmail.com>
parents:
diff
changeset
|
10 |
4
b7725dab7482
move /development/* to /
Franklin Schmidt <fschmidt@gmail.com>
parents:
2
diff
changeset
|
11 <script src="/sceditor.js"></script> |
b7725dab7482
move /development/* to /
Franklin Schmidt <fschmidt@gmail.com>
parents:
2
diff
changeset
|
12 <script src="/formats/bbcode.js"></script> |
0
4c4fc447baea
start with sceditor-3.1.1
Franklin Schmidt <fschmidt@gmail.com>
parents:
diff
changeset
|
13 |
4c4fc447baea
start with sceditor-3.1.1
Franklin Schmidt <fschmidt@gmail.com>
parents:
diff
changeset
|
14 <style> |
4c4fc447baea
start with sceditor-3.1.1
Franklin Schmidt <fschmidt@gmail.com>
parents:
diff
changeset
|
15 html { |
4c4fc447baea
start with sceditor-3.1.1
Franklin Schmidt <fschmidt@gmail.com>
parents:
diff
changeset
|
16 font-family: Arial, Helvetica, sans-serif; |
4c4fc447baea
start with sceditor-3.1.1
Franklin Schmidt <fschmidt@gmail.com>
parents:
diff
changeset
|
17 font-size: 13px; |
4c4fc447baea
start with sceditor-3.1.1
Franklin Schmidt <fschmidt@gmail.com>
parents:
diff
changeset
|
18 } |
4c4fc447baea
start with sceditor-3.1.1
Franklin Schmidt <fschmidt@gmail.com>
parents:
diff
changeset
|
19 form div { |
4c4fc447baea
start with sceditor-3.1.1
Franklin Schmidt <fschmidt@gmail.com>
parents:
diff
changeset
|
20 padding: .5em; |
4c4fc447baea
start with sceditor-3.1.1
Franklin Schmidt <fschmidt@gmail.com>
parents:
diff
changeset
|
21 } |
4c4fc447baea
start with sceditor-3.1.1
Franklin Schmidt <fschmidt@gmail.com>
parents:
diff
changeset
|
22 code:before { |
4c4fc447baea
start with sceditor-3.1.1
Franklin Schmidt <fschmidt@gmail.com>
parents:
diff
changeset
|
23 position: absolute; |
4c4fc447baea
start with sceditor-3.1.1
Franklin Schmidt <fschmidt@gmail.com>
parents:
diff
changeset
|
24 content: 'Code:'; |
4c4fc447baea
start with sceditor-3.1.1
Franklin Schmidt <fschmidt@gmail.com>
parents:
diff
changeset
|
25 top: -1.35em; |
4c4fc447baea
start with sceditor-3.1.1
Franklin Schmidt <fschmidt@gmail.com>
parents:
diff
changeset
|
26 left: 0; |
4c4fc447baea
start with sceditor-3.1.1
Franklin Schmidt <fschmidt@gmail.com>
parents:
diff
changeset
|
27 } |
4c4fc447baea
start with sceditor-3.1.1
Franklin Schmidt <fschmidt@gmail.com>
parents:
diff
changeset
|
28 code { |
4c4fc447baea
start with sceditor-3.1.1
Franklin Schmidt <fschmidt@gmail.com>
parents:
diff
changeset
|
29 margin-top: 1.5em; |
4c4fc447baea
start with sceditor-3.1.1
Franklin Schmidt <fschmidt@gmail.com>
parents:
diff
changeset
|
30 position: relative; |
4c4fc447baea
start with sceditor-3.1.1
Franklin Schmidt <fschmidt@gmail.com>
parents:
diff
changeset
|
31 background: #eee; |
4c4fc447baea
start with sceditor-3.1.1
Franklin Schmidt <fschmidt@gmail.com>
parents:
diff
changeset
|
32 border: 1px solid #aaa; |
4c4fc447baea
start with sceditor-3.1.1
Franklin Schmidt <fschmidt@gmail.com>
parents:
diff
changeset
|
33 white-space: pre; |
4c4fc447baea
start with sceditor-3.1.1
Franklin Schmidt <fschmidt@gmail.com>
parents:
diff
changeset
|
34 padding: .25em; |
4c4fc447baea
start with sceditor-3.1.1
Franklin Schmidt <fschmidt@gmail.com>
parents:
diff
changeset
|
35 min-height: 1.25em; |
4c4fc447baea
start with sceditor-3.1.1
Franklin Schmidt <fschmidt@gmail.com>
parents:
diff
changeset
|
36 } |
4c4fc447baea
start with sceditor-3.1.1
Franklin Schmidt <fschmidt@gmail.com>
parents:
diff
changeset
|
37 code:before, code { |
4c4fc447baea
start with sceditor-3.1.1
Franklin Schmidt <fschmidt@gmail.com>
parents:
diff
changeset
|
38 display: block; |
4c4fc447baea
start with sceditor-3.1.1
Franklin Schmidt <fschmidt@gmail.com>
parents:
diff
changeset
|
39 text-align: left; |
4c4fc447baea
start with sceditor-3.1.1
Franklin Schmidt <fschmidt@gmail.com>
parents:
diff
changeset
|
40 } |
4c4fc447baea
start with sceditor-3.1.1
Franklin Schmidt <fschmidt@gmail.com>
parents:
diff
changeset
|
41 </style> |
4c4fc447baea
start with sceditor-3.1.1
Franklin Schmidt <fschmidt@gmail.com>
parents:
diff
changeset
|
42 </head> |
4c4fc447baea
start with sceditor-3.1.1
Franklin Schmidt <fschmidt@gmail.com>
parents:
diff
changeset
|
43 <body> |
4c4fc447baea
start with sceditor-3.1.1
Franklin Schmidt <fschmidt@gmail.com>
parents:
diff
changeset
|
44 <form action="" method="post"> |
4c4fc447baea
start with sceditor-3.1.1
Franklin Schmidt <fschmidt@gmail.com>
parents:
diff
changeset
|
45 <div> |
4c4fc447baea
start with sceditor-3.1.1
Franklin Schmidt <fschmidt@gmail.com>
parents:
diff
changeset
|
46 <textarea id="example" style="height:300px;width:600px;">[center][size=3][b]BBCode SCEditor[/b][/size][/center] |
4c4fc447baea
start with sceditor-3.1.1
Franklin Schmidt <fschmidt@gmail.com>
parents:
diff
changeset
|
47 |
4c4fc447baea
start with sceditor-3.1.1
Franklin Schmidt <fschmidt@gmail.com>
parents:
diff
changeset
|
48 Give it a try! :) |
4c4fc447baea
start with sceditor-3.1.1
Franklin Schmidt <fschmidt@gmail.com>
parents:
diff
changeset
|
49 |
4c4fc447baea
start with sceditor-3.1.1
Franklin Schmidt <fschmidt@gmail.com>
parents:
diff
changeset
|
50 [color=#ff00]Red text! [/color][color=#3399ff]Blue?[/color] |
4c4fc447baea
start with sceditor-3.1.1
Franklin Schmidt <fschmidt@gmail.com>
parents:
diff
changeset
|
51 |
4c4fc447baea
start with sceditor-3.1.1
Franklin Schmidt <fschmidt@gmail.com>
parents:
diff
changeset
|
52 [ul][li]A simple list[/li][li]list item 2[/li][/ul] |
4c4fc447baea
start with sceditor-3.1.1
Franklin Schmidt <fschmidt@gmail.com>
parents:
diff
changeset
|
53 |
4c4fc447baea
start with sceditor-3.1.1
Franklin Schmidt <fschmidt@gmail.com>
parents:
diff
changeset
|
54 Just type [b]:[/b]) and it should be converted into :) as you type.</textarea> |
4c4fc447baea
start with sceditor-3.1.1
Franklin Schmidt <fschmidt@gmail.com>
parents:
diff
changeset
|
55 |
4c4fc447baea
start with sceditor-3.1.1
Franklin Schmidt <fschmidt@gmail.com>
parents:
diff
changeset
|
56 </div> |
4c4fc447baea
start with sceditor-3.1.1
Franklin Schmidt <fschmidt@gmail.com>
parents:
diff
changeset
|
57 |
4c4fc447baea
start with sceditor-3.1.1
Franklin Schmidt <fschmidt@gmail.com>
parents:
diff
changeset
|
58 <div> |
4c4fc447baea
start with sceditor-3.1.1
Franklin Schmidt <fschmidt@gmail.com>
parents:
diff
changeset
|
59 <label for="theme">Theme:</label> |
4c4fc447baea
start with sceditor-3.1.1
Franklin Schmidt <fschmidt@gmail.com>
parents:
diff
changeset
|
60 <select id="theme"> |
4c4fc447baea
start with sceditor-3.1.1
Franklin Schmidt <fschmidt@gmail.com>
parents:
diff
changeset
|
61 <option value="default">Default</option> |
4c4fc447baea
start with sceditor-3.1.1
Franklin Schmidt <fschmidt@gmail.com>
parents:
diff
changeset
|
62 <option value="defaultdark">Default dark</option> |
4c4fc447baea
start with sceditor-3.1.1
Franklin Schmidt <fschmidt@gmail.com>
parents:
diff
changeset
|
63 <option value="modern">Modern</option> |
4c4fc447baea
start with sceditor-3.1.1
Franklin Schmidt <fschmidt@gmail.com>
parents:
diff
changeset
|
64 <option value="office-toolbar">Office Toolbar</option> |
4c4fc447baea
start with sceditor-3.1.1
Franklin Schmidt <fschmidt@gmail.com>
parents:
diff
changeset
|
65 <option value="office">Office</option> |
4c4fc447baea
start with sceditor-3.1.1
Franklin Schmidt <fschmidt@gmail.com>
parents:
diff
changeset
|
66 <option value="square">Square</option> |
4c4fc447baea
start with sceditor-3.1.1
Franklin Schmidt <fschmidt@gmail.com>
parents:
diff
changeset
|
67 </select> |
4c4fc447baea
start with sceditor-3.1.1
Franklin Schmidt <fschmidt@gmail.com>
parents:
diff
changeset
|
68 </div> |
4c4fc447baea
start with sceditor-3.1.1
Franklin Schmidt <fschmidt@gmail.com>
parents:
diff
changeset
|
69 </form> |
4c4fc447baea
start with sceditor-3.1.1
Franklin Schmidt <fschmidt@gmail.com>
parents:
diff
changeset
|
70 |
4c4fc447baea
start with sceditor-3.1.1
Franklin Schmidt <fschmidt@gmail.com>
parents:
diff
changeset
|
71 |
4c4fc447baea
start with sceditor-3.1.1
Franklin Schmidt <fschmidt@gmail.com>
parents:
diff
changeset
|
72 <script> |
12
933a459aa182
allow selector for textarea
Franklin Schmidt <fschmidt@gmail.com>
parents:
10
diff
changeset
|
73 sceditor.create('#example', { |
0
4c4fc447baea
start with sceditor-3.1.1
Franklin Schmidt <fschmidt@gmail.com>
parents:
diff
changeset
|
74 }); |
4c4fc447baea
start with sceditor-3.1.1
Franklin Schmidt <fschmidt@gmail.com>
parents:
diff
changeset
|
75 |
4c4fc447baea
start with sceditor-3.1.1
Franklin Schmidt <fschmidt@gmail.com>
parents:
diff
changeset
|
76 |
4c4fc447baea
start with sceditor-3.1.1
Franklin Schmidt <fschmidt@gmail.com>
parents:
diff
changeset
|
77 var themeInput = document.getElementById('theme'); |
4c4fc447baea
start with sceditor-3.1.1
Franklin Schmidt <fschmidt@gmail.com>
parents:
diff
changeset
|
78 themeInput.onchange = function() { |
4
b7725dab7482
move /development/* to /
Franklin Schmidt <fschmidt@gmail.com>
parents:
2
diff
changeset
|
79 var theme = '/themes/' + themeInput.value + '.css'; |
0
4c4fc447baea
start with sceditor-3.1.1
Franklin Schmidt <fschmidt@gmail.com>
parents:
diff
changeset
|
80 |
4c4fc447baea
start with sceditor-3.1.1
Franklin Schmidt <fschmidt@gmail.com>
parents:
diff
changeset
|
81 document.getElementById('theme-style').href = theme; |
4c4fc447baea
start with sceditor-3.1.1
Franklin Schmidt <fschmidt@gmail.com>
parents:
diff
changeset
|
82 }; |
4c4fc447baea
start with sceditor-3.1.1
Franklin Schmidt <fschmidt@gmail.com>
parents:
diff
changeset
|
83 </script> |
4c4fc447baea
start with sceditor-3.1.1
Franklin Schmidt <fschmidt@gmail.com>
parents:
diff
changeset
|
84 |
4c4fc447baea
start with sceditor-3.1.1
Franklin Schmidt <fschmidt@gmail.com>
parents:
diff
changeset
|
85 <p>SCEditor is licensed under the <a href="http://www.opensource.org/licenses/mit-license.php">MIT</a></p> |
4c4fc447baea
start with sceditor-3.1.1
Franklin Schmidt <fschmidt@gmail.com>
parents:
diff
changeset
|
86 </body> |
4c4fc447baea
start with sceditor-3.1.1
Franklin Schmidt <fschmidt@gmail.com>
parents:
diff
changeset
|
87 </html> |