TootComposer: remove css module

src/timelines/TootComposer.css

@@ -0,0 +1,12 @@
+
+.TootComposer {
+  --card-gut: 8px;
+
+  .reply-input {
+    display: flex;
+    align-items: flex-start;
+    gap: 8px;
+  }
+}
+
+

src/timelines/TootComposer.module.css

@@ -1,11 +0,0 @@
-
-.composer {
-  composes: card from "../material/cards.module.css";
-  --card-gut: 8px;
-}
-
-.replyInput {
-  display: flex;
-  align-items: flex-start;
-  gap: 8px;
-}

src/timelines/TootComposer.tsx

@@ -5,6 +5,7 @@ import {
   createUniqueId,
   onMount,
   Show,
+  type Accessor,
   type Component,
   type JSX,
   type Ref,
@@ -35,7 +36,7 @@ import {
   Translate,
 } from "@suid/icons-material";
 import type { Account } from "../accounts/stores";
-import tootComposers from "./TootComposer.module.css";
+import "./TootComposer.css";
 import { makeEventListener } from "@solid-primitives/event-listener";
 import BottomSheet from "../material/BottomSheet";
 import { useLanguage } from "../platform/i18n";
@@ -196,6 +197,10 @@ function randomChoose<T extends any[]>(
   return K[idx];
 }
 
+function useRandomChoice<T>(choices: () => T[]): Accessor<T> {
+  return createMemo(() => randomChoose(Math.random(), choices()));
+}
+
 function cancelEvent(event: Event) {
   event.stopPropagation();
 }
@@ -224,9 +229,10 @@ const TootComposer: Component<{
   const [langPickerOpen, setLangPickerOpen] = createSignal(false);
   const appLanguage = useLanguage();
 
-  const randomPlaceholder = createMemo(() =>
-    randomChoose(Math.random(), ["What's happening?", "What do your think?"]),
-  );
+  const randomPlaceholder = useRandomChoice(() => [
+    "What's happening?",
+    "What do you think?",
+  ]);
 
   createEffect(() => {
     const lang = appLanguage().split("-")[0];
@@ -311,7 +317,7 @@ const TootComposer: Component<{
   return (
     <div
       ref={props.ref}
-      class={tootComposers.composer}
+      class={/* @once */ `TootComposer ${cardStyles.card}`}
       style={containerStyle()}
       onClick={() => {
         inputRef.focus();
@@ -323,7 +329,7 @@ const TootComposer: Component<{
       on:touchmove={cancelEvent}
       on:wheel={cancelEvent}
     >
-      <div class={tootComposers.replyInput}>
+      <div class="reply-input">
         <Show when={props.profile}>
           <Avatar
             src={props.profile!.inf?.avatar}