<!doctype html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
    <title>首页-Quinn</title>
    <link rel="stylesheet" th:href="@{/bootstrap/css/bootstrap.min.css}">
    <link rel="stylesheet" th:href="@{/css/backgroud.css}">
</head>
<style>
    #register{
        background: url(/images/menu/register.png) no-repeat;
        background-size: 100% 100%;
        height: 400px;
    }
    .inverted{
        background: url(data:image/gif;base64,iVBORw0KGgoAAAANSUhEUgAAAAQAAAAECAIAAAAmkwkpAAAAHklEQVQImWNkYGBgYGD4//8/A5wF5SBYyAr+//8PAPOCFO0Q2zq7AAAAAElFTkSuQmCC) repeat;text-shadow: 5px -5px black, 4px -4px white;font-weight: bold;-webkit-text-fill-color: transparent;-webkit-background-clip: text
    }
    .invertedContent p{
        text-align: center;
        background: url(data:image/gif;base64,iVBORw0KGgoAAAANSUhEUgAAAAQAAAAECAIAAAAmkwkpAAAAHklEQVQImWNkYGBgYGD4//8/A5wF5SBYyAr+//8PAPOCFO0Q2zq7AAAAAElFTkSuQmCC) repeat;text-shadow: 2px -2px black, 1px -1px white;font-weight: bold;-webkit-text-fill-color: transparent;-webkit-background-clip: text
    }
    #fastLink{
        font-size: 20px;
    }
</style>
<body>

<div th:replace="~{common/header::header(activeUrl='index.html')}"></div>
<main role="main">
    <div class="container ">
        <div class="jumbotron jumbotron-fluid mt-5">
            <div class="container">
                <h2 style="margin: 0;padding: 0;text-align: center;color: #3A3A3A;font-size: 30px;">
                    <span style="width: 20px;height: 20px;background: #00C6FF;display: inline-block;position: relative;left: 10px;top: 5px;">
                    </span>
                    <i style="width: 20px;height: 20px;z-index: 2;background: #FFB900;display: inline-block;position: relative;left: -30px;top: 10px;">
                    </i>
                    <strong style="position: relative;">QUINN</strong>
                    <b style="width: 20px;height: 20px;background: #00C6FF;display: inline-block;position: relative;left: 40px;top: 5px;">
                    </b>
                    <em style="width: 20px;height: 20px;background: #FFB900;display: inline-block;position: relative;left: 0px;top: 10px;">
                    </em>
                </h2>
                <p style="margin: 0;padding: 0;text-align: center;color: #969696;	font-size: 14px;">
                    私人博客平台
                </p>
                <br/>
                <div class="lead invertedContent">
                    <p>欢迎访问</p>
                    <p><svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-lightbulb-fill" viewBox="0 0 16 16">
                        <path d="M2 6a6 6 0 1 1 10.174 4.31c-.203.196-.359.4-.453.619l-.762 1.769A.5.5 0 0 1 10.5 13h-5a.5.5 0 0 1-.46-.302l-.761-1.77a1.964 1.964 0 0 0-.453-.618A5.984 5.984 0 0 1 2 6zm3 8.5a.5.5 0 0 1 .5-.5h5a.5.5 0 0 1 0 1l-.224.447a1 1 0 0 1-.894.553H6.618a1 1 0 0 1-.894-.553L5.5 15a.5.5 0 0 1-.5-.5z"/>
                    </svg>
                        Quinn 包含资源推荐，资源分享，论坛交流模块</p>
                    <p>戳下方了解详情↓↓↓</p>
                </div>
                <div id="fastLink" class="row">
                    <div class="col-md-4"></div>
                    <div class="ml-2 col-md-1">
                        <a th:href="@{/blog/read/1}" class="text-dark font-weight-bold text-decoration-none">
                            <p class= "badge badge-pill badge-dark">注册说明
                                <svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-postcard-fill" viewBox="0 0 16 16">
                                    <path d="M11 8h2V6h-2v2Z"/>
                                    <path d="M0 4a2 2 0 0 1 2-2h12a2 2 0 0 1 2 2v8a2 2 0 0 1-2 2H2a2 2 0 0 1-2-2V4Zm8.5.5a.5.5 0 0 0-1 0v7a.5.5 0 0 0 1 0v-7ZM2 5.5a.5.5 0 0 0 .5.5H6a.5.5 0 0 0 0-1H2.5a.5.5 0 0 0-.5.5ZM2.5 7a.5.5 0 0 0 0 1H6a.5.5 0 0 0 0-1H2.5ZM2 9.5a.5.5 0 0 0 .5.5H6a.5.5 0 0 0 0-1H2.5a.5.5 0 0 0-.5.5Zm8-4v3a.5.5 0 0 0 .5.5h3a.5.5 0 0 0 .5-.5v-3a.5.5 0 0 0-.5-.5h-3a.5.5 0 0 0-.5.5Z"/>
                                </svg>
                            </p>
                        </a>
                    </div>
                    <div class="ml-2 col-md-1">
                        <a th:href="@{/blog/read/2}" class="text-dark font-weight-bold text-decoration-none">
                            <p class="badge badge-pill badge-success">网站建设
                                <svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-postcard-fill" viewBox="0 0 16 16">
                                    <path d="M11 8h2V6h-2v2Z"/>
                                    <path d="M0 4a2 2 0 0 1 2-2h12a2 2 0 0 1 2 2v8a2 2 0 0 1-2 2H2a2 2 0 0 1-2-2V4Zm8.5.5a.5.5 0 0 0-1 0v7a.5.5 0 0 0 1 0v-7ZM2 5.5a.5.5 0 0 0 .5.5H6a.5.5 0 0 0 0-1H2.5a.5.5 0 0 0-.5.5ZM2.5 7a.5.5 0 0 0 0 1H6a.5.5 0 0 0 0-1H2.5ZM2 9.5a.5.5 0 0 0 .5.5H6a.5.5 0 0 0 0-1H2.5a.5.5 0 0 0-.5.5Zm8-4v3a.5.5 0 0 0 .5.5h3a.5.5 0 0 0 .5-.5v-3a.5.5 0 0 0-.5-.5h-3a.5.5 0 0 0-.5.5Z"/>
                                </svg>
                            </p>
                        </a>
                    </div>
                    <div class="ml-2 col-md-1">
                        <a th:href="@{/blog/read/3}" class="text-dark font-weight-bold text-decoration-none">
                            <p class="badge badge-pill badge-warning">建议反馈
                                <svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-postcard-fill" viewBox="0 0 16 16">
                                    <path d="M11 8h2V6h-2v2Z"/>
                                    <path d="M0 4a2 2 0 0 1 2-2h12a2 2 0 0 1 2 2v8a2 2 0 0 1-2 2H2a2 2 0 0 1-2-2V4Zm8.5.5a.5.5 0 0 0-1 0v7a.5.5 0 0 0 1 0v-7ZM2 5.5a.5.5 0 0 0 .5.5H6a.5.5 0 0 0 0-1H2.5a.5.5 0 0 0-.5.5ZM2.5 7a.5.5 0 0 0 0 1H6a.5.5 0 0 0 0-1H2.5ZM2 9.5a.5.5 0 0 0 .5.5H6a.5.5 0 0 0 0-1H2.5a.5.5 0 0 0-.5.5Zm8-4v3a.5.5 0 0 0 .5.5h3a.5.5 0 0 0 .5-.5v-3a.5.5 0 0 0-.5-.5h-3a.5.5 0 0 0-.5.5Z"/>
                                </svg>
                            </p>
                        </a>
                    </div>
                    <div class="col-md-4"></div>
                </div>
            </div>
        </div>
        <div id="register" class="mt-3">

        </div>
    </div>
</main>

<div th:replace="~{common/footer::footer}"></div>
<div class="to-top">
    <img class="d-block pl-2" src="/images/logo/qrcode.png" width="50" height="50">
    <a class="badge badge-light">返回顶部</a>
</div>
<script th:src="@{/js/jquery-3.5.1.min.js}"></script>
<script th:src="@{/bootstrap/js/bootstrap.bundle.min.js}"></script>
<script th:src="@{/js/toTop.js}"></script>
<script th:src="@{/js/jquery-ui.min.js}"></script>
<script th:src="@{/live/js/addlive2d.js}"></script>
</body>
</html>
