修改样式，使得 diagram 更加紧凑

css/documentation.css

@@ -566,21 +566,21 @@ img {
 .diagram-container .digrame-port-item {
     display: flex;
     justify-content: space-between;
-    height: 60px;
+    height: 40px;
 }
 
 .diagram-container .i-port-name {
-    font-size: 20px;
+    font-size: 16px;
     padding: 3px 8px;
 }
 
 .diagram-container .o-port-name {
-    font-size: 20px;
+    font-size: 16px;
     padding: 3px 8px;
 }
 
 .diagram-container .io-port-name {
-    font-size: 20px;
+    font-size: 16px;
     padding: 3px 8px;
 
 }
@@ -600,7 +600,7 @@ img {
 }
 
 .diagram-container .arrow-wrapper {
-    height: 60px;
+    height: 40px;
 }
 
 .diagram-container .port-width-left-caption {

src/function/hdlDoc/common.ts

@@ -175,7 +175,7 @@ abstract class RenderString {
         this.type = type;
     }
 
-    abstract render(): string;
+    abstract render(userStyle?: ThemeType): string;
 }
 
 interface MarkdownStringValue {
@@ -262,8 +262,8 @@ class WavedromString extends RenderString {
     add(text: string) {
         this.value += text;
     }
-    render(): string {
-        const style = getThemeColorKind();
+    render(userStyle?: ThemeType): string {
+        const style = userStyle ? userStyle : getThemeColorKind();
         return makeWaveDromSVG(this.value, style);
     }
 };

src/function/hdlDoc/html.ts

@@ -7,6 +7,7 @@ import { opeParam, MainOutput, AbsPath } from '../../global';
 import { Count, MarkdownString, WavedromString } from './common';
 import { getRenderList, getCurrentRenderList } from './markdown';
 import { hdlPath, hdlIcon, hdlFile } from '../../hdlFs'; 
+import { ThemeType } from '../../global/enum';
 
 const _cache = {
     css : ''
@@ -102,7 +103,7 @@ function makeWavedromRenderErrorHTML() {
  * @description make the html string of a finial display style
  * @param usage in whick module is used
  */
-async function makeShowHTML(usage: string): Promise<string> {
+async function makeShowHTML(usage: 'webview' | 'pdf' | 'html' | 'markdown'): Promise<string> {
     const renderList = await getCurrentRenderList();
     if (!renderList || renderList.length === 0) {
         return '';
@@ -110,9 +111,10 @@ async function makeShowHTML(usage: string): Promise<string> {
 
     // start to render the real html
     let body = '';
+    const userStyle = (usage === 'webview' || usage === 'markdown') ? undefined : ThemeType.Light;
 
     for (const r of renderList) {
-        const renderResult = r.render();
+        const renderResult = r.render(userStyle);
         if (renderResult) {
             if (r instanceof MarkdownString) {
                 body += makeCommonElement(renderResult);