fix share button

Signed-off-by: Xe Iaso <me@xeiaso.net>

7 files changed, 34 insertions, 18 deletions

diff --git a/lib/xesite_templates/src/lib.rs b/lib/xesite_templates/src/lib.rs
index 6c849ec..97ed95f 100644
--- a/lib/xesite_templates/src/lib.rs
+++ b/lib/xesite_templates/src/lib.rs
@@ -5,9 +5,9 @@ pub fn talk_warning() -> Markup {
     html! {
         div.warning {
             (conv("Cadey".to_string(), "coffee".to_string(), html!{
-                "So you are aware: you are reading the written version of a conference talk. This is written in a different style that is more lighthearted, conversational and different than the content normally on this blog. The words being said are the verbatim words that were spoken at the conference. The slides are the literal slides for each spoken utterance. If you want to hide the non-essential slides, please install this userstyle: "
-                a href="/static/css/no-fun-allowed.user.css" {code {"No fun allowed"}}
-                ". If this isn't enough, please edit it to also hide this CSS class: "
+                "So you are aware: you are reading the written version of a conference talk. This is written in a different style that is more lighthearted, conversational and different than the content normally on this blog. The words being said are the verbatim words that were spoken at the conference. The slides are the literal slides for each spoken utterance. If you want to hide the non-essential slides, please press this button: "
+                (xeact_component("NoFunAllowed", serde_json::Value::Null))
+                "If this isn't enough, please edit it to also hide this CSS class: "
                 code { "xeblog-slides-essential" }
                 ". Doing this may make the presentation page harder to understand."
             }))
diff --git a/src/frontend/build.ts b/src/frontend/build.ts
index 3814e88..07fc548 100644
--- a/src/frontend/build.ts
+++ b/src/frontend/build.ts
@@ -8,6 +8,7 @@ const result = await esbuild.build({
   entryPoints: [
     "./components/ConvSnippet.tsx",
     "./components/MastodonShareButton.tsx",
+    "./components/NoFunAllowed.tsx",
     "./components/Video.tsx",
     "./components/WASITerm.tsx",
   ],
diff --git a/src/frontend/components/ConvSnippet.tsx b/src/frontend/components/ConvSnippet.tsx
index 375ed9a..9644333 100644
--- a/src/frontend/components/ConvSnippet.tsx
+++ b/src/frontend/components/ConvSnippet.tsx
@@ -12,8 +12,8 @@ const ConvSnippet = ({ name, mood, children }: ConvSnippetProps) => {
   name = name.replace(" ", "_");
 
   return (
-    <div className="conversation">
-      <div className="conversation-standalone">
+    <div class="conversation">
+      <div class="conversation-standalone">
         <picture>
           <source
             type="image/avif"
@@ -32,9 +32,11 @@ const ConvSnippet = ({ name, mood, children }: ConvSnippetProps) => {
         </picture>
       </div>
       <div className="conversation-chat">
-        &lt;<a href={`/characters#${nameLower}`}>
+        {"<"}
+        <a href={`/characters#${nameLower}`}>
           <b>{name}</b>
-        </a>&gt; {children}
+        </a>
+        {">"} {children}
       </div>
     </div>
   );
diff --git a/src/frontend/components/MastodonShareButton.tsx b/src/frontend/components/MastodonShareButton.tsx
index 03fe596..71395b3 100644
--- a/src/frontend/components/MastodonShareButton.tsx
+++ b/src/frontend/components/MastodonShareButton.tsx
@@ -51,7 +51,7 @@ ${series ? "#" + series + " " : ""}${
         {tootBox}
         <br />
         <button
-          onClick={() => {
+          onClick={(() => {
             let instanceURL = instanceBox.value;
 
             if (!instanceURL.startsWith("https://")) {
@@ -66,7 +66,7 @@ ${series ? "#" + series + " " : ""}${
             });
             console.log({ text, mastodonURL });
             window.open(mastodonURL, "_blank");
-          }}
+          })()}
         >
           Share
         </button>
diff --git a/src/frontend/components/NoFunAllowed.tsx b/src/frontend/components/NoFunAllowed.tsx
new file mode 100644
index 0000000..abe323b
--- /dev/null
+++ b/src/frontend/components/NoFunAllowed.tsx
@@ -0,0 +1,18 @@
+// @jsxImportSource xeact
+// @jsxRuntime automatic
+
+import { c } from "xeact";
+
+export default function NoFunAllowed() {
+  return (
+    <button
+      onclick={(() => {
+        Array.from(c("xeblog-slides-fluff")).forEach((el) =>
+          el.classList.toggle("hidden")
+        );
+      })()}
+    >
+      No fun allowed
+    </button>
+  );
+}
diff --git a/src/tmpl/blog.rs b/src/tmpl/blog.rs
index 18d66e7..15af3b5 100644
--- a/src/tmpl/blog.rs
+++ b/src/tmpl/blog.rs
@@ -36,15 +36,6 @@ fn share_button(post: &Post) -> Markup {
     }));
 }
 
-fn share_button_old(post: &Post) -> Markup {
-    html! {
-        div # mastodon_share_button {}
-        div # mastodon_share_series style="display:none" {(post.front_matter.series.as_ref().unwrap_or(&"".to_string()))}
-        div # mastodon_share_tags style="display:none" {@for tag in post.front_matter.tags.as_ref().unwrap_or(&Vec::new()) {"#" (tag) " "}}
-        script type="module" src="/static/js/mastodon_share_button.js" {}
-    }
-}
-
 fn twitch_vod(post: &Post) -> Markup {
     html! {
         @if let Some(vod) = &post.front_matter.vod {
diff --git a/static/css/shim.css b/static/css/shim.css
index c9599b5..3642efd 100644
--- a/static/css/shim.css
+++ b/static/css/shim.css
@@ -139,6 +139,10 @@ h1, h2, h3, h4, h5, h6 {
   font-family: "Iosevka Etoile Iaso", Menlo, monospace;
 }
 
+.hidden {
+  display: none;
+}
+
 @media (prefers-color-scheme: light) {
     .warning {
         background-color: #fbf1c7;