-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathindex.html
33 lines (27 loc) · 9.44 KB
/
index.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
<!DOCTYPE html><html lang="zh-CN"><head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, shrink-to-fit=no"><meta name="renderer" content="webkit"><meta name="force-rendering" content="webkit"><meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"><meta name="keywords" content="TAiONS,歌词图片,歌词海报,歌词海报生成器,网易云音乐"><meta name="description" content="一个名为TAiONS的在线歌词海报生成器。"><meta property="og:locale" content="zh_CN"><meta property="og:type" content="website"><meta property="og:title" content="TAiONS | 歌词海报生成器"><meta property="og:description" content="一个名为TAiONS的在线歌词海报生成器。"><meta property="og:url" content="https://taions.nonon.moe/"><meta property="og:site_name" content="TAiONS | 歌词海报生成器"><meta property="og:image" content="https://oss.yuuiki.cn/2022/01/29/38bc1afab573210ec7552fcd3166b901.png"><meta property="og:image:width" content="498"><meta property="og:image:height" content="122"><link rel="stylesheet" href="https://oss.yuuiki.cn/site/css/all.css"><link rel="stylesheet" href="./bootstrap/css/bootstrap.css"><link rel="stylesheet" href="./css/lyricsposter.css"><link rel="shortcut icon" href="./assetes/favicon.ico" type="image/x-icon"><link href="https://cdn.jsdelivr.net/npm/aplayer@1.10.1/dist/APlayer.min.css" rel="stylesheet"><script src="https://cdn.jsdelivr.net/npm/aplayer@1.10.1/dist/APlayer.min.js"></script><script src="https://cdn.jsdelivr.net/npm/meting@2.0.1/dist/Meting.min.js"></script><script src="https://oss.yuuiki.cn/site/js/jquery-3.6.0.js"></script><script src="https://oss.yuuiki.cn/site/js/color-thief.min.js"></script><script src="https://oss.yuuiki.cn/site/js/html2canvas.min.js"></script><script src="https://oss.yuuiki.cn/site/js/FileSaver.min.js"></script><script src="./js/former.js"></script><script src="./bootstrap/js/bootstrap.js"></script><script async defer data-website-id="a5a63a10-2ef8-46a0-9094-169e2184a9a5" src="https://umami.yuuikic.com/umami.js"></script><title>TAiONS | 歌词海报生成器</title></head><body><a href="https://github.com/Yuuikic/LyricsPoster" class="github-corner" aria-label="View source on GitHub" target="_blank"><svg width="80" height="80" viewbox="0 0 250 250" style="fill:#FD6C6C; color:#fff; position: absolute; top: 0; border: 0; right: 0;" aria-hidden="true"><path d="M0,0 L115,115 L130,115 L142,142 L250,250 L250,0 Z"></path><path d="M128.3,109.0 C113.8,99.7 119.0,89.6 119.0,89.6 C122.0,82.7 120.5,78.6 120.5,78.6 C119.2,72.0 123.4,76.3 123.4,76.3 C127.3,80.9 125.5,87.3 125.5,87.3 C122.9,97.6 130.6,101.9 134.4,103.2" fill="currentColor" style="transform-origin: 130px 106px;" class="octo-arm"></path><path d="M115.0,115.0 C114.9,115.1 118.7,116.5 119.8,115.4 L133.7,101.6 C136.9,99.2 139.9,98.4 142.2,98.6 C133.8,88.0 127.5,74.4 143.8,58.0 C148.5,53.4 154.0,51.2 159.7,51.0 C160.3,49.4 163.2,43.6 171.4,40.1 C171.4,40.1 176.1,42.5 178.8,56.2 C183.1,58.6 187.2,61.8 190.9,65.4 C194.5,69.0 197.7,73.2 200.1,77.6 C213.8,80.2 216.3,84.9 216.3,84.9 C212.7,93.1 206.9,96.0 205.4,96.6 C205.1,102.4 203.0,107.8 198.3,112.5 C181.9,128.9 168.3,122.5 157.7,114.1 C157.9,116.9 156.7,120.9 152.7,124.9 L141.0,136.5 C139.8,137.7 141.6,141.9 141.8,141.8 Z" fill="currentColor" class="octo-body"></path></svg></a><style>
.github-corner:hover .octo-arm {
animation: octocat-wave 560ms ease-in-out
}
@keyframes octocat-wave {
0%,
100% {
transform: rotate(0)
}
20%,
60% {
transform: rotate(-25deg)
}
40%,
80% {
transform: rotate(10deg)
}
}
@media (max-width:500px) {
.github-corner:hover .octo-arm {
animation: none
}
.github-corner .octo-arm {
animation: octocat-wave 560ms ease-in-out
}
}
</style><div class="container-fluid page"><a href="https://taions.nonon.moe/"><div class="site-title-1 text-center col-xs-6 col-md-3 col-md-offset-2">Poster</div><div class="site-title-2 text-center col-xs-6 col-md-3 col-md-offset-2">Lyrics</div></a><div class="row"><div class="col-md-3 search" style="padding: 0 3vh;"><div class="row"><form action="#" method="post" role="form" class="text-center"><input id="imgButton" type="image" onclick="query(); getinfo(); return false;" src="https://oss.yuuiki.cn/2022/01/22/2f552f50f8f7de99af0842fe67110d73.png"><div class="form-group"><input type="text" class="form-control" id="search-form" placeholder="Search Songs…"></div></form></div><div class="row"><div class="result"></div></div><div id="music"></div></div><div class="col-md-9 container edit" style="margin-top: calc(6.5% - 10px);"><div class="row"><div class="lyrics-select-outer col-md-4 col-md-offset-1 col-xs-10 col-xs-offset-1"><div class="lyrics-select"><div class="mask"></div><img id="s-bgimg" crossorigin="anonymous" class="col-xs-12"></div><div class="lyrics-hidden"><div class="lyrics"><ul class="text-left" id="geci"></ul></div></div><div id="count"><img src="https://count.nonon.moe/get/@TAiONS?theme=rule34"></div></div><div class="col-xs-1 chevron-r" onclick="generate()"><i class="fas fa-chevron-right"></i></div><div class="col-xs-12 chevron-d" onclick="generate()"><i class="fas fa-chevron-down"></i></div><div class="col-md-5 col-xs-12"><div class="poster col-xs-12"><div id="Photographic"><div class="g-bgimg2" style="filter: brightness(80%)"></div><div class="g-lyrics2" id="glyrics"><ul><li class="text-center" style="font-size: 2rem; color: rgb(202, 199, 199);"><span class="songTitle"></span><br><span class="singer"></span></li></ul></div><div class="copyright">TAiONS</div></div><div id="default"><div class="quote"><i class="fa fa-quote-left"></i></div><div class="bg-margin"><div class="g-bgimg-hidden"><div class="g-bgimg"></div></div></div><div class="g-lyrics-hidden"><div class="g-lyrics" id="glyrics"><ul></ul></div><div class="row" id="BottomBorder"><div class="col-xs-4 text-center"><img src="https://cdn.jsdelivr.net/gh/yuuikic/argon-theme@1.2.8/stickers/genshin/stopit.png" id="imgBottom" crossorigin="anonymous" style="border-radius: 5px;" alt="专辑封面"></div><div class="col-xs-8" style="height: 80px;padding-left: 0;"><div style="height: 70%;" id="textBottom"><div class="songTitle"></div><div class="singer"></div></div><div style="height: 30%;"><span id="tag" style="font-size: 1.5rem; color: #ccc;">Created with TAiONS</span></div></div></div></div></div><div class="modify container-fluid"><ul class="nav nav-tabs" role="tablist"><li role="presentation" class="col-xs-3 text-center"><a href="#home" aria-controls="home" role="tab" data-toggle="tab">图片</a></li><li role="presentation" class="col-xs-3 text-center"><a href="#characters" aria-controls="type" role="tab" data-toggle="tab">文字</a></li><li role="presentation" class="col-xs-3 text-center"><a href="#changeColor" aria-controls="changeColor" role="tab" data-toggle="tab">颜色</a></li><li role="presentation" class="col-xs-3 text-center"><a href="#picshot" aria-controls="settings" role="tab" data-toggle="tab">截图</a></li></ul></div><div class="tab-content" id="panes"><div role="tabpanel" class="tab-pane imgedit" id="home"><div class="container-fluid"><div class="row"><span class="imgedit-text col-xs-3 text-center">模糊<br>透明度</span> <input type="range" id="blur" min="0" max="50" step="1" value="25" onchange="changeblur()"> <input type="range" id="opacity" min="0" max="1" step="0.05" value="0.7" onchange="changeopacity()"> <input id="file" type="file"> <button id="uploadimg" class="btn col-xs-6 col-xs-offset-3">自定义背景</button></div></div></div><div role="tabpanel" class="tab-pane container-fluid" id="characters"><div class="row" style="display: flex; justify-content: space-around;"><button onclick="fontSizeUp()" class="btn" style="width: 20%;"><i class="fas fa-plus"></i></button> <button onclick="fontSizeLow()" class="btn" style="width: 20%;"><i class="fas fa-minus"></i></button> <button class="btn colorPickerbtn" style="width: 20%;" onclick>颜色</button><select name="fontFamily" onchange="changeFontFamily()" id="fontFamily" style="width: 30%;" class="btn"><option value="serif">衬线</option><option value="sans-serif">无衬线</option><option value="Amaru">筑紫A丸</option><option value="MS-Mincho">MS-Mincho</option></select><input type="color" id="colorPicker" value="#fffefd" style="position: absolute;"></div></div><div role="tabpanel" class="tab-pane" id="changeColor"><div class="row modify-select text-center"><button class="color1 defaultColor" onclick="changeBackroundColor(0)"></button> <button class="color2 defaultColor" onclick="changeBackroundColor(1)"></button> <button class="color3 defaultColor" onclick="changeBackroundColor(2)"></button> <button class="color4 defaultColor" onclick="changeBackroundColor(3)"></button></div></div><div role="tabpanel" class="tab-pane container-fluid" id="picshot"><button class="btn col-xs-3" onclick="changestyle()">样式</button> <button class="btn col-xs-4" onclick="screenshot()" style="margin-left: 10px;">截图</button> <button class="btn col-xs-4" onclick="changeAd()" style="color: rgb(243, 103, 126); font-size: 2rem; margin-left: 10px;"><i class="fas fa-heart"></i></button></div></div></div></div></div></div></div></div><script src="./js/latter.js"></script></body></html>