generated from fastn-stack/fastn-template
-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathemoji-list.ftd
111 lines (70 loc) · 2.41 KB
/
emoji-list.ftd
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
-- import: fifthtry.github.io/package-doc/doc as pd
-- ftd.font-size copy-large-bold-desktop:
line-height: 28
size: 20
letter-spacing.fixed.px: 0
-- ftd.type copy-large-bold:
desktop: $copy-large-bold-desktop
mobile: $copy-large-bold-desktop
xl: $copy-large-bold-desktop
weight: 700
-- bling.page: `emoji-list` and it's Usage
`-- emoji-list` can be used as part of blog posts.
-- pd.package: `emoji-list` and it's Usage
name: fifthtry.github.io/bling
`emoji-list` is a new conversation experience via using `FTD` lang:
To use `emoji-list` on your web package, add below into `FASTN.ftd` file:
-- cb.code:
lang: ftd
\-- fastn.dependency: fifthtry.github.io/bling as bling
\-- fastn.auto-import: bling/emoji-list as el
-- tf.markdown:
Once you add above lines into your web package, add `emoji-list` into your
`.ftd` files:
-- cb.code: Example code for `-- emoji-list`
lang: ftd
\-- el.emoji-list: Lorem ipsum dolor sit amet, consectetur adipiscing
emoji: 💫
\-- el.emoji-list: Lorem ipsum dolor sit amet, consectetur adipiscing
emoji: 🌟
\-- el.emoji-list: Lorem ipsum dolor sit amet, consectetur adipiscing
emoji: 💥
\-- el.emoji-list: Lorem ipsum dolor sit amet, consectetur adipiscing
emoji: 🌺
\-- el.emoji-list:
emoji: ✨
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor
incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis
nostrud exercitation ullamco laboris nisi ut
-- tf.h3: Output of above basic example:
-- emoji-list: Lorem ipsum dolor sit amet, consectetur adipiscing
emoji: 💫
-- emoji-list: Lorem ipsum dolor sit amet, consectetur adipiscing
emoji: 🌟
-- emoji-list: Lorem ipsum dolor sit amet, consectetur adipiscing
emoji: 💥
-- emoji-list: Lorem ipsum dolor sit amet, consectetur adipiscing
emoji: 🌺
-- emoji-list:
emoji: ✨
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor
incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis
nostrud exercitation ullamco laboris nisi ut
-- end: bling.page
-- component emoji-list:
string emoji:
caption or body body:
-- ftd.row:
max-width.fixed.px: 800
margin-bottom.px: 12
width: auto
spacing.fixed.px: 10
-- ftd.text: $emoji-list.emoji
color: $inherited.colors.text
role: $inherited.types.copy-small
-- ftd.text:
text: $emoji-list.body
color: $inherited.colors.text
role: $inherited.types.copy-small
-- end: ftd.row
-- end: emoji-list