Skip to content

[enhancement]统一和优化部分文件格式相关说明 #15

@Normal-pcer

Description

@Normal-pcer

对于 JSON,YAML 等文件的格式,可以使用树状图的形式直观地说明文件格式。
image
如图,对于每一项都是用 "类型 键名: 描述" 的形式表述(用"{}"表示字典/对象/键值对,用"[]"表示列表/数组),并且支持展开/收起,其中标蓝的部分为可能会大量复用。
示例用HTML:

<!DOCTYPE html>
<html lang="zh-cn">
    <head>
        <meta charset="UTF-8" />
        <title>document</title>

        <style>
            body {
                font-family: consolas, "Microsoft YaHei", sans-serif;
            }
            ul {
                list-style-type: none;
            }
            .link {
                background-color: #aaf;
            }
            .tree li {
                display: block;
                position: relative;
                padding-left: 1rem;
                border-left: 1px solid #ccc;
            }
            .tree li:last-child {
                border-color: transparent;
            }
            .tree li::before {
                content: '';
                display: block;
                position: absolute;
                top: 0;
                left: -1px;
                width: 0.5rem;
                height: 1rem;
                border: solid #ccc;
                border-width: 0 0 1px 1px;

            }
            .tree span {
                display: block;
            }

            .tree ul {
                margin-left: 0.5rem;
                padding: 0;
                margin-top: 0;
                margin-bottom: 0;
            }

            .tree details {
                padding-top: 0.3rem;
                padding-bottom: 0.3rem;
            }
        </style>
    </head>
    <body>
        <details open class="tree">
            <summary>{} 谱面文件</summary>
            <ul>
                <li>
                    <details>
                        <summary>[] BPMList</summary>
                        <ul>
                            <li>
                                <details>
                                    <summary>{} BPMList中的项</summary>
                                    <ul>
                                        <li>float bpm: 一个BPM</li>
                                        <li>
                                            <details>
                                                <summary>
                                                    [3] startTime: 开始时间点
                                                    <span class="link"> 带分数格式 </span>
                                                </summary>
                                                <div class="link">
                                                    <ul>
                                                        <li>int [0]: 整数</li>
                                                        <li>int [1]: 分子</li>
                                                        <li>int [2]: 分母</li>
                                                    </ul>
                                                </div>
                                            </details>
                                        </li>
                                    </ul>
                                </details>
                            </li>
                        </ul>
                    </details>
                </li>
            </ul>
        </details>
    </body>
</html>

Metadata

Metadata

Assignees

No one assigned

    Labels

    enhancementNew feature or request

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions