forked from
leaflet.pub/leaflet
a tool for shared writing and social publishing
1import { GoToArrow } from "components/Icons/GoToArrow";
2import { ExternalLinkBlock } from "./ExternalLinkBlock";
3import { Separator } from "components/Layout";
4
5export const QuoteEmbedBlockLine = () => {
6 return (
7 <div className="quoteEmbedBlock flex sm:mx-4 mx-3 my-3 sm:my-4 text-secondary text-sm italic">
8 <div className="w-2 h-full bg-border" />
9 <div className="flex flex-col pl-4">
10 <div className="quoteEmbedContent ">
11 Hello, this is a long quote that I am writing to you! I am so excited
12 that you decided to quote my stuff. I would love to take a moments and
13 just say whatever the heck i feel like. Unforunately for you, it is a
14 rather boring todo list. I need to add an author and pub name, i need
15 to add a back link, and i need to link about text formatting, if we
16 want to handle it.
17 </div>
18 <div className="quoteEmbedFooter flex gap-2 pt-2 ">
19 <div className="flex flex-col leading-tight grow">
20 <div className="font-bold ">This was made to be quoted</div>
21 <div className="text-tertiary text-xs">celine</div>
22 </div>
23 </div>
24 </div>
25 </div>
26 );
27};
28
29export const QuoteEmbedBlock = () => {
30 return (
31 <div className="quoteEmbedBlock transparent-container sm:mx-4 mx-3 my-3 sm:my-4 text-secondary text-sm">
32 <div className="quoteEmbedContent p-3">
33 Hello, this is a long quote that I am writing to you! I am so excited
34 that you decided to quote my stuff. I would love to take a moments and
35 just say whatever the heck i feel like. Unforunately for you, it is a
36 rather boring todo list. I need to add an author and pub name, i need to
37 add a back link, and i need to link about text formatting, if we want to
38 handle it.
39 </div>
40 <hr className="border-border-light" />
41 <a
42 className="quoteEmbedFooter flex max-w-full gap-2 px-3 py-2 hover:no-underline! text-secondary"
43 href="#"
44 >
45 <div className="flex flex-col w-[calc(100%-28px)] grow">
46 <div className="font-bold w-full truncate">
47 This was made to be quoted and if it's very long, to truncate
48 </div>
49 <div className="flex gap-[6px] text-tertiary text-xs items-center">
50 <div className="underline">lab.leaflet.pub</div>
51 <Separator classname="h-2" />
52 <div>celine</div>
53 </div>
54 </div>
55 <div className=" shrink-0 pt-px bg-test w-5 h-5 rounded-full"></div>
56 </a>
57 </div>
58 );
59};