This repository has been archived by the owner on Mar 26, 2023. It is now read-only.
-
Notifications
You must be signed in to change notification settings - Fork 1
/
index.ftd-0.2
213 lines (149 loc) · 5.42 KB
/
index.ftd-0.2
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
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
-- import: fifthtry.github.io/package-doc/doc as pd
-- import: fifthtry.github.io/package-doc/typography as tf
-- import: fifthtry.github.io/roboto-mono/assets as mono-assets
-- import: fastn
-- import: fastn
-- boolean is-mobile: false
-- is-mobile: true
if: $ftd.device == mobile
-- ftd.font-size mono-demo:
line-height: 36
size: 22
letter-spacing: 0
-- ftd.font-size mono-demo-heading:
line-height: 56
size: 48
letter-spacing: 0
-- ftd.type roboto-font: $mono-assets.fonts.Mono
desktop: $mono-demo
mobile: $mono-demo
xl: $mono-demo
weight: 400
-- ftd.type roboto-font-heading: $mono-assets.fonts.Mono
desktop: $mono-demo-heading
mobile: $mono-demo-heading
xl: $mono-demo-heading
weight: 400
-- ftd.column:
width: fill
padding-horizontal: 50
padding-horizontal if $is-mobile: 20
background-color: $fastn.color.main.background.base
id: parent
-- pd.package: Roboto Mono - fastn font
name: fifthtry.github.io/roboto-mono
This component consist of Google Roboto font with all it's styles from Thin-100 to Bold-700 Italic.
-- pd.component: Roboto Mono - fastn font
name: https://github.com/FifthTry/roboto-mono
This component consist of Google Roboto Mono font with all it's styles from Thin-100 to Bold-700 Italic.
-- pd.hidden-code: How to use
include fifthtry.github.io/roboto-mono package into FASTN.ftd file
\-- fastn.dependency: fifthtry.github.io/roboto-mono
\-- fastn.auto-import: fifthtry.github.io/roboto-mono
Inside your .ftd file to change for any specific token use:
\-- fastn.type.headline-small.font: $roboto-mono.fonts.Mono
\-- ftd.text:
role: $fastn.type.headline-small
-- container: parent
-- tf.h2: `roboto-font` hairline 18px:
-- ftd.text: Todos os seres humanos nascem livres e iguais em dignidade.
role: $roboto-font
color: $fastn.color.main.text-strong
margin-bottom: $fastn.space.space-6
style: hairline
-- tf.h2: `roboto-font` hairline italic 18px:
-- ftd.text: Todos os seres humanos nascem livres e iguais em dignidade.
role: $roboto-font
color: $fastn.color.main.text-strong
margin-bottom: $fastn.space.space-6
style: hairline italic
-- tf.h2: `roboto-font` extra-light 18px:
-- ftd.text: Todos os seres humanos nascem livres e iguais em dignidade.
role: $roboto-font
color: $fastn.color.main.text-strong
margin-bottom: $fastn.space.space-6
style: extra-light
-- tf.h2: `roboto-font` extra-light italic 18px:
-- ftd.text: Todos os seres humanos nascem livres e iguais em dignidade.
role: $roboto-font
color: $fastn.color.main.text-strong
margin-bottom: $fastn.space.space-6
style: extra-light italic
-- tf.h2: `roboto-font` light 18px:
-- ftd.text: Todos os seres humanos nascem livres e iguais em dignidade.
role: $roboto-font
color: $fastn.color.main.text-strong
margin-bottom: $fastn.space.space-6
style: light
-- tf.h2: `roboto-font` light italic 18px:
-- ftd.text: Todos os seres humanos nascem livres e iguais em dignidade.
role: $roboto-font
color: $fastn.color.main.text-strong
margin-bottom: $fastn.space.space-6
style: light italic
-- tf.h2: `roboto-font` regular 18px:
-- ftd.text: Todos os seres humanos nascem livres e iguais em dignidade.
role: $roboto-font
color: $fastn.color.main.text-strong
margin-bottom: $fastn.space.space-6
style: regular
-- tf.h2: `roboto-font` regular strike through 18px:
-- ftd.text: Todos os seres humanos nascem livres e iguais em dignidade.
role: $roboto-font
color: $fastn.color.main.text-strong
margin-bottom: $fastn.space.space-6
style: regular strike
-- tf.h2: `roboto-font` regular underline 18px:
-- ftd.text: Todos os seres humanos nascem livres e iguais em dignidade.
role: $roboto-font
color: $fastn.color.main.text-strong
margin-bottom: $fastn.space.space-6
style: regular underline
-- tf.h2: `roboto-font` regular italic 18px:
-- ftd.text: Todos os seres humanos nascem livres e iguais em dignidade.
role: $roboto-font
color: $fastn.color.main.text-strong
margin-bottom: $fastn.space.space-6
style: regular italic
-- tf.h2: `roboto-font` medium 18px:
-- ftd.text: Todos os seres humanos nascem livres e iguais em dignidade.
role: $roboto-font
color: $fastn.color.main.text-strong
margin-bottom: $fastn.space.space-6
style: medium
-- tf.h2: `roboto-font` medium italic 18px:
-- ftd.text: Todos os seres humanos nascem livres e iguais em dignidade.
role: $roboto-font
color: $fastn.color.main.text-strong
margin-bottom: $fastn.space.space-6
style: medium italic
-- tf.h2: `roboto-font` semi-bold 18px:
-- ftd.text: Todos os seres humanos nascem livres e iguais em dignidade.
role: $roboto-font
color: $fastn.color.main.text-strong
margin-bottom: $fastn.space.space-6
style: semi-bold
-- tf.h2: `roboto-font` semi-bold italic 18px:
-- ftd.text: Todos os seres humanos nascem livres e iguais em dignidade.
role: $roboto-font
color: $fastn.color.main.text-strong
margin-bottom: $fastn.space.space-6
style: semi-bold italic
-- tf.h2: `roboto-font` bold 18px:
-- ftd.text: Todos os seres humanos nascem livres e iguais em dignidade.
role: $roboto-font
color: $fastn.color.main.text-strong
margin-bottom: $fastn.space.space-6
style: bold
-- tf.h2: `roboto-font` bold italic 18px:
-- ftd.text: Todos os seres humanos nascem livres e iguais em dignidade.
role: $roboto-font
color: $fastn.color.main.text-strong
margin-bottom: $fastn.space.space-6
style: bold italic
-- tf.h2: `roboto-font` heading regular 48px:
-- ftd.text: Todos os seres humanos nascem livres e iguais em dignidade.
role: $roboto-font-heading
color: $fastn.color.main.text-strong
margin-bottom: $fastn.space.space-10
style: regular