185 lines
8.2 KiB
HTML
185 lines
8.2 KiB
HTML
<html data-color-mode="light" data-dark-theme="dark" data-light-theme="light">
|
|
<head>
|
|
<meta content="text/html; charset=utf-8" http-equiv="content-type" />
|
|
<meta name="viewport" content="width=device-width,initial-scale=1.0">
|
|
<meta http-equiv="X-UA-Compatible" content="IE=edge">
|
|
<link href="https://unpkg.com/@primer/css@^21.0.7/dist/primer.css" rel="stylesheet" />
|
|
|
|
</head>
|
|
<style>
|
|
|
|
.markdown-body {
|
|
box-sizing: border-box;
|
|
min-width: 200px;
|
|
max-width: 900px;
|
|
margin: 20px auto;
|
|
padding: 45px;
|
|
font-family: sans-serif;
|
|
}
|
|
@media (max-width: 767px) {
|
|
.markdown-body { padding: 8px;}
|
|
.subnav-search form{display:none;}
|
|
.subnav-search svg{display:none;}
|
|
.SideNav-item .listLabels{display:none;}
|
|
}
|
|
|
|
h1 {display:flex;}
|
|
h1 a{margin-left: 4px;margin-top: 16px;}
|
|
.title-right{display:flex;margin:auto 0 0 auto;}
|
|
.title-right button{margin-right:8px;padding:16px;}
|
|
|
|
.subnav-search{display:flex;margin-top:8px;margin-right:16px;}
|
|
.subnav-search-input{width:160px;border-top-right-radius:0px;border-bottom-right-radius:0px;}
|
|
.subnav-search form{margin-bottom:0;}
|
|
.subnav-search button{padding:5px 8px;border-top-left-radius:0px;border-bottom-left-radius:0px;}
|
|
|
|
.avatar {transition: 0.8s;}
|
|
.avatar:hover {transform: scale(1.15) rotate(360deg);}
|
|
|
|
.SideNav{min-width: 360px;}
|
|
.SideNav-icon{margin-right: 16px}
|
|
.SideNav-item .Label{color: #fff;margin-left:8px;}
|
|
.footer {margin: 40px auto; text-align: center;font-size: small;}
|
|
</style>
|
|
|
|
<body>
|
|
<div class="markdown-body">
|
|
<h1>
|
|
<img src='' size="64" height="64" width="64" class="avatar circle" id="avatarImg"><a style="font-family:Monaco;" id="blogTitle"></a>
|
|
|
|
<div class="title-right">
|
|
|
|
<div class="subnav-search">
|
|
<form action="https://www.google.com/search" method="get" target="_blank"><input type="search" name="q" class="form-control subnav-search-input" aria-label="Search site" value=""><button class="btn" type="submit">Search</button></form>
|
|
<svg class="subnav-search-icon octicon octicon-search" width="16" height="16" viewBox="0 0 16 16" aria-hidden="true"> <path id="searchSVG" fill-rule="evenodd" d=""></path></svg>
|
|
</div>
|
|
|
|
<button id="buttonLink" style="display: none;" class="btn btn-invisible circle" onclick="window.location.href='/link.html'" title="友情链接"><svg class="octicon" width="16" height="16" ><path fill-rule="evenodd"></path></svg></button>
|
|
|
|
<button id="buttonAbout" style="display: none;" class="btn btn-invisible circle" onclick="window.location.href='/about.html'" title="关于"><svg class="octicon" width="16" height="16" ><path fill-rule="evenodd"></path></svg></button>
|
|
|
|
<div><button id="changeTheme" class="btn btn-invisible circle" onclick="modeSwitch()" title="切换主题"><svg class="octicon" width="16" height="16" ><path id="themeSwitch" fill-rule="evenodd"></path></svg></button></div>
|
|
|
|
|
|
</div>
|
|
</h1>
|
|
<div id="blogSubTitle"></div><p></p>
|
|
<nav class="SideNav border"id="navList"></nav>
|
|
<div class="footer">Copyright © <span id="year"></span> <a id="footerblogTitle" href=""></a> <p><span id="filingNum"></span><span id="runday"></span>Powered by <a href="https://github.com/Meekdai/Gmeek" target="_blank">Gmeek</a></p></div>
|
|
</div>
|
|
|
|
</body>
|
|
<script src="./static/icon.js"></script>
|
|
<script>
|
|
|
|
var blogBase=%s
|
|
if(blogBase["startSite"]!=""){
|
|
var now=new Date();
|
|
var startSite=new Date(blogBase["startSite"]);
|
|
var diff=now.getTime()-startSite.getTime();
|
|
var diffDay=Math.floor(diff/(1000*60*60*24));
|
|
document.getElementById("year").innerHTML=now.getFullYear();
|
|
document.getElementById("runday").innerHTML="Blog run "+diffDay+" days • ";
|
|
}
|
|
|
|
var postListJson=blogBase["postListJson"]
|
|
|
|
document.title=blogBase["title"];
|
|
document.getElementById("avatarImg").src=blogBase["avatarUrl"];
|
|
document.getElementById("blogTitle").innerHTML=blogBase["title"].substring(1);
|
|
document.getElementById("blogSubTitle").innerHTML=blogBase["subTitle"];
|
|
if(blogBase["filingNum"]!=""){document.getElementById("filingNum").innerHTML=blogBase["filingNum"]+" • ";}
|
|
document.getElementById("footerblogTitle").innerHTML=blogBase["title"];
|
|
document.getElementById("footerblogTitle").href=blogBase["homeUrl"];
|
|
|
|
var navList=document.getElementById("navList");
|
|
|
|
if(blogBase["faviconUrl"]!=""){
|
|
link=document.createElement("link");
|
|
link.setAttribute("rel","icon");
|
|
link.setAttribute("href",blogBase["faviconUrl"]);
|
|
document.head.appendChild(link);
|
|
}
|
|
|
|
for(var num in postListJson){
|
|
if(blogBase["singlePage"].indexOf(postListJson[num]["label"])==-1){
|
|
SideNavItem=document.createElement("a");
|
|
SideNavItem.setAttribute("class", "SideNav-item d-flex flex-items-center flex-justify-between");
|
|
SideNavItem.setAttribute("href", postListJson[num]["postUrl"]);
|
|
|
|
div=document.createElement("div");
|
|
svg=document.createElementNS('http://www.w3.org/2000/svg','svg');
|
|
path=document.createElementNS("http://www.w3.org/2000/svg","path");
|
|
span=document.createElement("span");
|
|
div.setAttribute("class","d-flex flex-items-center");
|
|
svg.setAttributeNS(null,"class","SideNav-icon octicon");
|
|
svg.setAttributeNS(null,"style","witdh:16px;height:16px");
|
|
path.setAttributeNS(null, "d", IconList["post"]);
|
|
span.innerHTML=postListJson[num]["postTitle"];
|
|
svg.appendChild(path);
|
|
div.appendChild(svg);
|
|
div.appendChild(span);
|
|
SideNavItem.appendChild(div);
|
|
|
|
div=document.createElement("div");
|
|
div.setAttribute("class","listLabels");
|
|
|
|
if(postListJson[num]["commentNum"]>0){
|
|
span=document.createElement("span");
|
|
span.setAttribute("class","Label");
|
|
span.setAttribute("style","background-color:"+blogBase["commentLabelColor"]);
|
|
span.innerHTML=postListJson[num]["commentNum"];
|
|
div.appendChild(span);
|
|
}
|
|
|
|
span=document.createElement("span");
|
|
span.setAttribute("class","Label");
|
|
span.setAttribute("style","background-color:"+postListJson[num]["labelColor"]);
|
|
span.innerHTML=postListJson[num]["label"];
|
|
div.appendChild(span);
|
|
|
|
span=document.createElement("span");
|
|
span.setAttribute("class","Label");
|
|
span.setAttribute("style","background-color:"+postListJson[num]["dateLabelColor"]);
|
|
date=new Date(postListJson[num]["createdAt"] * 1000);
|
|
span.innerHTML=date.getFullYear()+"-"+(date.getMonth()+1 < 10 ? '0'+(date.getMonth()+1) : date.getMonth()+1)+"-"+(date.getDate() < 10 ? '0' + (date.getDate()) : date.getDate());
|
|
div.appendChild(span);
|
|
|
|
SideNavItem.appendChild(div);
|
|
navList.appendChild(SideNavItem);
|
|
}
|
|
else{
|
|
if(postListJson[num]["label"]=="link"){
|
|
document.getElementById("buttonLink").childNodes[0].childNodes[0].setAttribute("d",value=IconList["link"]);
|
|
document.getElementById("buttonLink").style="display:block";
|
|
}
|
|
else if(postListJson[num]["label"]=="about"){
|
|
document.getElementById("buttonAbout").childNodes[0].childNodes[0].setAttribute("d",value=IconList["person"]);
|
|
document.getElementById("buttonAbout").style="display:block";
|
|
}
|
|
}
|
|
}
|
|
|
|
|
|
document.getElementById("searchSVG").setAttribute("d",value=IconList["search"]);
|
|
document.getElementById("themeSwitch").setAttribute("d",value=IconList["sun"]);
|
|
if(localStorage.getItem("meek_theme")==null){localStorage.setItem("meek_theme","light")}
|
|
else if(localStorage.getItem("meek_theme")=="dark"){changeDark();}
|
|
else if(localStorage.getItem("meek_theme")=="light"){changeLight();}
|
|
|
|
function changeDark(){
|
|
document.getElementsByTagName("html")[0].attributes.getNamedItem("data-color-mode").value="dark";
|
|
document.getElementById("themeSwitch").attributes.getNamedItem("d").value=IconList["moon"];
|
|
}
|
|
function changeLight(){
|
|
document.getElementsByTagName("html")[0].attributes.getNamedItem("data-color-mode").value="light";
|
|
document.getElementById("themeSwitch").attributes.getNamedItem("d").value=IconList["sun"];
|
|
}
|
|
function modeSwitch(){
|
|
if(document.getElementsByTagName("html")[0].attributes[0].value=="light"){changeDark();localStorage.setItem("meek_theme","dark");}
|
|
else{changeLight();localStorage.setItem("meek_theme","light");}
|
|
}
|
|
|
|
</script>
|
|
</html>
|