leaflet.pub
a tool for shared writing and social publishing
fiz some jumping on action button
cozylittle.house
+8
-4
+5
-1
app/[leaflet_id]/publish/PublishPost.tsx
+5
-1
app/[leaflet_id]/publish/PublishPost.tsx
···
199
199
className="place-self-end h-[30px]"
200
200
disabled={charCount > 300}
201
201
>
202
-
{isLoading ? <DotLoader /> : "Publish this Post!"}
202
+
{isLoading ? (
203
+
<DotLoader className="h-[23px]" />
204
+
) : (
205
+
"Publish this Post!"
206
+
)}
203
207
</ButtonPrimary>
204
208
</div>
205
209
{oauthError && (
+1
-1
components/ActionBar/ActionButton.tsx
+1
-1
components/ActionBar/ActionButton.tsx
···
72
72
<div
73
73
className={`flex flex-col pr-1 ${subtext && "leading-snug"} max-w-full min-w-0 ${sidebar.open ? "block" : showLabelOnMobile ? "sm:hidden block" : "hidden"}`}
74
74
>
75
-
<div className="truncate text-left pt-[1px]">{label}</div>
75
+
<div className="truncate text-left">{label}</div>
76
76
{subtext && (
77
77
<div className="text-xs text-tertiary font-normal text-left">
78
78
{subtext}
+2
-2
components/utils/DotLoader.tsx
+2
-2
components/utils/DotLoader.tsx
···
1
1
import { useEffect, useState } from "react";
2
2
3
-
export function DotLoader() {
3
+
export function DotLoader(props: { className?: string }) {
4
4
let [dots, setDots] = useState(1);
5
5
useEffect(() => {
6
6
let id = setInterval(() => {
···
11
11
};
12
12
}, []);
13
13
return (
14
-
<div className="w-[26px] h-[24px] text-center text-sm">
14
+
<div className={`w-[26px] h-[24px] text-center text-sm ${props.className}`}>
15
15
{".".repeat(dots) + "\u00a0".repeat(3 - dots)}
16
16
</div>
17
17
);