Mercurial Hosting > sceditor
diff src/examples/modified.html @ 5:dd47b95c9ec7
add /examples/
| author | Franklin Schmidt <fschmidt@gmail.com> |
|---|---|
| date | Thu, 04 Aug 2022 19:27:37 -0600 |
| parents | src/example.html@b7725dab7482 |
| children | c26f7240e96b |
line wrap: on
line diff
--- /dev/null Thu Jan 01 00:00:00 1970 +0000 +++ b/src/examples/modified.html Thu Aug 04 19:27:37 2022 -0600 @@ -0,0 +1,91 @@ +<!DOCTYPE html> +<html> + <head> + <meta http-equiv="Content-Type" content="text/html;charset=utf-8" /> + + <title>SCEditor Demo</title> + + <link rel="stylesheet" href="/themes/default.css" id="theme-style" /> + + <script src="/sceditor.js"></script> + <script src="/icons/monocons.js"></script> + <script src="/formats/bbcode.js"></script> + + <style> + html { + font-family: Arial, Helvetica, sans-serif; + font-size: 13px; + } + form div { + padding: .5em; + } + code:before { + position: absolute; + content: 'Code:'; + top: -1.35em; + left: 0; + } + code { + margin-top: 1.5em; + position: relative; + background: #eee; + border: 1px solid #aaa; + white-space: pre; + padding: .25em; + min-height: 1.25em; + } + code:before, code { + display: block; + text-align: left; + } + </style> + </head> + <body> + <form action="" method="post"> + <div> + <textarea id="example" style="height:300px;width:600px;">[center][size=3][b]BBCode SCEditor[/b][/size][/center] + +Give it a try! :) + +[color=#ff00]Red text! [/color][color=#3399ff]Blue?[/color] + +[ul][li]A simple list[/li][li]list item 2[/li][/ul] + +Just type [b]:[/b]) and it should be converted into :) as you type.</textarea> + + </div> + + <div> + <label for="theme">Theme:</label> + <select id="theme"> + <option value="default">Default</option> + <option value="defaultdark">Default dark</option> + <option value="modern">Modern</option> + <option value="office-toolbar">Office Toolbar</option> + <option value="office">Office</option> + <option value="square">Square</option> + </select> + </div> + </form> + + + <script> + var textarea = document.getElementById('example'); + sceditor.create(textarea, { + format: 'bbcode', + icons: 'monocons', + style: '/themes/content/default.css' + }); + + + var themeInput = document.getElementById('theme'); + themeInput.onchange = function() { + var theme = '/themes/' + themeInput.value + '.css'; + + document.getElementById('theme-style').href = theme; + }; + </script> + + <p>SCEditor is licensed under the <a href="http://www.opensource.org/licenses/mit-license.php">MIT</a></p> + </body> +</html>