github.com/ngocphuongnb/tetua@v0.0.7-alpha/packages/editor/assets/index.html (about)

     1  <!DOCTYPE html>
     2  <html lang="en">
     3    <head>
     4      <title>QR Code Scanner Online - Free scan from camera or image</title>
     5      <meta charset="utf-8" />
     6      <meta
     7        name="viewport"
     8        content="width=device-width,minimum-scale=1,initial-scale=1"
     9      />
    10      <link
    11        rel="stylesheet"
    12        href="https://unpkg.com/bamboo.css/dist/light.min.css"
    13      />
    14      <!-- <link
    15        rel="stylesheet"
    16        href="https://cdnjs.cloudflare.com/ajax/libs/highlight.js/11.2.0/styles/vs2015.min.css"
    17      /> -->
    18      <link rel="stylesheet" href="hljs-11.2.0-github.min.css" />
    19      <link rel="stylesheet" href="tippy-6.3.7.min.css" />
    20      <link rel="stylesheet" href="tippy-light-6.3.7.min.css" />
    21      <link rel="stylesheet" href="style.css" />
    22    </head>
    23  
    24    <body style="max-width: 100%">
    25      <div class="container">
    26        <form method="POST">
    27          <textarea class="content" name="content" spellcheck="false">
    28  # Hello World!
    29  
    30  <!-- <div class="iframe-wrapper">
    31  <iframe src="https://www.youtube.com/embed/iPoWgUktkF0" frameborder="0" allowfullscreen="true" width="500" height="315" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture"></iframe>
    32  </div>
    33  
    34  <div class="iframe-wrapper">
    35  <iframe src="https://www.youtube.com/embed/gVKLER0Wx_c" frameborder="0" allowfullscreen="true" width="500" height="315" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture"></iframe>
    36  </div> -->
    37  
    38  [Support all](https://google.com) frameworks handled by tiptap (Vue 2, Vue 3, React, **see full list**...)
    39  
    40  <!-- <div class="iframe-wrapper">
    41  <iframe src="https://www.youtube.com/embed/XTiTkHB331o" frameborder="0" allowfullscreen="true" width="560" height="315" title="YouTube video player" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture"></iframe>
    42  </div> -->
    43  
    44  ## Heading 2
    45  
    46  - [ ] Task 1
    47  
    48  - [ ] Task 2
    49  
    50    - [ ] Task 3
    51  
    52    - [ ] Task 4
    53  
    54      - [ ] Task 5
    55  
    56        - [ ] Task 6
    57  
    58  That’s a **boring** paragraph *followed* by a ~~fenced~~ `code` block:
    59  
    60  ![](https://www.w3schools.com/w3css/img_lights.jpg)### **Requirements**
    61  
    62  **This package only works with tiptap v2**, tiptap v1 is not supported.
    63  
    64  [Support all](https://google.com) frameworks handled by tiptap (Vue 2, Vue 3, React, **see full list**...)
    65  
    66  ## Reasons why tables are totally rad
    67  
    68  Here are a few reasons why tables are super hot right now.
    69  
    70  | Reason | Coolness factor | Approved |
    71  | --- | --- | --- |
    72  | They've got **columns** | 500 | ✅ |
    73  | And *rows* | 8000 | ✅ |
    74  | and different alignment | 20000 | 🔥 |
    75  
    76  ## **Contributing**
    77  
    78  Pull requests are welcome. For major changes, please open an issue first to discuss what [you would like](https://github.com) to change.
    79  
    80  Please make sure to update tests as appropriate.
    81  
    82  ## License
    83  
    84  The MIT License (MIT). Please see **License File** for more information.
    85  
    86  ```vue
    87  import { Editor } from "@tiptap/vue-3";
    88  import StarterKit from '@tiptap/starter-kit';
    89  import { createMarkdownEditor } from "tiptap-markdown";
    90  
    91  const MarkdownEditor = createMarkdownEditor(Editor);
    92  
    93  export default {
    94      mounted() {
    95          this.editor = new MarkdownEditor({
    96              content: "# Title",
    97              extensions: [
    98                  StarterKit,
    99              ],
   100          });
   101          const markdownOutput = this.editor.getMarkdown();
   102      }
   103  }
   104  ```
   105  
   106  ## **Keywords**
   107  
   108  none
   109  
   110  ```javascript
   111  for (var i=1; i <= 20; i++)
   112  {
   113    if (i % 15 == 0)
   114      console.log("FizzBuzz");
   115    else if (i % 3 == 0)
   116      console.log("Fizz");
   117    else if (i % 5 == 0)
   118      console.log("Buzz");
   119    else
   120      console.log(i);
   121  }
   122  ```
   123  
   124  Press Command/Ctrl + Enter to leave the fenced code block and continue typing in boring paragraphs.
   125  
   126  ```php
   127  <?php
   128  
   129  class MyTestClass {
   130    public function setting() {}
   131  }
   132  
   133  function getInfo() {
   134  }
   135  ```
   136  
   137  ```go
   138  package main
   139  
   140  func main() {
   141    fmt.Println("ok")
   142  }
   143  ```
   144        </textarea
   145          >
   146          <button>Save</button>
   147        </form>
   148        <button onclick="console.log(editor.tiptapEditor.getHTML())">
   149          Get Value
   150        </button>
   151        <button onclick="console.log(editor.tiptapEditor.getMarkdown())">
   152          Get Value
   153        </button>
   154      </div>
   155      <script defer src="highlight-11.5.0.min.js"></script>
   156      <script defer src="editor.js"></script>
   157      <script>
   158        window.onload = () => {
   159          window.editor = new TetuaEditor(".content");
   160          console.log(window.editor.inititalized);
   161        };
   162      </script>
   163    </body>
   164  </html>