diff --git a/src/lib/components/crear-post.svelte b/src/lib/components/crear-post.svelte index 878622e..0e42575 100644 --- a/src/lib/components/crear-post.svelte +++ b/src/lib/components/crear-post.svelte @@ -10,6 +10,9 @@ import { sesionStore } from '@/stores/usuario'; import type { CreatePostDto } from '../../types'; import { addPost } from '@/stores/posts'; + import { Tooltip, TooltipProvider } from './ui/tooltip'; + import TooltipContent from './ui/tooltip/tooltip-content.svelte'; + import TooltipTrigger from './ui/tooltip/tooltip-trigger.svelte'; let mensaje = $state(''); @@ -76,15 +79,24 @@

/ 280 - -

Publicar

- -
+ + + + +

Publicar

+ +
+
+ + Ctrl+Enter + +
+
diff --git a/src/lib/components/ui/hover-card/hover-card-content.svelte b/src/lib/components/ui/hover-card/hover-card-content.svelte new file mode 100644 index 0000000..99dfdd6 --- /dev/null +++ b/src/lib/components/ui/hover-card/hover-card-content.svelte @@ -0,0 +1,29 @@ + + + + + diff --git a/src/lib/components/ui/hover-card/hover-card-trigger.svelte b/src/lib/components/ui/hover-card/hover-card-trigger.svelte new file mode 100644 index 0000000..322172b --- /dev/null +++ b/src/lib/components/ui/hover-card/hover-card-trigger.svelte @@ -0,0 +1,7 @@ + + + diff --git a/src/lib/components/ui/hover-card/index.ts b/src/lib/components/ui/hover-card/index.ts new file mode 100644 index 0000000..85f3949 --- /dev/null +++ b/src/lib/components/ui/hover-card/index.ts @@ -0,0 +1,14 @@ +import { LinkPreview as HoverCardPrimitive } from "bits-ui"; +import Content from "./hover-card-content.svelte"; +import Trigger from "./hover-card-trigger.svelte"; + +const Root = HoverCardPrimitive.Root; + +export { + Root, + Content, + Trigger, + Root as HoverCard, + Content as HoverCardContent, + Trigger as HoverCardTrigger, +}; diff --git a/src/lib/components/ui/tooltip/index.ts b/src/lib/components/ui/tooltip/index.ts new file mode 100644 index 0000000..313a7f0 --- /dev/null +++ b/src/lib/components/ui/tooltip/index.ts @@ -0,0 +1,21 @@ +import { Tooltip as TooltipPrimitive } from "bits-ui"; +import Trigger from "./tooltip-trigger.svelte"; +import Content from "./tooltip-content.svelte"; + +const Root = TooltipPrimitive.Root; +const Provider = TooltipPrimitive.Provider; +const Portal = TooltipPrimitive.Portal; + +export { + Root, + Trigger, + Content, + Provider, + Portal, + // + Root as Tooltip, + Content as TooltipContent, + Trigger as TooltipTrigger, + Provider as TooltipProvider, + Portal as TooltipPortal, +}; diff --git a/src/lib/components/ui/tooltip/tooltip-content.svelte b/src/lib/components/ui/tooltip/tooltip-content.svelte new file mode 100644 index 0000000..447ef3f --- /dev/null +++ b/src/lib/components/ui/tooltip/tooltip-content.svelte @@ -0,0 +1,47 @@ + + + + + {@render children?.()} + + {#snippet child({ props })} +
+ {/snippet} +
+
+
diff --git a/src/lib/components/ui/tooltip/tooltip-trigger.svelte b/src/lib/components/ui/tooltip/tooltip-trigger.svelte new file mode 100644 index 0000000..1acdaa4 --- /dev/null +++ b/src/lib/components/ui/tooltip/tooltip-trigger.svelte @@ -0,0 +1,7 @@ + + + diff --git a/src/routes/[perfil]/modalEditar.svelte b/src/routes/[perfil]/modalEditar.svelte index 68ae6fc..ddd6355 100644 --- a/src/routes/[perfil]/modalEditar.svelte +++ b/src/routes/[perfil]/modalEditar.svelte @@ -11,6 +11,9 @@ import DialogDescription from '@/components/ui/dialog/dialog-description.svelte'; import DialogHeader from '@/components/ui/dialog/dialog-header.svelte'; import DialogTitle from '@/components/ui/dialog/dialog-title.svelte'; + import { Tooltip, TooltipProvider } from '@/components/ui/tooltip'; + import TooltipTrigger from '@/components/ui/tooltip/tooltip-trigger.svelte'; + import TooltipContent from '@/components/ui/tooltip/tooltip-content.svelte'; interface Props { post: Post | null; @@ -53,15 +56,26 @@

/ 280 - -

Modificar

- -
+ + + + +

+ Modificar + +

+
+
+ + Ctrl+Enter + +
+