<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">

<head>
    <title th:text="${article.title}">详情</title>
    <meta charset="utf-8"></meta>
    <meta name="viewport" content="width=device-width, initial-scale=1, user-scalable=0">
    <meta name="ext_logo" content="/profile/media/template/logo.png">
    <meta th:if="${!#strings.isEmpty(article.image)}" name="ext_image" th:content="${article.image}">
    <th:block th:each="item : ${article.meta}" ><meta th:name="'ext_' + ${item.getKey()}" th:content="${item.getValue()}">
    </th:block>
    <th:block th:each="item, itemStat: ${T(java.util.regex.Pattern).compile('<video[^>]+>.*src=\x22([^\x22]+)\x22.*.</video>.*').matcher(article.content).results().toArray()}"><meta th:name="'ext_videoLink' + ${itemStat.index+1}" th:content="${item.group(1)}">
    </th:block>
</head>
<style>
    body, html {
        padding: 0;
        margin: 0;
    }

    body {
        width: 100%;
    }

    .textBox {
        width: 90%;
        margin: 0 auto;
        background: #fff;
        position: relative;
    }

    .title {
        width: 100%;
        margin: 0 auto;
        text-align: center;
        font-size: 1.5em;
        font-weight: 700;
        color: #000000;
        line-height: 30px;
        margin-top: 30px;
    }

    .date {
        display: flex;
        width: 100%;
        margin: 0 auto;
        margin-top: 36px;
    }

    .dateTitle {
        font-size: 12px;
        font-family: Source Han Sans CN;
        font-weight: 500;
        color: #A5A5A5;
    }

    .time {
        font-size: 12px;
        font-family: Source Han Sans CN;
        font-weight: 500;
        color: #009BFF;

    }

    .content {
        width: 100%;
        margin: 0 auto;
        margin-top: 36px;
    }

    body::-webkit-scrollbar {
        display: none
    }

    video {
        width: 100%;
    }
</style>
<body>
<div class="textBox">
    <div class="title"> [(${article.title})]</div>
    <div class="date">
        <div class="dateTitle">发布时间：</div>
        <div class="time">[(${publishTime})]</div>
    </div>
    <div class="content" th:utext="${article.content.replaceAll('<p[^>]*>\s*<br>\s*<\/p>\s*<div data-w-e-type=\x22video\x22 data-w-e-is-void.*>\s*<video[^>]+>.*<\/video>\s*<\/div>', '<!--video-->')}"></div>
</div>
</body>

</html>
