mirror of
https://github.com/ChenXu233/nonebot_plugin_dialectlist.git
synced 2024-11-23 23:55:29 +08:00
💄 更好看的排行榜样式文件
This commit is contained in:
Chen_Xu233
parent
d3253726b1
commit
566f5c95d6
BIN
nonebot_plugin_dialectlist/temple/cache/头像.jpg
vendored
Normal file
BIN
nonebot_plugin_dialectlist/temple/cache/头像.jpg
vendored
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 38 KiB |
117
nonebot_plugin_dialectlist/temple/css/style.css
Normal file
117
nonebot_plugin_dialectlist/temple/css/style.css
Normal file
@ -0,0 +1,117 @@
|
||||
body {
|
||||
background-image: url('../img/background.jpg');
|
||||
background-attachment: scroll;
|
||||
margin: 0;
|
||||
background-size: cover;
|
||||
background-position: center;
|
||||
background-repeat: no-repeat;
|
||||
}
|
||||
|
||||
.container {
|
||||
padding: 20px 40px;
|
||||
position: relative;
|
||||
flex-direction: column;
|
||||
display: flex;
|
||||
}
|
||||
|
||||
.card {
|
||||
border: 5px solid rgba(200, 200, 200, 1);
|
||||
text-align: center; /*设置文本水平居中*/
|
||||
align-content: center;
|
||||
margin: 1% 1% 1% 1%;
|
||||
border-radius: 2rem;
|
||||
background: rgba(255, 255, 255, .2);
|
||||
-webkit-backdrop-filter: blur(3px);
|
||||
backdrop-filter: blur(3px);
|
||||
}
|
||||
|
||||
.card2 {
|
||||
justify-content: center;
|
||||
flex-wrap: wrap;
|
||||
align-items: center;
|
||||
flex-direction: revert;
|
||||
display: flex;
|
||||
border: 5px solid rgba(200, 200, 200, 1);
|
||||
text-align: center; /*设置文本水平居中*/
|
||||
align-content: center;
|
||||
margin: 1% 1% 1% 1%;
|
||||
border-radius: 2rem;
|
||||
background: rgba(255, 255, 255, .2);
|
||||
-webkit-backdrop-filter: blur(3px);
|
||||
backdrop-filter: blur(3px);
|
||||
}
|
||||
|
||||
.center_text {
|
||||
text-align: center;
|
||||
font-size: 300%;
|
||||
font-weight: bolder;
|
||||
}
|
||||
|
||||
.center_text2 {
|
||||
text-align: center;
|
||||
font-size: 150%;
|
||||
}
|
||||
|
||||
.rank_container {
|
||||
flex-direction: column;
|
||||
display: flex;
|
||||
border: 5px solid rgba(200, 200, 200, 1);
|
||||
border-radius: 2rem;
|
||||
padding: 10px 20px;
|
||||
margin: 1% 1% 1% 1%;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
background: rgba(243, 243, 240, 0.6);
|
||||
}
|
||||
|
||||
.rank_card {
|
||||
display: flex;
|
||||
width: 90%;
|
||||
flex-direction: row;
|
||||
border: 3px solid rgba(255, 255, 255, 0.61);
|
||||
margin: 20px 10px;
|
||||
border-radius: 2rem;
|
||||
/* padding: 20px 40px; */
|
||||
align-content: center;
|
||||
backdrop-filter: blur(30px);
|
||||
-webkit-backdrop-filter: blur(30px);
|
||||
}
|
||||
|
||||
.profile{
|
||||
width: 20%;
|
||||
height: 20%;
|
||||
border: 3px solid rgba(255, 255, 255, 0.61);
|
||||
border-radius: 2000px;
|
||||
background-size: cover;
|
||||
margin-right: 20px;
|
||||
}
|
||||
|
||||
.profile2{
|
||||
width: 4%;
|
||||
height: 4%;
|
||||
border: 3px solid rgba(255, 255, 255, 0.61);
|
||||
border-radius: 2000px;
|
||||
background-size: cover;
|
||||
margin-right: 20px;
|
||||
}
|
||||
|
||||
.rank_card_info {
|
||||
width: 100%;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
}
|
||||
|
||||
.g-container {
|
||||
width: 90%;
|
||||
height: 25px;
|
||||
border-radius: 25px;
|
||||
background: #ffb2b25d;
|
||||
}
|
||||
|
||||
.g-progress {
|
||||
width: 50%;
|
||||
height: inherit;
|
||||
border-radius: 25px 20px 20px 25px;
|
||||
background: linear-gradient(90deg,rgb(57, 230, 230), rgb(21, 161, 248));
|
||||
}
|
||||
BIN
nonebot_plugin_dialectlist/temple/img/background.jpg
Normal file
BIN
nonebot_plugin_dialectlist/temple/img/background.jpg
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 543 KiB |
BIN
nonebot_plugin_dialectlist/temple/img/头像.jpg
Normal file
BIN
nonebot_plugin_dialectlist/temple/img/头像.jpg
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 38 KiB |
104
nonebot_plugin_dialectlist/temple/rank_temple.html
Normal file
104
nonebot_plugin_dialectlist/temple/rank_temple.html
Normal file
@ -0,0 +1,104 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="zh-CN">
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<title>
|
||||
在 title 里夹一点私货应该不会被发现吧？——ddl 真是太厉害啦！
|
||||
</title>
|
||||
<link rel="stylesheet" href="./css/style.css">
|
||||
</head>
|
||||
<body>
|
||||
<div class="container">
|
||||
<div class="card" >
|
||||
<p class="center_text">话痨排行榜</p>
|
||||
</div>
|
||||
<div class="rank_container">
|
||||
<div class="rank_card">
|
||||
<img class="profile" src="./cache/头像.jpg"/>
|
||||
<div class="rank_card_info">
|
||||
<h1>第一名:ChenXu233</h1>
|
||||
<div class="g-container">
|
||||
<div class="g-progress" style="width: 100%"></div>
|
||||
</div>
|
||||
<p>ta一共废话了12131231句，占比100%</p>
|
||||
</div>
|
||||
</div>
|
||||
<div class="rank_card">
|
||||
<img class="profile" src="./cache/头像.jpg"/>
|
||||
<div class="rank_card_info">
|
||||
<h1>第一名:ChenXu233</h1>
|
||||
<div class="g-container">
|
||||
<div class="g-progress"></div>
|
||||
</div>
|
||||
<p>ta一共废话了12131231句，占比100%</p>
|
||||
</div>
|
||||
</div>
|
||||
<div class="rank_card">
|
||||
<img class="profile" src="./cache/头像.jpg"/>
|
||||
<div class="rank_card_info">
|
||||
<h1>第一名:ChenXu233</h1>
|
||||
<div class="g-container">
|
||||
<div class="g-progress"></div>
|
||||
</div>
|
||||
<p>ta一共废话了12131231句，占比100%</p>
|
||||
</div>
|
||||
</div>
|
||||
<div class="rank_card">
|
||||
<img class="profile" src="./cache/头像.jpg"/>
|
||||
<div class="rank_card_info">
|
||||
<h1>第一名:ChenXu233</h1>
|
||||
<div class="g-container">
|
||||
<div class="g-progress"></div>
|
||||
</div>
|
||||
<p>ta一共废话了12131231句，占比100%</p>
|
||||
</div>
|
||||
</div>
|
||||
<div class="rank_card">
|
||||
<img class="profile" src="./cache/头像.jpg"/>
|
||||
<div class="rank_card_info">
|
||||
<h1>第一名:ChenXu233</h1>
|
||||
<div class="g-container">
|
||||
<div class="g-progress"></div>
|
||||
</div>
|
||||
<p>ta一共废话了12131231句，占比100%</p>
|
||||
</div>
|
||||
</div>
|
||||
<div class="rank_card">
|
||||
<img class="profile" src="./cache/头像.jpg"/>
|
||||
<div class="rank_card_info">
|
||||
<h1>第一名:ChenXu233</h1>
|
||||
<div class="g-container">
|
||||
<div class="g-progress"></div>
|
||||
</div>
|
||||
<p>ta一共废话了12131231句，占比100%</p>
|
||||
</div>
|
||||
</div>
|
||||
<div class="rank_card">
|
||||
<img class="profile" src="./cache/头像.jpg"/>
|
||||
<div class="rank_card_info">
|
||||
<h1>第一名:ChenXu233</h1>
|
||||
<div class="g-container">
|
||||
<div class="g-progress" style="width: 100%"></div>
|
||||
</div>
|
||||
<p>ta一共废话了12131231句，占比100%</p>
|
||||
</div>
|
||||
</div>
|
||||
<div class="rank_card">
|
||||
<img class="profile" src="./cache/头像.jpg"/>
|
||||
<div class="rank_card_info">
|
||||
<h1>第一名:ChenXu233</h1>
|
||||
<div class="g-container">
|
||||
<div class="g-progress"></div>
|
||||
</div>
|
||||
<p>ta一共废话了12131231句，占比100%</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
<div class="card2">
|
||||
<img class="profile2" src="./img/头像.jpg"/>
|
||||
<p class="center_text2">Designed By ChenXu233</p>
|
||||
</div>
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
||||
BIN
tests/screenshot-chromium.png
Normal file
BIN
tests/screenshot-chromium.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 2.3 MiB |
BIN
tests/screenshot-firefox.png
Normal file
BIN
tests/screenshot-firefox.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 3.7 MiB |
BIN
tests/screenshot-webkit.png
Normal file
BIN
tests/screenshot-webkit.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 2.7 MiB |
10
tests/temple_render.py
Normal file
10
tests/temple_render.py
Normal file
@ -0,0 +1,10 @@
|
||||
from playwright.sync_api import sync_playwright
|
||||
|
||||
with sync_playwright() as p:
|
||||
for browser_type in [p.chromium, p.firefox, p.webkit]:
|
||||
browser = browser_type.launch(headless=True)
|
||||
page = browser.new_page()
|
||||
page.goto('file:///H:/Bot/%E7%8E%B0%E5%BD%B9Bot/mybot/src/nonebot_plugin_dialectlist/nonebot_plugin_dialectlist/temple/rank_temple.html')
|
||||
page.screenshot(path=f'screenshot-{browser_type.name}.png',full_page=True)
|
||||
print(page.title())
|
||||
browser.close()
|
||||
Loading…
Reference in New Issue
Block a user