feat(custom-block): 新增全宽显示功能 | Add full-width display function.

public/i18n/en_US.json

@@ -21,6 +21,9 @@
         },
         "custom-block-style": {
             "label": "Block Style"
+        },
+        "custom-block-width-full": {
+            "label": "Full-width Display"
         }
     }
 }

public/i18n/zh_CHT.json

@@ -21,6 +21,9 @@
         },
         "custom-block-style": {
             "label": "塊樣式"
+        },
+        "custom-block-width-full": {
+            "label": "全寬顯示"
         }
     }
 }

public/i18n/zh_CN.json

@@ -21,6 +21,9 @@
         },
         "custom-block-style": {
             "label": "块样式"
+        },
+        "custom-block-width-full": {
+            "label": "全宽显示"
         }
     }
 }

src/configs/default.ts

@@ -46,7 +46,7 @@ export const DEFAULT_CONFIG: IConfig = {
             ],
         },
         { // 分割线
-            id: "custom-block-separator-1",
+            id: "custom-block-separator-0",
             enable: true,
             mode: MenuItemMode.separator,
             multi: false,
@@ -55,6 +55,37 @@ export const DEFAULT_CONFIG: IConfig = {
                 [sdk.siyuan.NodeType.NodeDocument]: { enable: false },
             },
         },
+        { // 全宽显示
+            id: "custom-block-width-full",
+            enable: true,
+            mode: MenuItemMode.button,
+            multi: true,
+            icon: "iconHideDock",
+            accelerator: "width: full",
+            token: "width-full",
+            type: {
+                default: { enable: false },
+                [sdk.siyuan.NodeType.NodeAudio]: { enable: true },
+                [sdk.siyuan.NodeType.NodeIFrame]: { enable: true },
+                [sdk.siyuan.NodeType.NodeVideo]: { enable: true },
+                [sdk.siyuan.NodeType.NodeWidget]: { enable: true },
+            },
+            tasks: [
+                {
+                    type: TaskType.toggle,
+                    params: {
+                        name: "custom-block-width",
+                        token: "full",
+                    },
+                },
+            ],
+        },
+        { // 分割线
+            id: "custom-block-separator-1",
+            enable: true,
+            mode: MenuItemMode.separator,
+            multi: false,
+        },
         { // 弹幕
             id: "custom-block-render-danmaku",
             enable: true,

src/styles/custom-block-width-full.less

@@ -0,0 +1,36 @@
+// Copyright (C) 2023 Zuoqiu Yingyi
+// 
+// This program is free software: you can redistribute it and/or modify
+// it under the terms of the GNU Affero General Public License as
+// published by the Free Software Foundation, either version 3 of the
+// License, or (at your option) any later version.
+// 
+// This program is distributed in the hope that it will be useful,
+// but WITHOUT ANY WARRANTY; without even the implied warranty of
+// MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
+// GNU Affero General Public License for more details.
+// 
+// You should have received a copy of the GNU Affero General Public License
+// along with this program.  If not, see <http://www.gnu.org/licenses/>.
+
+/* 全宽显示 */
+
+:root {
+    &[plugin-custom-block~=width-full] {
+        .protyle-wysiwyg {
+            [custom-block-width~=full] {
+                &[data-node-id] {
+                    .iframe-content {
+
+                        &,
+                        >iframe,
+                        >video,
+                        >audio {
+                            width: 100% !important;
+                        }
+                    }
+                }
+            }
+        }
+    }
+}

src/styles/index.less

@@ -21,3 +21,4 @@
 @import (once) url(./custom-block-render-index.less);
 @import (once) url(./custom-block-render-outline.less);
 @import (once) url(./custom-block-render-scroll.less);
+@import (once) url(./custom-block-width-full.less);