index.mustache.html 3.3 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757677787980818283848586878889909192
  1. <!DOCTYPE html>
  2. <html lang="en">
  3. <head>
  4. <title>Web sandbox</title>
  5. <link rel="stylesheet" href="/css/normalize.css">
  6. <link rel="stylesheet" href="/css/main.css">
  7. <!-- <link rel="stylesheet" href="css/qunit-2.4.1.css"> -->
  8. <link rel="stylesheet" href="/css/vendor/pure-grids-min.css">
  9. <link rel="stylesheet" href="/css/vendor/pure-grids-responsive-min.css">
  10. <!-- <link rel="stylesheet" href="/css/vendor/styles.css"> -->
  11. <link rel="stylesheet" href="/css/styles.css">
  12. <style type="text/css" media="screen">
  13. </style>
  14. </head>
  15. <body>
  16. <div class="panel-container">
  17. <div class="panel-left">
  18. <div id="nav-menus">
  19. <div id="menu-repo" class="pure-g">
  20. <div class="pure-u-1">
  21. <span class="cat-title">Collections d'examples</span>
  22. <ul class="nav-menu">{{#menuRepo}}
  23. <li><a href="/{{slug}}">{{title}}</a></li>{{/menuRepo}}
  24. </ul>
  25. </div>
  26. </div>
  27. <div id="menu-example" class="pure-g nav-menu">{{#menuExample}}
  28. <div class="pure-u-1 pure-u-md-1-2">
  29. <span class="cat-title">{{category.title}}</span>
  30. <ul>{{#examples}}
  31. <li><a href="/{{{slug}}}">{{title}}</a></li>{{/examples}}</ul>
  32. </div>{{/menuExample}}</div>
  33. </div>
  34. <div id="navbar">
  35. <button id="menu-btn" class="icon-menu"></button>
  36. </div>
  37. <div id="notification"></div>
  38. <div class="panel-inner">
  39. <button id="add-example-btn" class="icon-plus rounded blue"></button>
  40. <form id="add-example-form" style="display: none;">
  41. <input type="text" name="title" class="input-sm" value="" />
  42. <button type="button" id="add-example-cancel" class="icon-cross rounded red"></button><!--
  43. --><button type="submit" id="add-example-save" class="icon-checkmark rounded green"></button>
  44. </form>
  45. <button id="save-changes" class="icon-cloud-upload green"></button>
  46. <ul id="tabs">{{#files}}
  47. <li class="tab-{{type}}" data-type="{{type}}">{{name}}</li>
  48. {{/files}}
  49. <li>+</li>
  50. </ul>
  51. </div>
  52. <div id="editor"></div>
  53. <script type="text/html" id="editor-javascript"></script>
  54. <script type="text/html" id="editor-html"></script>
  55. <script type="text/html" id="editor-css"></script>
  56. <!-- <button id="revert-editor">!</button> -->
  57. </div>
  58. <div class="splitter">
  59. </div>
  60. <iframe class="panel-right" src="/html/start-iframe.html"></iframe>
  61. </div>
  62. <script src="/js/vendor/modernizr-3.5.0.min.js"></script>
  63. <script src="/js/vendor/jquery-3.2.1.min.js" ></script>
  64. <script src="/js/vendor/jquery-resizable.min.js" ></script>
  65. <!-- <script src="/js/vendor/qunit-2.4.1.js" ></script> -->
  66. <script src="/js/vendor/lodash.min.js" ></script>
  67. <script src="/js/vendor/loadJS.js" ></script>
  68. <script src="/js/plugins.js"></script>
  69. <script src="/js/main.js"></script>
  70. <script src="/js/vendor/ace/ace.js" type="text/javascript" charset="utf-8"></script>
  71. <script src="/js/req-promise.js"></script>
  72. <script src="/js/editor-local-storage.js"></script>
  73. <script id="inline-js-data">
  74. window._webSandboxFiles = {{{filesJSON}}};
  75. </script>
  76. <script src="/js/editor.js"></script>
  77. </body>
  78. </html>