small bsky embedder @ boobsky.app - kinda mid but works - mirror of git.fomx.gay/rooot/embedthing
1<!DOCTYPE html>
2<html>
3<head>
4 <meta charset="utf-8">
5 <meta name="viewport" content="width=device-width, initial-scale=1.0">
6 <meta name="darkreader" content="meow">
7 <title>embedthing</title>
8 <style>
9 * {
10 margin: 0;
11 padding: 0;
12 }
13 body {
14 background-color: #11111b;
15 font-family: system-ui, -apple-system, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif;
16 }
17 h1, h2, span, p {
18 color: #cdd6f4;
19 text-align: center;
20 }
21 a, .r {
22 color: #f5c2e7;
23 }
24 .g {
25 color: #a6e3a1;
26 }
27 .b {
28 color: #89b4fa;
29 }
30 input {
31 margin-right: 1px !important;
32 flex: 0 0 85%;
33 }
34 input, button {
35 padding: 12px;
36 margin: 0 auto;
37 border: none;
38 outline: none;
39 border-radius: 5px;
40 background-color: #1e1e2e;
41 color: #cdd6f4;
42 text-align: center;
43 }
44 input:focus::placeholder {
45 color: transparent;
46 }
47 #notif {
48 display: block;
49 margin-top: 80px;
50 text-align: center;
51 }
52 #inp {
53 position: absolute;
54 display: flex;
55 margin-top: 20px;
56 width: 50%;
57 left: 50%;
58 transform: translateX(-50%);
59 cursor: pointer;
60 }
61 footer {
62 position: absolute;
63 bottom: 0;
64 width: 100%;
65 margin-bottom: 8px;
66 }
67 </style>
68 <script>
69 function msg(msg) {
70 notif.innerHTML = msg;
71 }
72 function go() {
73 let link = link_input.value;
74 let url;
75 try {
76 url = new URL(link);
77 } catch (e) {
78 msg('<span class="r">invalid link!</span>');
79 return;
80 }
81 const bsky_appviews = ["bsky.app", "deer.social", "boobsky.app", "catsky.social", "bitchsky.app", "witchsky.app", window.location.host];
82 if (!bsky_appviews.includes(url.hostname)) {
83 msg('<span class="r">this is not a bsky.app link!</span>');
84 return;
85 }
86 url.host = window.location.host;
87 link_input.value = url.href;
88 navigator.clipboard.writeText(url.href);
89 msg('<span class="g">link copied to clipboard!</span>');
90 }
91 function setup() {
92 link_input.value = "";
93 document.body.onpaste = function (e) {
94 let text = e.clipboardData.getData("text");
95 link_input.value = text;
96 go();
97 }
98 }
99 </script>
100</head>
101<body onload="setup()">
102 <h1>embedthing</h1>
103 <h2>simply replace <span class="b">bsky.app</span> in your link with <span class="r">boobsky.app</span></h2>
104 <h2>to get them to <span class="g">embed</span> properly!</h2>
105 <div id="inp">
106 <input type="text" id="link_input" placeholder="or paste your link here c:">
107 <button onclick="go()">go!</button>
108 </div>
109 <span id="notif"></span>
110 <footer>
111 <p>
112 <span>made with <span class="r">❤</span> by <a href="https://bsky.app/profile/rooot.gay" target="_blank">rooot</a> :3</span>
113 <span>- <a href="https://git.fomx.gay/rooot/embedthing" target="_blank">source code</a></span>
114 <span>- like this project? consider <a href="https://buymeacoffee.com/rooot" target="_blank">supporting me!</a></span>
115 </p>
116 </footer>
117</body>
118</html>