feat: tg mini app

This commit is contained in:
omg-xtao 2024-03-30 13:27:08 +00:00 committed by GitHub
parent d40ecb38bc
commit d8da1ca5ed
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
8 changed files with 35 additions and 26 deletions

File diff suppressed because one or more lines are too long

View File

@ -1 +0,0 @@
.message.svelte-15hb0c4.svelte-15hb0c4{margin:1em 0;padding:.5em;max-width:max-content;border:1px #eeeeee solid;box-shadow:0 0 3px gray;border-radius:5px;display:flex}.avatar.svelte-15hb0c4.svelte-15hb0c4{padding-right:.5em}.content.svelte-15hb0c4.svelte-15hb0c4{overflow:hidden}.name.svelte-15hb0c4.svelte-15hb0c4{white-space:nowrap;color:#1e90ff;overflow:hidden;text-overflow:ellipsis}.text.svelte-15hb0c4.svelte-15hb0c4{white-space:pre-wrap;margin:.2em 0}.text.svelte-15hb0c4>.keyword{background-color:#ffffab}.time.svelte-15hb0c4.svelte-15hb0c4{font-size:.75em;float:right;margin-right:2px}.time.svelte-15hb0c4.svelte-15hb0c4,.time.svelte-15hb0c4>a.svelte-15hb0c4{color:gray}div.svelte-179qc5o.svelte-179qc5o{position:relative}ul.svelte-179qc5o.svelte-179qc5o{list-style:none;padding:0;margin:0;position:absolute;left:0;background-color:#fff;box-shadow:0 0 4px var(--color-inactive);clip-path:polygon(-100% 0,200% 0,200% 200%,-100% 200%)}li.svelte-179qc5o.svelte-179qc5o{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;cursor:pointer;line-height:2em}li.svelte-179qc5o>img.svelte-179qc5o{height:calc(2.3em - 2px);width:calc(2.3em - 2px);vertical-align:middle;padding-right:.5em;display:inline-block;overflow:hidden}ul.svelte-179qc5o:not(:hover)>li.selected.svelte-179qc5o,li.svelte-179qc5o.svelte-179qc5o:hover{background-color:#d9f5ff}input.svelte-179qc5o.svelte-179qc5o{padding-left:2.5em;width:100%}input.svelte-179qc5o.svelte-179qc5o,ul.svelte-179qc5o.svelte-179qc5o{border-radius:0;border:1px solid var(--color-inactive)}input.svelte-179qc5o.svelte-179qc5o:focus,input.svelte-179qc5o:focus~ul.svelte-179qc5o{border-color:var(--color-active);box-shadow:0 0 4px var(--color-active);outline:1px solid var(--color-active)}input.svelte-179qc5o:focus~ul.svelte-179qc5o{border-top-color:var(--color-inactive)}.selected-avatar.svelte-179qc5o.svelte-179qc5o{position:absolute;pointer-events:none;top:1px;left:1px;height:calc(2.3em - 2px);width:calc(2.3em - 2px)}.hidden.svelte-179qc5o.svelte-179qc5o{display:none}html,body{position:relative;width:100%;height:100%}body{color:#333;margin:0;padding:8px;box-sizing:border-box;line-height:1.2;font-family:DejaVu Sans,sans-serif;margin-left:calc(100vw - 100%);overflow-x:hidden}a{color:#0064c8;text-decoration:none}a:hover{text-decoration:underline}a:visited{color:#0050a0}label{display:block}input,button,select,textarea{font-family:inherit;font-size:inherit;-webkit-padding:.4em 0;padding:.4em;margin:0 0 .5em;box-sizing:border-box;border:1px solid #ccc;border-radius:2px}input:disabled{color:#ccc}button{color:#333;background-color:#f4f4f4;outline:none}button:disabled{color:#999}button:not(:disabled):active{background-color:#ddd}button:focus{border-color:#666}main.svelte-cd7t1.svelte-cd7t1{margin:1em}button.svelte-cd7t1.svelte-cd7t1{white-space:nowrap}#searchbox.svelte-cd7t1.svelte-cd7t1{display:flex;margin-left:1px}#searchbox.svelte-cd7t1>*{margin-left:-1px}#searchbox.svelte-cd7t1 input[type=search].svelte-cd7t1{flex-grow:1}@media (max-width: 700px){#searchbox.svelte-cd7t1.svelte-cd7t1{flex-direction:column}}.error.svelte-cd7t1.svelte-cd7t1{color:red;text-align:center}.info.svelte-cd7t1.svelte-cd7t1{display:flex;justify-content:center}.info.svelte-cd7t1>.svelte-cd7t1{padding:.5em 1em;margin:1em 0}.info.svelte-cd7t1>p.svelte-cd7t1{border:1px #bfbfbf solid;border-radius:2em}input,button,select{border-radius:0;border:1px solid var(--color-inactive);height:2.3em}input:focus,button:focus,select:focus{border-color:var(--color-active);outline:1px solid var(--color-active);z-index:10}:root{--color-inactive:#bfbfbf;--color-active:#add8e6}

BIN
dist/favicon.png vendored

Binary file not shown.

Before

Width:  |  Height:  |  Size: 3.1 KiB

16
dist/index.html vendored
View File

@ -1,16 +0,0 @@
<!DOCTYPE html>
<html lang="zh-CN">
<head>
<meta charset='utf-8'>
<meta name='viewport' content='width=device-width,initial-scale=1'>
<title>落絮</title>
<link rel='icon' type='image/png' href='favicon.png'>
<script type="module" crossorigin src="/assets/index-1389e5a3.js"></script>
<link rel="stylesheet" href="/assets/index-c1af15fa.css">
</head>
<body>
</body>
</html>

View File

@ -24,6 +24,31 @@
<meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0"> <meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0">
<link rel='icon' type='image/png' href='favicon.png'> <link rel='icon' type='image/png' href='favicon.png'>
<script src="https://static.collei.net/paimon/js/telegram-web-app.js"></script>
<style>
body {
--bg-color: var(--tg-theme-bg-color, #fff);
font-family: sans-serif;
/* background-color: var(--bg-color);*/
background: transparent linear-gradient(180deg, var(--bg-color) 0%, var(--bg-color) 100%) no-repeat;
color: var(--tg-theme-text-color, #222);
font-size: 14px;
margin: 0;
padding: 0;
color-scheme: var(--tg-color-scheme);
}
a {
color: var(--tg-theme-link-color, #2678b6);
}
button {
border: none;
border-radius: 4px;
background-color: var(--tg-theme-button-color, #50a8eb);
color: var(--tg-theme-button-text-color, #fff);
}
</style>
<script type="module" src="/src/main.ts"></script> <script type="module" src="/src/main.ts"></script>
</head> </head>
<body> <body>

View File

@ -268,6 +268,7 @@
</main> </main>
<style> <style>
main { main {
margin: 1em; margin: 1em;
} }
@ -287,6 +288,14 @@
#searchbox input[type="search"] { #searchbox input[type="search"] {
flex-grow: 1; flex-grow: 1;
} }
#searchbox select,
#searchbox input[type="search"],
#searchbox > div > input {
background-color: var(--tg-theme-bg-color, #ffffff);
color: var(--tg-theme-text-color, #222222);
border: 1px solid var(--tg-theme-link-color, #000);
border-radius: 4px;
}
@media (max-width: 700px) { @media (max-width: 700px) {
#searchbox { #searchbox {
flex-direction: column; flex-direction: column;

View File

@ -26,7 +26,7 @@
let relative_dt = format_relative_time(dt, now); let relative_dt = format_relative_time(dt, now);
let iso_date = dt.toISOString(); let iso_date = dt.toISOString();
let msgurl = groupinfo[msg.group_id][0] let msgurl = groupinfo[msg.group_id][0]
? `tg://resolve?domain=${groupinfo[msg.group_id][0]}&post=${msg.id}` ? `https://t.me/${groupinfo[msg.group_id][0]}/${msg.id}`
: `tg://privatepost?channel=${msg.group_id}&post=${msg.id}`; : `tg://privatepost?channel=${msg.group_id}&post=${msg.id}`;
function format_relative_time(d1: Date, d2: Date) { function format_relative_time(d1: Date, d2: Date) {

View File

@ -5,7 +5,6 @@ html, body {
} }
body { body {
color: #333;
margin: 0; margin: 0;
padding: 8px; padding: 8px;
box-sizing: border-box; box-sizing: border-box;
@ -21,7 +20,6 @@ body {
} }
a { a {
color: rgb(0,100,200);
text-decoration: none; text-decoration: none;
} }
@ -53,8 +51,6 @@ input:disabled {
} }
button { button {
color: #333;
background-color: #f4f4f4;
outline: none; outline: none;
} }