package.json

@@ -68,7 +68,6 @@
     "solid-devtools": "^0.30.1",
     "solid-js": "^1.9.3",
     "solid-styled": "^0.11.1",
-    "solid-transition-group": "^0.2.3",
     "stacktrace-js": "^2.0.2",
     "workbox-core": "^7.3.0",
     "workbox-precaching": "^7.3.0"

src/material/Tab.css

@@ -9,15 +9,6 @@
   font-weight: 600;
   text-transform: uppercase;
   transition: color 120ms var(--tutu-anim-curve-std);
-
-  :root:where([lang^="zh"],
-    [lang="zh"],
-    [lang^="kr"],
-    [lang="kr"],
-    [lang^="ja"],
-    [lang="ja"]) & {
-    font-size: 0.85rem;
-  }
 }
 
 .MuiToolbar-root .Tab {

src/timelines/RegularToot.css

@@ -34,7 +34,7 @@
   }
 
   &.expanded {
-    z-index: calc(var(--tutu-zidx-nav) - 2);
+    z-index: calc(var(--tutu-zidx-nav) - 1);
     box-shadow: var(--tutu-shadow-e9);
   }
 

src/timelines/RegularToot.tsx

@@ -24,8 +24,6 @@ import TootActionGroup from "./toots/TootActionGroup.js";
 import TootAuthorGroup from "./toots/TootAuthorGroup.js";
 import "./RegularToot.css";
 import { vibrate } from "~platform/hardware.js";
-import { Transition } from "solid-transition-group";
-import { ANIM_CURVE_SHARP, ANIM_CURVE_STD } from "~material/theme.js";
 
 export type TootEnv = {
   boost: (value: mastodon.v1.Status) => void;
@@ -99,7 +97,7 @@ export function createDefaultTootEnv(
 
       const result = reblogged
         ? await c.v1.statuses.$select(status.id).unreblog()
-        : await c.v1.statuses.$select(status.id).reblog();
+        : (await c.v1.statuses.$select(status.id).reblog());
 
       if (status.reblog && !reblogged) {
         // When calling /reblog, the result is the boost object (the actor
@@ -302,22 +300,13 @@ const RegularToot: Component<RegularTootProps> = (oprops) => {
         <Show when={toot().poll}>
           <TootPoll value={toot().poll!} status={toot()} />
         </Show>
-        {props.actionable && (
+        <Show when={props.actionable}>
           <Divider
             class={cardStyle.cardNoPad}
             style={{ "margin-top": "8px" }}
           />
-        )}
+          <TootActionGroup value={status()} class={cardStyle.cardGutSkip} />
-        <Transition
+        </Show>
-          onExit={(el, done) => {
-            (el as HTMLElement).addEventListener("animationend", done)
-            el.classList.add("Transition-exit")
-          }}
-        >
-          <Show when={props.actionable}>
-            <TootActionGroup value={status()} class={cardStyle.cardGutSkip} />
-          </Show>
-        </Transition>
       </article>
     </>
   );

src/timelines/toots/TootActionGroup.css

@@ -2,7 +2,7 @@
   padding-block: calc((var(--card-gut) - 10px) / 2);
   contain: layout style;
 
-  animation: 125ms var(--tutu-anim-curve-sharp) TootActionGroup_fade-in;
+  animation: 125ms var(--tutu-anim-curve-std) TootActionGroup_fade-in;
   display: flex;
   flex-flow: row wrap;
   justify-content: space-evenly;
@@ -28,19 +28,16 @@
   >.plain {
     justify-content: center;
   }
-
-  &.Transition-exit {
-    animation: 125ms var(--tutu-anim-curve-sharp) TootActionGroup_fade-out;
-  }
 }
 
 @keyframes TootActionGroup_fade-in {
   0% {
     opacity: 0.5;
     transform: translateY(-10px);
-    margin-bottom: -30px;
+    margin-bottom: -20px;
   }
 
+
   25% {
     margin-bottom: 0;
   }
@@ -49,22 +46,4 @@
     opacity: 1;
     transform: translateY(0);
   }
-}
-
-@keyframes TootActionGroup_fade-out {
-  0% {
-    opacity: 1;
-    transform: translateY(0px);
-    margin-bottom: 0px;
-  }
-
-  75% {
-    margin-bottom: -30px;
-  }
-
-  100% {
-    opacity: 0;
-    transform: translateY(-10px);
-    margin-bottom: -30px;
-  }
 }