Home Explore Help
Register Sign In
Apq
/
vditor
mirror of https://github.com/Vanessa219/vditor.git
1
0
Fork 0
Files Issues 0 Wiki
Browse Source

:zap: 为脚注时不需要到顶层列表

Liyuan Li 5 years ago
parent
7a525f8657
commit
066f596a64
4 changed files with 42 additions and 19 deletions
Split View Show Diff Stats
  1. 18 5
      demo/index.html
  2. 1 1
      demo/index.js
  3. 22 12
      demo/render.html
  4. 1 1
      src/ts/wysiwyg/input.ts

+ 18 - 5
demo/index.html
View File 

@@ -37,23 +37,36 @@
 
     <meta property="og:image" content="https://cdn.jsdelivr.net/npm/vditor/src/assets/images/logo.png"/>
 
     <meta name="twitter:image" content="https://cdn.jsdelivr.net/npm/vditor/src/assets/images/logo.png"/>
 
     <style>
 
+        body {
 
+            margin: 0;
 
+        }
 
+
 
+        .nav {
 
+            text-align: center;
 
+            margin: 20px 0
 
+        }
 
+
 
         a {
 
             color: #4285f4;
 
         }
 
+
 
+        #vditor {
 
+            margin: 0 20px 20px;
 
+        }
 
     </style>
 
     <script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/vconsole.min.js"></script>
 
 </head>
 
 <body>
 
-<h2>
 
-    <a href="https://vditor.b3log.org" target="_blank">官网</a> |
 
-    <a href="/render.html">Render</a> |
 
+<div class="vditor-reset nav">
 
+    <a href="https://vditor.b3log.org" target="_blank">官网</a> &nbsp; &nbsp;
 
+    <a href="/render.html">Render</a> &nbsp; &nbsp;
 
     <button onclick="window.vditor.setTheme('dark', 'dark',  'native');document.querySelector('body').style.backgroundColor='#2f363d'">
 
         Dark Mode
 
-    </button>
 
+    </button> &nbsp; &nbsp;
 
     <button onclick="window.vditor.setTheme('light', 'light', 'github');document.querySelector('body').style.backgroundColor=''">
 
         Light Mode
 
     </button>
 
-</h2>
 
+</div>
 
 <div id="vditor">
 
 <h1>Vditor</h1>
 
 <ul>

+ 1 - 1
demo/index.js
View File 

@@ -53,7 +53,7 @@ window.vditor = new Vditor('vditor', {
 
   // _lutePath: `http://192.168.0.107:9090/lute.min.js?${new Date().getTime()}`,
 
   _lutePath: 'src/js/lute/lute.min.js',
 
   toolbar,
 
-  mode: 'sv',
 
+  mode: 'wysiwyg',
 
   height: window.innerHeight + 100,
 
   outline: true,
 
   debugger: true,

+ 22 - 12
demo/render.html
View File 

@@ -37,13 +37,23 @@
 
     <meta property="og:image" content="https://cdn.jsdelivr.net/npm/vditor/src/assets/images/logo.png"/>
 
     <meta name="twitter:image" content="https://cdn.jsdelivr.net/npm/vditor/src/assets/images/logo.png"/>
 
     <style>
 
+        body {
 
+            margin: 0;
 
+        }
 
+
 
+        .nav {
 
+            text-align: center;
 
+            margin: 20px 0
 
+        }
 
+
 
+
 
         .link {
 
             cursor: pointer;
 
             color: #4285f4;
 
         }
 
 
         #previewWrap {
 
-            padding: 0 220px 20px 0;
 
+            padding: 0 226px 20px 20px;
 
         }
 
 
         #preview {
 
@@ -55,7 +65,7 @@
 
             display: none;
 
             position: fixed;
 
             width: 186px;
 
-            top: 20px;
 
+            top: 64px;
 
             right: 20px;
 
             bottom: 20px;
 
             overflow: auto;
 
@@ -150,17 +160,17 @@
 
     </style>
 
 </head>
 
 <body>
 
-<h2>
 
-    <a class="link" href="https://vditor.b3log.org" target="_blank">官网</a> |
 
-    <a class="link" href="/">Editor</a> |
 
-    <button onclick="setTheme('dark')">Dark Mode</button>
 
+<div class="vditor-reset nav">
 
+    <a class="link" href="https://vditor.b3log.org" target="_blank">官网</a> &nbsp; &nbsp;
 
+    <a class="link" href="/">Editor</a> &nbsp; &nbsp;
 
+    <button onclick="setTheme('dark')">Dark Mode</button> &nbsp; &nbsp;
 
     <button onclick="setTheme('light')">Light Mode</button>
 
-</h2>
 
-<div class="markdown-list">
 
-    <span class="link" data-file="zh_CN">zh_CN</span> |
 
-    <span class="link" data-file="ko_KR">ko_KR</span> |
 
-    <span class="link" data-file="cute-list">cute-list</span> |
 
-    <span class="link" data-file="entity">entity</span> |
 
+</div>
 
+<div class="markdown-list nav">
 
+    <span class="link" data-file="zh_CN">zh_CN</span> &nbsp; &nbsp;
 
+    <span class="link" data-file="ko_KR">ko_KR</span> &nbsp; &nbsp;
 
+    <span class="link" data-file="cute-list">cute-list</span> &nbsp; &nbsp;
 
+    <span class="link" data-file="entity">entity</span> &nbsp; &nbsp;
 
 </div>
 
 <div id="previewWrap">
 
     <div id="preview" class="preview"></div>

+ 1 - 1
src/ts/wysiwyg/input.ts
View File 

@@ -60,7 +60,7 @@ export const input = (vditor: IVditor, range: Range, event?: InputEvent) => {
 
         if (!isWYSIWYGElement) {
 
             // 列表需要到最顶层
 
             const topListElement = getTopList(range.startContainer);
 
-            if (topListElement) {
 
+            if (topListElement && !footnoteElement) {
 
                 const blockquoteElement = hasClosestByTag(range.startContainer, "BLOCKQUOTE");
 
                 if (blockquoteElement) {
 
                     // li 中有 blockquote 就只渲染 blockquote