Home Explore Help
Register Sign In
ajpo-amber
/
amber
forked from amber/amber
2
0
Fork 0
Files
Tree: 46613193e7
Branches Tags
amber
/
bower_components
/
codemirror
/
demo
/
theme.html

theme.html 2.9 KB
History Raw

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757677787980818283848586878889 
  1. <!doctype html>
    2. 

  2. <html>
    3. 

  3.   <head>
    4. 

  4.     <meta charset="utf-8">
    5. 

  5.     <title>CodeMirror: Theme Demo</title>
    6. 

  6.     <link rel="stylesheet" href="../lib/codemirror.css">
    7. 

  7.     <script src="../lib/codemirror.js"></script>
    8. 

  8.     <link rel="stylesheet" href="../theme/neat.css">
    9. 

  9.     <link rel="stylesheet" href="../theme/elegant.css">
    10. 

  10.     <link rel="stylesheet" href="../theme/erlang-dark.css">
    11. 

  11.     <link rel="stylesheet" href="../theme/night.css">
    12. 

  12.     <link rel="stylesheet" href="../theme/monokai.css">
    13. 

  13.     <link rel="stylesheet" href="../theme/cobalt.css">
    14. 

  14.     <link rel="stylesheet" href="../theme/eclipse.css">
    15. 

  15.     <link rel="stylesheet" href="../theme/rubyblue.css">
    16. 

  16.     <link rel="stylesheet" href="../theme/lesser-dark.css">
    17. 

  17.     <link rel="stylesheet" href="../theme/xq-dark.css">
    18. 

  18.     <link rel="stylesheet" href="../theme/xq-light.css">
    19. 

  19.     <link rel="stylesheet" href="../theme/ambiance.css">
    20. 

  20.     <link rel="stylesheet" href="../theme/blackboard.css">
    21. 

  21.     <link rel="stylesheet" href="../theme/vibrant-ink.css">
    22. 

  22.     <link rel="stylesheet" href="../theme/solarized.css">
    23. 

  23.     <link rel="stylesheet" href="../theme/twilight.css">
    24. 

  24.     <link rel="stylesheet" href="../theme/midnight.css">
    25. 

  25.     <script src="../mode/javascript/javascript.js"></script>
    26. 

  26.     <link rel="stylesheet" href="../doc/docs.css">
    27. 

  27. 

  28.     <style type="text/css">
    29. 

  29.       .CodeMirror {border: 1px solid black; font-size:13px}
    30. 

  30.     </style>
    31. 

  31.   </head>
    32. 

  32.   <body>
    33. 

  33.     <h1>CodeMirror: Theme demo</h1>
    34. 

  34. 

  35.     <form><textarea id="code" name="code">
    36. 

  36. function findSequence(goal) {
    37. 

  37.   function find(start, history) {
    38. 

  38.     if (start == goal)
    39. 

  39.       return history;
    40. 

  40.     else if (start > goal)
    41. 

  41.       return null;
    42. 

  42.     else
    43. 

  43.       return find(start + 5, "(" + history + " + 5)") ||
    44. 

  44.              find(start * 3, "(" + history + " * 3)");
    45. 

  45.   }
    46. 

  46.   return find(1, "1");
    47. 

  47. }</textarea></form>
    48. 

  48. 

  49. <p>Select a theme: <select onchange="selectTheme()" id=select>
    50. 

  50.     <option selected>default</option>
    51. 

  51.     <option>ambiance</option>
    52. 

  52.     <option>blackboard</option>
    53. 

  53.     <option>cobalt</option>
    54. 

  54.     <option>eclipse</option>
    55. 

  55.     <option>elegant</option>
    56. 

  56.     <option>erlang-dark</option>
    57. 

  57.     <option>lesser-dark</option>
    58. 

  58.     <option>midnight</option>
    59. 

  59.     <option>monokai</option>
    60. 

  60.     <option>neat</option>
    61. 

  61.     <option>night</option>
    62. 

  62.     <option>rubyblue</option>
    63. 

  63.     <option>solarized dark</option>
    64. 

  64.     <option>solarized light</option>
    65. 

  65.     <option>twilight</option>
    66. 

  66.     <option>vibrant-ink</option>
    67. 

  67.     <option>xq-dark</option>
    68. 

  68.     <option>xq-light</option>
    69. 

  69. </select>
    70. 

  70. </p>
    71. 

  71. 

  72. <script>
    73. 

  73.   var editor = CodeMirror.fromTextArea(document.getElementById("code"), {
    74. 

  74.     lineNumbers: true
    75. 

  75.   });
    76. 

  76.   var input = document.getElementById("select");
    77. 

  77.   function selectTheme() {
    78. 

  78.     var theme = input.options[input.selectedIndex].innerHTML;
    79. 

  79.     editor.setOption("theme", theme);
    80. 

  80.   }
    81. 

  81.   var choice = document.location.search &&
    82. 

  82.                decodeURIComponent(document.location.search.slice(1));
    83. 

  83.   if (choice) {
    84. 

  84.     input.value = choice;
    85. 

  85.     editor.setOption("theme", choice);
    86. 

  86.   }
    87. 

  87. </script>
    88. 

  88.   </body>
    89. 

  89. </html>
    90.