@konemono/nostr-share-component 0.0.10 → 0.0.11
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/package.json +2 -1
- package/src/App.svelte +47 -0
- package/src/app.css +79 -0
- package/src/assets/svelte.svg +1 -0
- package/src/lib/Counter.svelte +10 -0
- package/src/lib/Dialog.svelte +143 -0
- package/src/lib/NostrShare.svelte +119 -0
- package/src/lib/icons.ts +60 -0
- package/src/lib/list.ts +12 -0
- package/src/main.ts +2 -0
- package/src/vite-env.d.ts +2 -0
package/package.json
CHANGED
package/src/App.svelte
ADDED
|
@@ -0,0 +1,47 @@
|
|
|
1
|
+
<script lang="ts">
|
|
2
|
+
import svelteLogo from './assets/svelte.svg'
|
|
3
|
+
import viteLogo from '/vite.svg'
|
|
4
|
+
import Counter from './lib/Counter.svelte'
|
|
5
|
+
</script>
|
|
6
|
+
|
|
7
|
+
<main>
|
|
8
|
+
<div>
|
|
9
|
+
<a href="https://vite.dev" target="_blank" rel="noreferrer">
|
|
10
|
+
<img src={viteLogo} class="logo" alt="Vite Logo" />
|
|
11
|
+
</a>
|
|
12
|
+
<a href="https://svelte.dev" target="_blank" rel="noreferrer">
|
|
13
|
+
<img src={svelteLogo} class="logo svelte" alt="Svelte Logo" />
|
|
14
|
+
</a>
|
|
15
|
+
</div>
|
|
16
|
+
<h1>Vite + Svelte</h1>
|
|
17
|
+
|
|
18
|
+
<div class="card">
|
|
19
|
+
<Counter />
|
|
20
|
+
</div>
|
|
21
|
+
|
|
22
|
+
<p>
|
|
23
|
+
Check out <a href="https://github.com/sveltejs/kit#readme" target="_blank" rel="noreferrer">SvelteKit</a>, the official Svelte app framework powered by Vite!
|
|
24
|
+
</p>
|
|
25
|
+
|
|
26
|
+
<p class="read-the-docs">
|
|
27
|
+
Click on the Vite and Svelte logos to learn more
|
|
28
|
+
</p>
|
|
29
|
+
</main>
|
|
30
|
+
|
|
31
|
+
<style>
|
|
32
|
+
.logo {
|
|
33
|
+
height: 6em;
|
|
34
|
+
padding: 1.5em;
|
|
35
|
+
will-change: filter;
|
|
36
|
+
transition: filter 300ms;
|
|
37
|
+
}
|
|
38
|
+
.logo:hover {
|
|
39
|
+
filter: drop-shadow(0 0 2em #646cffaa);
|
|
40
|
+
}
|
|
41
|
+
.logo.svelte:hover {
|
|
42
|
+
filter: drop-shadow(0 0 2em #ff3e00aa);
|
|
43
|
+
}
|
|
44
|
+
.read-the-docs {
|
|
45
|
+
color: #888;
|
|
46
|
+
}
|
|
47
|
+
</style>
|
package/src/app.css
ADDED
|
@@ -0,0 +1,79 @@
|
|
|
1
|
+
:root {
|
|
2
|
+
font-family: Inter, system-ui, Avenir, Helvetica, Arial, sans-serif;
|
|
3
|
+
line-height: 1.5;
|
|
4
|
+
font-weight: 400;
|
|
5
|
+
|
|
6
|
+
color-scheme: light dark;
|
|
7
|
+
color: rgba(255, 255, 255, 0.87);
|
|
8
|
+
background-color: #242424;
|
|
9
|
+
|
|
10
|
+
font-synthesis: none;
|
|
11
|
+
text-rendering: optimizeLegibility;
|
|
12
|
+
-webkit-font-smoothing: antialiased;
|
|
13
|
+
-moz-osx-font-smoothing: grayscale;
|
|
14
|
+
}
|
|
15
|
+
|
|
16
|
+
a {
|
|
17
|
+
font-weight: 500;
|
|
18
|
+
color: #646cff;
|
|
19
|
+
text-decoration: inherit;
|
|
20
|
+
}
|
|
21
|
+
a:hover {
|
|
22
|
+
color: #535bf2;
|
|
23
|
+
}
|
|
24
|
+
|
|
25
|
+
body {
|
|
26
|
+
margin: 0;
|
|
27
|
+
display: flex;
|
|
28
|
+
place-items: center;
|
|
29
|
+
min-width: 320px;
|
|
30
|
+
min-height: 100vh;
|
|
31
|
+
}
|
|
32
|
+
|
|
33
|
+
h1 {
|
|
34
|
+
font-size: 3.2em;
|
|
35
|
+
line-height: 1.1;
|
|
36
|
+
}
|
|
37
|
+
|
|
38
|
+
.card {
|
|
39
|
+
padding: 2em;
|
|
40
|
+
}
|
|
41
|
+
|
|
42
|
+
#app {
|
|
43
|
+
max-width: 1280px;
|
|
44
|
+
margin: 0 auto;
|
|
45
|
+
padding: 2rem;
|
|
46
|
+
text-align: center;
|
|
47
|
+
}
|
|
48
|
+
|
|
49
|
+
button {
|
|
50
|
+
border-radius: 8px;
|
|
51
|
+
border: 1px solid transparent;
|
|
52
|
+
padding: 0.6em 1.2em;
|
|
53
|
+
font-size: 1em;
|
|
54
|
+
font-weight: 500;
|
|
55
|
+
font-family: inherit;
|
|
56
|
+
background-color: #1a1a1a;
|
|
57
|
+
cursor: pointer;
|
|
58
|
+
transition: border-color 0.25s;
|
|
59
|
+
}
|
|
60
|
+
button:hover {
|
|
61
|
+
border-color: #646cff;
|
|
62
|
+
}
|
|
63
|
+
button:focus,
|
|
64
|
+
button:focus-visible {
|
|
65
|
+
outline: 4px auto -webkit-focus-ring-color;
|
|
66
|
+
}
|
|
67
|
+
|
|
68
|
+
@media (prefers-color-scheme: light) {
|
|
69
|
+
:root {
|
|
70
|
+
color: #213547;
|
|
71
|
+
background-color: #ffffff;
|
|
72
|
+
}
|
|
73
|
+
a:hover {
|
|
74
|
+
color: #747bff;
|
|
75
|
+
}
|
|
76
|
+
button {
|
|
77
|
+
background-color: #f9f9f9;
|
|
78
|
+
}
|
|
79
|
+
}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" class="iconify iconify--logos" width="26.6" height="32" preserveAspectRatio="xMidYMid meet" viewBox="0 0 256 308"><path fill="#FF3E00" d="M239.682 40.707C211.113-.182 154.69-12.301 113.895 13.69L42.247 59.356a82.198 82.198 0 0 0-37.135 55.056a86.566 86.566 0 0 0 8.536 55.576a82.425 82.425 0 0 0-12.296 30.719a87.596 87.596 0 0 0 14.964 66.244c28.574 40.893 84.997 53.007 125.787 27.016l71.648-45.664a82.182 82.182 0 0 0 37.135-55.057a86.601 86.601 0 0 0-8.53-55.577a82.409 82.409 0 0 0 12.29-30.718a87.573 87.573 0 0 0-14.963-66.244"></path><path fill="#FFF" d="M106.889 270.841c-23.102 6.007-47.497-3.036-61.103-22.648a52.685 52.685 0 0 1-9.003-39.85a49.978 49.978 0 0 1 1.713-6.693l1.35-4.115l3.671 2.697a92.447 92.447 0 0 0 28.036 14.007l2.663.808l-.245 2.659a16.067 16.067 0 0 0 2.89 10.656a17.143 17.143 0 0 0 18.397 6.828a15.786 15.786 0 0 0 4.403-1.935l71.67-45.672a14.922 14.922 0 0 0 6.734-9.977a15.923 15.923 0 0 0-2.713-12.011a17.156 17.156 0 0 0-18.404-6.832a15.78 15.78 0 0 0-4.396 1.933l-27.35 17.434a52.298 52.298 0 0 1-14.553 6.391c-23.101 6.007-47.497-3.036-61.101-22.649a52.681 52.681 0 0 1-9.004-39.849a49.428 49.428 0 0 1 22.34-33.114l71.664-45.677a52.218 52.218 0 0 1 14.563-6.398c23.101-6.007 47.497 3.036 61.101 22.648a52.685 52.685 0 0 1 9.004 39.85a50.559 50.559 0 0 1-1.713 6.692l-1.35 4.116l-3.67-2.693a92.373 92.373 0 0 0-28.037-14.013l-2.664-.809l.246-2.658a16.099 16.099 0 0 0-2.89-10.656a17.143 17.143 0 0 0-18.398-6.828a15.786 15.786 0 0 0-4.402 1.935l-71.67 45.674a14.898 14.898 0 0 0-6.73 9.975a15.9 15.9 0 0 0 2.709 12.012a17.156 17.156 0 0 0 18.404 6.832a15.841 15.841 0 0 0 4.402-1.935l27.345-17.427a52.147 52.147 0 0 1 14.552-6.397c23.101-6.006 47.497 3.037 61.102 22.65a52.681 52.681 0 0 1 9.003 39.848a49.453 49.453 0 0 1-22.34 33.12l-71.664 45.673a52.218 52.218 0 0 1-14.563 6.398"></path></svg>
|
|
@@ -0,0 +1,143 @@
|
|
|
1
|
+
<svelte:options customElement="nostr-share-dialog" />
|
|
2
|
+
|
|
3
|
+
<script lang="ts">
|
|
4
|
+
import { list } from "./list";
|
|
5
|
+
|
|
6
|
+
interface Props {
|
|
7
|
+
url?: string;
|
|
8
|
+
text?: string;
|
|
9
|
+
shareTitle?: string;
|
|
10
|
+
handleClose: () => void;
|
|
11
|
+
}
|
|
12
|
+
let { url = "", text = "", shareTitle = "", handleClose }: Props = $props();
|
|
13
|
+
|
|
14
|
+
const handleClickList = (clientUrl: string) => {
|
|
15
|
+
const link = clientUrl
|
|
16
|
+
.replace("{url}", encodeURIComponent(url))
|
|
17
|
+
.replace("{title}", encodeURIComponent(shareTitle))
|
|
18
|
+
.replace("{text}", encodeURIComponent(text));
|
|
19
|
+
console.log(link);
|
|
20
|
+
window.open(link, "_blank", "noreferrer");
|
|
21
|
+
handleClose();
|
|
22
|
+
};
|
|
23
|
+
</script>
|
|
24
|
+
|
|
25
|
+
<!-- svelte-ignore a11y_click_events_have_key_events -->
|
|
26
|
+
<!-- svelte-ignore a11y_no_static_element_interactions -->
|
|
27
|
+
<div class="overlay" onclick={handleClose}>
|
|
28
|
+
<div class="inner" onclick={(event) => event.stopPropagation()}>
|
|
29
|
+
<button onclick={handleClose} class="close-button" aria-label="Close"
|
|
30
|
+
>✖</button
|
|
31
|
+
>
|
|
32
|
+
<h2 class="title">Share</h2>
|
|
33
|
+
<div class="list">
|
|
34
|
+
{#each list as li}
|
|
35
|
+
<button class="item" onclick={() => handleClickList(li.url)}>
|
|
36
|
+
<img width={24} src={li.icon} alt={li.name} />
|
|
37
|
+
{li.name}
|
|
38
|
+
</button>
|
|
39
|
+
{/each}
|
|
40
|
+
</div>
|
|
41
|
+
</div>
|
|
42
|
+
</div>
|
|
43
|
+
|
|
44
|
+
<style>
|
|
45
|
+
/* オーバーレイ背景 */
|
|
46
|
+
.overlay {
|
|
47
|
+
position: fixed;
|
|
48
|
+
top: 0;
|
|
49
|
+
left: 0;
|
|
50
|
+
width: 100vw;
|
|
51
|
+
height: 100vh;
|
|
52
|
+
background-color: rgba(0, 0, 0, 0.3); /* 少し濃い背景 */
|
|
53
|
+
display: flex;
|
|
54
|
+
justify-content: center;
|
|
55
|
+
align-items: center;
|
|
56
|
+
}
|
|
57
|
+
|
|
58
|
+
/* ダイアログ本体 */
|
|
59
|
+
.inner {
|
|
60
|
+
display: flex;
|
|
61
|
+
flex-direction: column;
|
|
62
|
+
position: relative;
|
|
63
|
+
background-color: #ffffff;
|
|
64
|
+
padding: 1.5rem;
|
|
65
|
+
border-radius: 12px; /* 柔らかい角丸 */
|
|
66
|
+
box-shadow: 0 8px 16px rgba(0, 0, 0, 0.2);
|
|
67
|
+
width: 90%;
|
|
68
|
+
max-width: 400px;
|
|
69
|
+
gap: 1rem; /* スペーシング */
|
|
70
|
+
}
|
|
71
|
+
|
|
72
|
+
/* タイトル */
|
|
73
|
+
.title {
|
|
74
|
+
margin: 0;
|
|
75
|
+
font-size: 1.25rem;
|
|
76
|
+
font-weight: bold;
|
|
77
|
+
text-align: center;
|
|
78
|
+
color: #374151; /* グレー700 */
|
|
79
|
+
}
|
|
80
|
+
|
|
81
|
+
/* リスト */
|
|
82
|
+
.list {
|
|
83
|
+
display: flex;
|
|
84
|
+
flex-direction: column;
|
|
85
|
+
gap: 0.75rem; /* ゆったりした間隔 */
|
|
86
|
+
}
|
|
87
|
+
|
|
88
|
+
/* リストアイテム */
|
|
89
|
+
.item {
|
|
90
|
+
display: flex;
|
|
91
|
+
align-items: center;
|
|
92
|
+
gap: 0.5rem;
|
|
93
|
+
padding: 0.75rem 1rem;
|
|
94
|
+
background-color: #f9fafb; /* グレー100 */
|
|
95
|
+
border: 1px solid #d1d5db; /* グレー300 */
|
|
96
|
+
border-radius: 8px;
|
|
97
|
+
font-size: 1rem;
|
|
98
|
+
font-weight: medium;
|
|
99
|
+
cursor: pointer;
|
|
100
|
+
transition:
|
|
101
|
+
background-color 0.2s ease,
|
|
102
|
+
box-shadow 0.2s ease;
|
|
103
|
+
}
|
|
104
|
+
|
|
105
|
+
.item:hover {
|
|
106
|
+
background-color: #e5e7eb; /* グレー200 */
|
|
107
|
+
box-shadow: 0 2px 6px rgba(0, 0, 0, 0.1);
|
|
108
|
+
}
|
|
109
|
+
|
|
110
|
+
.item:active {
|
|
111
|
+
background-color: #d1d5db; /* グレー300 */
|
|
112
|
+
}
|
|
113
|
+
|
|
114
|
+
/* バツボタン */
|
|
115
|
+
.close-button {
|
|
116
|
+
position: absolute;
|
|
117
|
+
right: 12px;
|
|
118
|
+
top: 12px;
|
|
119
|
+
width: 36px;
|
|
120
|
+
height: 36px;
|
|
121
|
+
display: flex;
|
|
122
|
+
justify-content: center;
|
|
123
|
+
align-items: center;
|
|
124
|
+
background-color: #f3f4f6; /* グレー200 */
|
|
125
|
+
border: none;
|
|
126
|
+
border-radius: 50%;
|
|
127
|
+
font-size: 1.25rem;
|
|
128
|
+
color: #374151; /* グレー700 */
|
|
129
|
+
cursor: pointer;
|
|
130
|
+
transition:
|
|
131
|
+
background-color 0.2s ease,
|
|
132
|
+
transform 0.1s ease;
|
|
133
|
+
}
|
|
134
|
+
|
|
135
|
+
.close-button:hover {
|
|
136
|
+
background-color: #e5e7eb; /* グレー300 */
|
|
137
|
+
}
|
|
138
|
+
|
|
139
|
+
.close-button:active {
|
|
140
|
+
background-color: #d1d5db; /* グレー400 */
|
|
141
|
+
transform: scale(0.95); /* 押した感覚を演出 */
|
|
142
|
+
}
|
|
143
|
+
</style>
|
|
@@ -0,0 +1,119 @@
|
|
|
1
|
+
<svelte:options customElement="nostr-share" />
|
|
2
|
+
|
|
3
|
+
<script lang="ts">
|
|
4
|
+
import Dialog from "./Dialog.svelte";
|
|
5
|
+
import { nostrIcon } from "./icons";
|
|
6
|
+
|
|
7
|
+
let { url, text, shareTitle, icon = false, ...props } = $props();
|
|
8
|
+
//https://zenn.dev/tnzk/articles/835d3252ce01ed#dom-api%E7%B5%8C%E7%94%B1%E3%81%AE%E5%B1%9E%E6%80%A7%E7%9B%B4%E3%81%AE%E5%A4%89%E6%9B%B4%E3%81%AF%E3%82%B5%E3%83%9D%E3%83%BC%E3%83%88%E3%81%95%E3%82%8C%E3%81%A6%E3%81%84%E3%82%8B%E3%81%8C%E3%80%81bind-%E6%A9%9F%E6%A7%8B%E3%81%AF%E3%82%B5%E3%83%9D%E3%83%BC%E3%83%88%E3%81%95%E3%82%8C%E3%81%A6%E3%81%AA%E3%81%84
|
|
9
|
+
//let dialog: HTMLDialogElement;
|
|
10
|
+
let openDialog = $state(false);
|
|
11
|
+
|
|
12
|
+
const handleClickOpenDialog = (e: MouseEvent) => {
|
|
13
|
+
openDialog = true;
|
|
14
|
+
};
|
|
15
|
+
|
|
16
|
+
const closeDialog = () => {
|
|
17
|
+
openDialog = false;
|
|
18
|
+
};
|
|
19
|
+
</script>
|
|
20
|
+
|
|
21
|
+
<button
|
|
22
|
+
class={props.class
|
|
23
|
+
? props.class
|
|
24
|
+
: icon
|
|
25
|
+
? "nostrShare-icon"
|
|
26
|
+
: "nostrShare-button"}
|
|
27
|
+
onclick={handleClickOpenDialog}
|
|
28
|
+
>
|
|
29
|
+
<slot>
|
|
30
|
+
{#if icon}
|
|
31
|
+
<div class="nostrShare-svg">{@html nostrIcon}</div>
|
|
32
|
+
{:else}
|
|
33
|
+
<div class="nostrShare-svg">{@html nostrIcon}</div>
|
|
34
|
+
<span class="nostrShare-text">Share</span>
|
|
35
|
+
{/if}
|
|
36
|
+
</slot>
|
|
37
|
+
</button>
|
|
38
|
+
|
|
39
|
+
{#if openDialog}
|
|
40
|
+
<Dialog handleClose={closeDialog} {url} {text} {shareTitle} />
|
|
41
|
+
{/if}
|
|
42
|
+
|
|
43
|
+
<style>
|
|
44
|
+
/* ボタン全体の基本スタイル */
|
|
45
|
+
.nostrShare-button,
|
|
46
|
+
.nostrShare-icon {
|
|
47
|
+
display: flex;
|
|
48
|
+
align-items: center;
|
|
49
|
+
justify-content: center;
|
|
50
|
+
border: none;
|
|
51
|
+
outline: none;
|
|
52
|
+
cursor: pointer;
|
|
53
|
+
transition: all 0.2s ease-in-out;
|
|
54
|
+
}
|
|
55
|
+
|
|
56
|
+
/* ボタンスタイル */
|
|
57
|
+
.nostrShare-button {
|
|
58
|
+
padding: 8px 16px;
|
|
59
|
+
margin: 4px;
|
|
60
|
+
font-family:
|
|
61
|
+
-apple-system,
|
|
62
|
+
BlinkMacSystemFont,
|
|
63
|
+
Helvetica Neue,
|
|
64
|
+
Arial,
|
|
65
|
+
Hiragino Kaku Gothic ProN,
|
|
66
|
+
Hiragino Sans,
|
|
67
|
+
Meiryo,
|
|
68
|
+
sans-serif;
|
|
69
|
+
font-weight: bold;
|
|
70
|
+
border-radius: 8px;
|
|
71
|
+
background-color: #f3f4f6; /* グレー */
|
|
72
|
+
color: #374151; /* ダークグレー */
|
|
73
|
+
}
|
|
74
|
+
|
|
75
|
+
.nostrShare-button:hover {
|
|
76
|
+
background-color: #e5e7eb; /* 少し明るいグレー */
|
|
77
|
+
box-shadow: 0 0 4px rgba(0, 0, 0, 0.1);
|
|
78
|
+
}
|
|
79
|
+
|
|
80
|
+
.nostrShare-button:active {
|
|
81
|
+
background-color: #d1d5db; /* ダークグレー */
|
|
82
|
+
transform: scale(0.98);
|
|
83
|
+
}
|
|
84
|
+
|
|
85
|
+
/* テキスト用スタイル */
|
|
86
|
+
.nostrShare-text {
|
|
87
|
+
margin-left: 8px;
|
|
88
|
+
font-size: 14px;
|
|
89
|
+
}
|
|
90
|
+
|
|
91
|
+
/* アイコンスタイル */
|
|
92
|
+
.nostrShare-icon {
|
|
93
|
+
width: 40px;
|
|
94
|
+
height: 40px;
|
|
95
|
+
margin: 4px;
|
|
96
|
+
border-radius: 50%;
|
|
97
|
+
background-color: #f3f4f6;
|
|
98
|
+
color: #374151;
|
|
99
|
+
}
|
|
100
|
+
|
|
101
|
+
.nostrShare-icon:hover {
|
|
102
|
+
background-color: #e5e7eb;
|
|
103
|
+
box-shadow: 0 0 6px rgba(0, 0, 0, 0.1);
|
|
104
|
+
}
|
|
105
|
+
|
|
106
|
+
.nostrShare-icon:active {
|
|
107
|
+
background-color: #d1d5db;
|
|
108
|
+
transform: scale(0.95);
|
|
109
|
+
}
|
|
110
|
+
|
|
111
|
+
/* アイコン内部のSVG */
|
|
112
|
+
.nostrShare-svg {
|
|
113
|
+
width: 24px;
|
|
114
|
+
height: 24px;
|
|
115
|
+
display: flex;
|
|
116
|
+
align-items: center;
|
|
117
|
+
justify-content: center;
|
|
118
|
+
}
|
|
119
|
+
</style>
|
package/src/lib/icons.ts
ADDED
|
@@ -0,0 +1,60 @@
|
|
|
1
|
+
//[nostr-logo](https://github.com/mbarulli/nostr-logo) licensed under CC0
|
|
2
|
+
export const nostrIcon = `<svg
|
|
3
|
+
version="1.1"
|
|
4
|
+
id="_8"
|
|
5
|
+
xmlns="http://www.w3.org/2000/svg"
|
|
6
|
+
xmlns:xlink="http://www.w3.org/1999/xlink"
|
|
7
|
+
x="0px"
|
|
8
|
+
y="0px"
|
|
9
|
+
viewBox="0 0 256 256"
|
|
10
|
+
style="enable-background:new 0 0 256 256;"
|
|
11
|
+
xml:space="preserve"
|
|
12
|
+
>
|
|
13
|
+
<style type="text/css">
|
|
14
|
+
.st0 {
|
|
15
|
+
fill: none;
|
|
16
|
+
}
|
|
17
|
+
.st1 {
|
|
18
|
+
fill: #ffffff;
|
|
19
|
+
}
|
|
20
|
+
.st2 {
|
|
21
|
+
fill: #662482;
|
|
22
|
+
}
|
|
23
|
+
</style>
|
|
24
|
+
<g>
|
|
25
|
+
<path
|
|
26
|
+
class="st0"
|
|
27
|
+
d="M0,0v256h256V0H0z M231.2,159.2c0,20.7,0,31.1-3.5,42.2c-4.4,12.2-14,21.8-26.2,26.2
|
|
28
|
+
c-11.1,3.5-21.5,3.5-42.2,3.5H96.8c-20.7,0-31.1,0-42.2-3.5c-12.2-4.4-21.8-14-26.2-26.2c-3.5-11.1-3.5-21.5-3.5-42.2V96.8
|
|
29
|
+
c0-20.7,0-31.1,3.5-42.2c4.4-12.2,14-21.8,26.2-26.2c11.2-3.5,21.5-3.5,42.2-3.5h62.5c20.7,0,31.1,0,42.2,3.5
|
|
30
|
+
c12.2,4.4,21.8,14,26.2,26.2c3.5,11.1,3.5,21.5,3.5,42.2V159.2z"
|
|
31
|
+
/>
|
|
32
|
+
<circle class="st1" cx="137.9" cy="99" r="12.1" />
|
|
33
|
+
<path
|
|
34
|
+
class="st1"
|
|
35
|
+
d="M210.8,115.9c0-47.3-27.7-68.7-64.4-68.7c-16.4,0-31,4.4-42.4,12.5c-3.8,2.7-9,0.1-9-4.5
|
|
36
|
+
c0-3.1-2.5-5.7-5.7-5.7H57.7c-3.1,0-5.7,2.5-5.7,5.7v144c0,3.1,2.5,5.7,5.7,5.7h33.7c3.1,0,5.6-2.5,5.6-5.6v-8.4
|
|
37
|
+
c0-62.8-33.2-109.8-0.4-116c30-5.7,64.1-3,64.5,20.1c0,2,0.3,8,8.6,11.2c5,2,12.6,2.6,22.6,2.4c0,0,9.1-0.7,9.1,8.5
|
|
38
|
+
c0,11.5-20.4,10.7-20.4,10.7c-6.7,0.3-22.6-1.5-31.7,1.2c-4.8,1.5-9,4.2-11.5,9.1c-4.2,8.3-6.2,26.5-6.5,45.5v15.5
|
|
39
|
+
c0,3.1,2.5,5.7,5.7,5.7h68c3.1,0,5.7-2.5,5.7-5.7l0,0V115.9z"
|
|
40
|
+
/>
|
|
41
|
+
<path
|
|
42
|
+
class="st2"
|
|
43
|
+
d="M227.6,54.6c-4.4-12.2-14-21.8-26.2-26.2c-11.1-3.5-21.5-3.5-42.2-3.5H96.8c-20.7,0-31.1,0-42.2,3.5
|
|
44
|
+
c-12.2,4.4-21.8,14-26.2,26.2c-3.5,11.2-3.5,21.5-3.5,42.2v62.5c0,20.7,0,31.1,3.5,42.2c4.4,12.2,14,21.8,26.2,26.2
|
|
45
|
+
c11.2,3.5,21.5,3.5,42.2,3.5h62.5c20.7,0,31.1,0,42.2-3.5c12.2-4.4,21.8-14,26.2-26.2c3.5-11.1,3.5-21.5,3.5-42.2V96.8
|
|
46
|
+
C231.2,76.1,231.2,65.7,227.6,54.6z M205.1,204.8h-68c-3.1,0-5.7-2.5-5.7-5.7v-15.5c0.3-19,2.3-37.2,6.5-45.5
|
|
47
|
+
c2.5-5,6.7-7.7,11.5-9.1c9-2.7,24.9-0.9,31.7-1.2c0,0,20.4,0.8,20.4-10.7c0-9.3-9.1-8.5-9.1-8.5c-10,0.3-17.7-0.4-22.6-2.4
|
|
48
|
+
c-8.3-3.3-8.6-9.2-8.6-11.2c-0.4-23.1-34.5-25.9-64.5-20.1c-32.8,6.2,0.4,53.3,0.4,116v8.4c-0.1,3.1-2.5,5.6-5.6,5.6H57.7
|
|
49
|
+
c-3.1,0-5.7-2.5-5.7-5.7v-144c0-3.1,2.5-5.7,5.7-5.7h31.7c3.1,0,5.7,2.5,5.7,5.7c0,4.7,5.2,7.2,9,4.5c11.4-8.2,26-12.5,42.4-12.5
|
|
50
|
+
c36.7,0,64.4,21.4,64.4,68.7v83.2l0,0C210.8,202.3,208.3,204.8,205.1,204.8z M125.7,99c0-6.7,5.4-12.1,12.1-12.1S150,92.3,150,99
|
|
51
|
+
s-5.4,12.1-12.1,12.1S125.7,105.8,125.7,99z"
|
|
52
|
+
/>
|
|
53
|
+
</g>
|
|
54
|
+
</svg>`;
|
|
55
|
+
export const githubIcon = `
|
|
56
|
+
<svg viewBox="0 0 98 96" xmlns="http://www.w3.org/2000/svg"><path fill-rule="evenodd" clip-rule="evenodd" d="M48.854 0C21.839 0 0 22 0 49.217c0 21.756 13.993 40.172 33.405 46.69 2.427.49 3.316-1.059 3.316-2.362 0-1.141-.08-5.052-.08-9.127-13.59 2.934-16.42-5.867-16.42-5.867-2.184-5.704-5.42-7.17-5.42-7.17-4.448-3.015.324-3.015.324-3.015 4.934.326 7.523 5.052 7.523 5.052 4.367 7.496 11.404 5.378 14.235 4.074.404-3.178 1.699-5.378 3.074-6.6-10.839-1.141-22.243-5.378-22.243-24.283 0-5.378 1.94-9.778 5.014-13.2-.485-1.222-2.184-6.275.486-13.038 0 0 4.125-1.304 13.426 5.052a46.97 46.97 0 0 1 12.214-1.63c4.125 0 8.33.571 12.213 1.63 9.302-6.356 13.427-5.052 13.427-5.052 2.67 6.763.97 11.816.485 13.038 3.155 3.422 5.015 7.822 5.015 13.2 0 18.905-11.404 23.06-22.324 24.283 1.78 1.548 3.316 4.481 3.316 9.126 0 6.6-.08 11.897-.08 13.526 0 1.304.89 2.853 3.316 2.364 19.412-6.52 33.405-24.935 33.405-46.691C97.707 22 75.788 0 48.854 0z"/></svg>`;
|
|
57
|
+
|
|
58
|
+
export const lightningIcon = `<svg xmlns="http://www.w3.org/2000/svg" enable-background="new 0 0 24 24" height="24px" viewBox="0 0 24 24" width="24px" ><g><rect fill="none" height="24" width="24"/></g><g><path d="M11,21h-1l1-7H7.5c-0.88,0-0.33-0.75-0.31-0.78C8.48,10.94,10.42,7.54,13.01,3h1l-1,7h3.51c0.4,0,0.62,0.19,0.4,0.66 C12.97,17.55,11,21,11,21z"/></g></svg>`;
|
|
59
|
+
|
|
60
|
+
export const lightningIcon2 = `<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 256 256"><path d="m213.85 125.46l-112 120a8 8 0 0 1-13.69-7l14.66-73.33l-57.63-21.64a8 8 0 0 1-3-13l112-120a8 8 0 0 1 13.69 7l-14.7 73.41l57.63 21.61a8 8 0 0 1 3 12.95Z"/></svg>`;
|
package/src/lib/list.ts
ADDED
|
@@ -0,0 +1,12 @@
|
|
|
1
|
+
export const list = [
|
|
2
|
+
{
|
|
3
|
+
name: 'nostter',
|
|
4
|
+
url: 'https://nostter.app/post?content={text}&url={url}&title={title}',
|
|
5
|
+
icon: 'https://nostter.app/favicon.ico'
|
|
6
|
+
},
|
|
7
|
+
{
|
|
8
|
+
name: 'lumilumi',
|
|
9
|
+
url: 'https://lumilumi.vercel.app/post?url={url}&text={text}&title={title}',
|
|
10
|
+
icon: 'https://lumilumi.vercel.app/favicon.ico'
|
|
11
|
+
}
|
|
12
|
+
];
|
package/src/main.ts
ADDED