taontech / githublog

一个基于github issues的博客系统,实时呈现,零依赖,零代码部署,不用打包不用上线。
4 stars 1 forks source link

markdown语法检测贴 #1

Open taontech opened 2 years ago

taontech commented 2 years ago

title: "Markdonw" date: 2022-03-22T12:27:53+08:00

Markdown 高级用法

⚠ WARNING: Aliens are coming.
A description of the colour, smell and dangerous behaviour of the aliens.

<body class="body_issuse">
    <div class="ownerline" >
        <div>
            <img id="headImg"></img>
        </div>

         <span class="ownerName owner-span" id="owner"></span>
         <a href="https://github.com/taontech/githublog" class="githublog_text"> Githublog </a>

    </div>
    <div id="title" class="titlestyle" > 
        <p>GithuBlog</p> 
    </div>
    <div id = "iss-container" class="iss-container" style="margin-top:30px; width: 100%;">
    </div> 
    <a href="javascript:history.go(-1)"> 返回上一页 </a>

</body>
var reader = new commonmark.Parser();
        var writer = new commonmark.HtmlRenderer({ sourcepos: true });

        var render = function(parsed) {
            if (parsed === undefined) {
                return;
            }
            var startTime = new Date().getTime();
            var result = writer.render(parsed);
            document.getElementById("iss-container").innerHTML=result;
        };
        var parseAndRender = function(text) {
            var parsed = reader.parse(text);
            render(parsed);
        };
        function getQueryVariable(variable)
        {
            var query = window.location.search.substring(1);
            var vars = query.split("&");
            for (var i=0;i<vars.length;i++) {
                    var pair = vars[i].split("=");
                    if(pair[0] == variable){return pair[1];}
            }
            return(false);
        }
void main(){
    vec3 pos;
    pos = aPosition;
    pos.x = 3.0 * sin(float(gl_VertexID)/400.0);
    pos.y = 3.0 * cos(float(gl_VertexID)/400.0);
    pos.z = float(gl_VertexID)/39000.0;
    pos.x = float(int(pos.x) % 20) + 3.0 * sin(float(gl_VertexID)/400.0);
    pos.y = float(int(pos.y) % 20) + 3.0 * cos(float(gl_VertexID)/400.0);
    pos.z = float(int(pos.z) % 20) + float(gl_VertexID)/39000.0;
    gl_Position = uProjectMatrix * uViewMatrix*uModelMatrix * vec4(pos.x, pos.y, pos.z, 1);

    gl_PointSize = uPointSize;
    vec3 hsl = vec3(float(gl_VertexID)/60000.0, 0.8, 0.8);
    vColor.rgb = hsb_rgb(hsl);
    vColor.a = 0.8;
}
        graph TD
          A[Christmas] -->|Get money| B(Go shopping)
          B --> C{Let me think}
          B --> G[/Another/]
          C ==>|One| D[Laptop]
          C -->|Two| E[iPhone]
          C -->|Three| F[fa:fa-car Car]
          subgraph section
            C
            D
            E
            F
            G
          end
graph LR
    A[Square Rect] -- Link text --> B((Circle))
    A --> C(Round Rect)
    B --> D{Rhombus}
    C --> D
pie
    title Key elements in Product X
    "Calcium" : 42.96
    "Potassium" : 50.05
    "Magnesium" : 10.01
    "Iron" :  5
erDiagram
    CAR ||--o{ NAMED-DRIVER : allows
    CAR {
        string registrationNumber
        string make
        string model
    }
    PERSON ||--o{ NAMED-DRIVER : is
    PERSON {
        string firstName
        string lastName
        int age
    }

可以成功的

stateDiagram
[*] --> Still
Still --> [*]
Still --> Moving
Moving --> Still
Moving --> Crash
Crash --> [*]
sequenceDiagram
    participant Alice
    participant Bob
    Alice->>John: Hello John, how are you?
    loop Healthcheck
        John->>John: Fight against hypochondria
    end
    Note right of John: Rational thoughts<br/>prevail...
    John-->>Alice: Great!
    John->>Bob: How about you?
    Bob-->>John: Jolly good!
gantt
dateFormat  YYYY-MM-DD
title 使用Mermaid增加甘特图
excludes weekdays 2014-01-10

section A 部分
已完成的任务            :done,    des1, 2014-01-06,2014-01-08
正在做的任务               :active,  des2, 2014-01-09, 3d
未完成任务1               :         des3, after des2, 5d
未完成任务2               :         des4, after des3, 5d
classDiagram
Class01 <|-- AveryLongClass : Cool
Class03 *-- Class04
Class05 o-- Class06
Class07 .. Class08
Class09 --> C2 : Where am i?
Class09 --* C3
Class09 --|> Class07
Class07 : equals()
Class07 : Object[] elementData
Class01 : size()
Class01 : int chimp
Class01 : int gorilla
Class08 <--> C2: Cool label
graph TD
    A[Christmas] -->|Get money| B(Go shopping)
    B --> C{Let me think}
    B --> G[/Another/]
    C ==>|One| D[Laptop]
    C -->|Two| E[iPhone]
    C -->|Three| F[fa:fa-car Car]
    C -->|Fr| H[hahah]
    subgraph section1

    H
    D
    G

    end
taontech commented 2 years ago

头像什么是逆天

taontech commented 2 years ago

主要是mermaid 的支持

taontech commented 2 years ago

taontech.top的评论

taontech commented 2 years ago

GitHub的评论