sybers.fr / leaflet
a tool for shared writing and social publishing
0
fork

Configure Feed

Select the types of activity you want to include in your feed.

added in a less ugly popover arrow

celine 36d07595 310ee3a0

+30 -11
+1
components/Icons.tsx
··· 620 620 height="8" 621 621 viewBox="0 0 16 8" 622 622 fill="none" 623 + className="-mt-[1px]" 623 624 xmlns="http://www.w3.org/2000/svg" 624 625 > 625 626 <path
+9 -4
components/ShareOptions/index.tsx
··· 1 1 import { useReplicache } from "src/replicache"; 2 - import { ShareSmall } from "components/Icons"; 2 + import { PopoverArrow, ShareSmall } from "components/Icons"; 3 3 import { useEffect, useState } from "react"; 4 4 import { getShareLink } from "./getShareLink"; 5 5 import { useEntitySetContext } from "components/EntitySetProvider"; 6 6 import { useSmoker } from "components/Toast"; 7 7 import * as Popover from "@radix-ui/react-popover"; 8 8 import { Menu, MenuItem } from "components/Layout"; 9 + import { theme } from "tailwind.config"; 9 10 10 11 export function ShareOptions(props: { rootEntity: string }) { 11 12 let { permission_token } = useReplicache(); ··· 47 48 </div> 48 49 </Popover.Trigger> 49 50 <Popover.Portal> 50 - <Popover.Content align="start" sideOffset={6}> 51 + <Popover.Content align="center" sideOffset={4}> 51 52 <Menu> 52 53 <MenuItem 53 54 onClick={(e) => { ··· 88 89 </div> 89 90 </MenuItem> 90 91 </Menu> 91 - 92 - <Popover.Close /> 92 + <Popover.Arrow asChild width={16} height={8} viewBox="0 0 16 8"> 93 + <PopoverArrow 94 + arrowFill={theme.colors["bg-card"]} 95 + arrowStroke={theme.colors["border"]} 96 + /> 97 + </Popover.Arrow> 93 98 </Popover.Content> 94 99 </Popover.Portal> 95 100 </Popover.Root>
+12 -4
components/ThemeManager/ThemeSetter.tsx
··· 17 17 } from "react-aria-components"; 18 18 19 19 import { useEffect, useMemo, useState } from "react"; 20 - import { BlockImageSmall, CloseContrastSmall } from "components/Icons"; 20 + import { 21 + BlockImageSmall, 22 + CloseContrastSmall, 23 + PopoverArrow, 24 + } from "components/Icons"; 21 25 import { ReplicacheMutators, useEntity, useReplicache } from "src/replicache"; 22 26 import { Replicache } from "replicache"; 23 27 import { FilterAttributes } from "src/replicache/attributes"; ··· 114 118 style={{ maxHeight: viewheight ? viewheight * 0.8 : "80vh" }} 115 119 className="themeSetterWrapper w-80 h-fit bg-white rounded-md border border-border flex" 116 120 align="center" 117 - sideOffset={4} 121 + sideOffset={6} 118 122 collisionPadding={16} 119 123 > 120 124 <div className="themeSetterContent flex flex-col w-full overflow-y-scroll no-scrollbar"> ··· 226 230 </div> 227 231 </div> 228 232 </div> 229 - 230 - <Popover.Arrow /> 233 + <Popover.Arrow asChild width={16} height={8} viewBox="0 0 16 8"> 234 + <PopoverArrow 235 + arrowFill={theme.colors["bg-card"]} 236 + arrowStroke={theme.colors["border"]} 237 + /> 238 + </Popover.Arrow> 231 239 </Popover.Content> 232 240 </Popover.Portal> 233 241 </Popover.Root>
+8 -3
components/Toolbar/HighlightButton.tsx
··· 29 29 import { useColorAttribute } from "components/ThemeManager/useColorAttribute"; 30 30 import { useParams } from "next/navigation"; 31 31 import { rangeHasMark } from "src/utils/prosemirror/rangeHasMark"; 32 - import { PaintSmall } from "components/Icons"; 32 + import { PaintSmall, PopoverArrow } from "components/Icons"; 33 33 34 34 export const HighlightColorButton = (props: { 35 35 color: "1" | "2" | "3"; ··· 113 113 <Popover.Content 114 114 className="themeSetterWrapper z-20 w-80 h-fit max-h-[80vh] bg-white rounded-md border border-border flex" 115 115 align="center" 116 - sideOffset={4} 116 + sideOffset={8} 117 117 collisionPadding={16} 118 118 > 119 119 <div ··· 192 192 </small> 193 193 </div> 194 194 </div> 195 - <Popover.Arrow /> 195 + <Popover.Arrow asChild width={16} height={8} viewBox="0 0 16 8"> 196 + <PopoverArrow 197 + arrowFill={theme.colors["bg-card"]} 198 + arrowStroke={theme.colors["border"]} 199 + /> 200 + </Popover.Arrow>{" "} 196 201 </Popover.Content> 197 202 </Popover.Portal> 198 203 </Popover.Root>