@egovernments/digit-ui-components-css 0.0.2-beta.1 → 0.0.2-beta.11

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (197) hide show
  1. package/CHANGELOG.md +88 -54
  2. package/README.md +80 -80
  3. package/dist/index.css +5782 -14109
  4. package/dist/index.min.css +2 -2
  5. package/package.json +69 -67
  6. package/src/digitv2/components/FormComposerV2.scss +118 -118
  7. package/src/digitv2/components/actionbarV2.scss +207 -110
  8. package/src/digitv2/components/backLinkV2.scss +37 -0
  9. package/src/digitv2/components/bodyContainerV2.scss +39 -39
  10. package/src/digitv2/components/breadcrumbV2.scss +57 -0
  11. package/src/digitv2/components/buttonsV2.scss +451 -407
  12. package/src/digitv2/components/cardV2.scss +498 -383
  13. package/src/digitv2/components/cardbasedoptionsV2.scss +47 -0
  14. package/src/digitv2/components/{cardLabelV2.scss → cardlabelV2.scss} +7 -7
  15. package/src/digitv2/components/checkboxV2.scss +83 -79
  16. package/src/digitv2/components/{tagV2.scss → chipV2.scss} +129 -120
  17. package/src/digitv2/components/dividerV2.scss +11 -0
  18. package/src/digitv2/components/{ErrorMessage.scss → errorMessageV2.scss} +20 -18
  19. package/src/digitv2/components/fieldV1.scss +96 -96
  20. package/src/digitv2/components/headerdropdownV2.scss +152 -0
  21. package/src/digitv2/components/infoCardV2.scss +139 -142
  22. package/src/digitv2/components/{infobuttons.scss → infobuttonV2.scss} +75 -75
  23. package/src/digitv2/components/labelFieldPairV2.scss +66 -57
  24. package/src/digitv2/components/mobileNumberV2.scss +65 -65
  25. package/src/digitv2/components/multiSelectDropdownV2.scss +315 -315
  26. package/src/digitv2/components/{panelcard.scss → panelCardV2.scss} +160 -160
  27. package/src/digitv2/components/{panels.scss → panelV2.scss} +114 -114
  28. package/src/digitv2/components/popUpV2.scss +330 -308
  29. package/src/digitv2/components/radiobtnV2.scss +115 -113
  30. package/src/digitv2/components/{selectdropdownV2.scss → selectDropdownV2.scss} +364 -360
  31. package/src/digitv2/components/{stepper.scss → stepperV2.scss} +147 -126
  32. package/src/digitv2/components/textInputV2.scss +462 -462
  33. package/src/digitv2/components/textareaV2.scss +99 -99
  34. package/src/digitv2/components/{textblock.scss → textblockV2.scss} +46 -46
  35. package/src/digitv2/components/{timeline.scss → timelineV2.scss} +170 -126
  36. package/src/digitv2/components/toastV2.scss +80 -80
  37. package/src/digitv2/components/{toggle.scss → toggleV2.scss} +72 -72
  38. package/src/digitv2/components/topbarV2.scss +388 -187
  39. package/src/digitv2/components/treeSelectV2.scss +132 -132
  40. package/src/digitv2/components/{uploader.scss → uploaderV2.scss} +556 -468
  41. package/src/digitv2/components/viewCardFieldPairV2.scss +45 -0
  42. package/src/digitv2/index.scss +169 -197
  43. package/src/digitv2/pages/employee/index.scss +1 -1
  44. package/src/digitv2/pages/employee/workbench.scss +615 -615
  45. package/src/digitv2/typography.scss +638 -657
  46. package/src/index.scss +681 -774
  47. package/src/pages/employee/index.scss +625 -625
  48. package/src/pages/employee/login.scss +220 -220
  49. package/img/browser-icon.png +0 -0
  50. package/img/m_seva_white_logo.png +0 -0
  51. package/img/mseva-demo.png +0 -0
  52. package/src/components/CardBasedOptions.scss +0 -46
  53. package/src/components/CitizenHomeCard.scss +0 -56
  54. package/src/components/EllipsisMenu.scss +0 -17
  55. package/src/components/EventCalendarView.scss +0 -10
  56. package/src/components/FAQ.scss +0 -64
  57. package/src/components/OnGroundEventCard.scss +0 -72
  58. package/src/components/PageBasedInput.scss +0 -29
  59. package/src/components/PopupHeadingLabel.scss +0 -15
  60. package/src/components/PropertySearchForm.scss +0 -58
  61. package/src/components/SearchForm.scss +0 -56
  62. package/src/components/SearchOnRadioButton.scss +0 -10
  63. package/src/components/StandaloneSearchBar.scss +0 -10
  64. package/src/components/TimeLine.scss +0 -68
  65. package/src/components/WhatsNewCard.scss +0 -13
  66. package/src/components/actionLink.scss +0 -3
  67. package/src/components/actionbar.scss +0 -97
  68. package/src/components/bannercomponents.scss +0 -136
  69. package/src/components/body.scss +0 -144
  70. package/src/components/buttons.scss +0 -101
  71. package/src/components/card.scss +0 -391
  72. package/src/components/cardHeaderWithOptions.scss +0 -14
  73. package/src/components/changeLanguage.scss +0 -3
  74. package/src/components/charts.scss +0 -186
  75. package/src/components/checkbox.scss +0 -53
  76. package/src/components/checkpoint.scss +0 -63
  77. package/src/components/citizenInfoLabel.scss +0 -14
  78. package/src/components/custombtn.scss +0 -11
  79. package/src/components/datatable.scss +0 -134
  80. package/src/components/datewrap.scss +0 -21
  81. package/src/components/detailscard.scss +0 -6
  82. package/src/components/detailscontainer.scss +0 -13
  83. package/src/components/filters.scss +0 -98
  84. package/src/components/grey.scss +0 -3
  85. package/src/components/hoc/InboxComposer.scss +0 -115
  86. package/src/components/hoc/index.scss +0 -1
  87. package/src/components/howItWorks.scss +0 -71
  88. package/src/components/imageviewer.scss +0 -33
  89. package/src/components/inboxv2/InboxLinks.scss +0 -59
  90. package/src/components/inboxv2/horizontalNav.scss +0 -224
  91. package/src/components/inboxv2/inboxSearch.scss +0 -116
  92. package/src/components/inboxv2/inboxSearchComposer.scss +0 -134
  93. package/src/components/inboxv2/index.scss +0 -5
  94. package/src/components/inboxv2/searchComponentTable.scss +0 -44
  95. package/src/components/info-banner.scss +0 -35
  96. package/src/components/inputotp.scss +0 -15
  97. package/src/components/keynote.scss +0 -27
  98. package/src/components/languageSelector.scss +0 -24
  99. package/src/components/loader.scss +0 -96
  100. package/src/components/map.scss +0 -30
  101. package/src/components/menu.scss +0 -0
  102. package/src/components/metricsTable.scss +0 -28
  103. package/src/components/multiLink.scss +0 -88
  104. package/src/components/multiSelectDropdown.scss +0 -77
  105. package/src/components/navbar.scss +0 -312
  106. package/src/components/plusMinus.scss +0 -15
  107. package/src/components/popup.scss +0 -16
  108. package/src/components/radiobtn.scss +0 -45
  109. package/src/components/ratingstar.scss +0 -33
  110. package/src/components/roundedLabel.scss +0 -10
  111. package/src/components/searchAction.scss +0 -20
  112. package/src/components/sectionalDropdown.scss +0 -43
  113. package/src/components/selectdropdown.scss +0 -174
  114. package/src/components/sidebar.scss +0 -141
  115. package/src/components/staticDynamicMessages.scss +0 -107
  116. package/src/components/staticSideBar.scss +0 -27
  117. package/src/components/statushighlight.scss +0 -17
  118. package/src/components/submiterrors.scss +0 -11
  119. package/src/components/summary.scss +0 -29
  120. package/src/components/table.scss +0 -201
  121. package/src/components/tag.scss +0 -27
  122. package/src/components/telephone.scss +0 -17
  123. package/src/components/textfields.scss +0 -96
  124. package/src/components/toast.scss +0 -31
  125. package/src/components/toggleSwitch.scss +0 -41
  126. package/src/components/topbar.scss +0 -153
  127. package/src/components/uploadcomponents.scss +0 -100
  128. package/src/digitv2/components/CitizenHomeCardV2.scss +0 -56
  129. package/src/digitv2/components/PageBasedInputV2.scss +0 -33
  130. package/src/digitv2/components/WhatsNewCardV2.scss +0 -13
  131. package/src/digitv2/components/actionLinkV2.scss +0 -9
  132. package/src/digitv2/components/appContainerV2.scss +0 -49
  133. package/src/digitv2/components/backButtonV2.scss +0 -26
  134. package/src/digitv2/components/bannerV2.scss +0 -120
  135. package/src/digitv2/components/breadCrumbV2.scss +0 -34
  136. package/src/digitv2/components/breakLineV2.scss +0 -6
  137. package/src/digitv2/components/cardBasedOptionsV2.scss +0 -46
  138. package/src/digitv2/components/checkpointV2.scss +0 -71
  139. package/src/digitv2/components/collapseAndExpandGroups.scss +0 -60
  140. package/src/digitv2/components/dateWrapV2.scss +0 -17
  141. package/src/digitv2/components/detailsCardV2.scss +0 -17
  142. package/src/digitv2/components/displayPhotosV2.scss +0 -33
  143. package/src/digitv2/components/footerV2.scss +0 -55
  144. package/src/digitv2/components/headerBarV2.scss +0 -34
  145. package/src/digitv2/components/headerV2.scss +0 -12
  146. package/src/digitv2/components/keynoteV2.scss +0 -35
  147. package/src/digitv2/components/loaderV2.scss +0 -85
  148. package/src/digitv2/components/modalV2.scss +0 -46
  149. package/src/digitv2/components/multiUploadWrapperV2.scss +0 -6
  150. package/src/digitv2/components/navbarV2.scss +0 -9
  151. package/src/digitv2/components/noresultsfoundV2.scss +0 -11
  152. package/src/digitv2/components/numeric.scss +0 -47
  153. package/src/digitv2/components/otpInputV2.scss +0 -15
  154. package/src/digitv2/components/paragraphV2.scss +0 -5
  155. package/src/digitv2/components/ratingV2.scss +0 -33
  156. package/src/digitv2/components/searchActionV2.scss +0 -11
  157. package/src/digitv2/components/searchFormV2.scss +0 -76
  158. package/src/digitv2/components/searchcomponent.scss +0 -7
  159. package/src/digitv2/components/sidebarV2.scss +0 -11
  160. package/src/digitv2/components/telephoneV2.scss +0 -18
  161. package/src/digitv2/components/toggleswitchV2.scss +0 -42
  162. package/src/digitv2/components/uploadFileV2.scss +0 -146
  163. package/src/pages/citizen/CitizenEngagementNotificationWrapper.scss +0 -8
  164. package/src/pages/citizen/DocumentList.scss +0 -305
  165. package/src/pages/citizen/Events.scss +0 -47
  166. package/src/pages/citizen/HomePageWrapper.scss +0 -158
  167. package/src/pages/citizen/SurveyList.scss +0 -22
  168. package/src/pages/citizen/citizenDocument.scss +0 -22
  169. package/src/pages/citizen/container.scss +0 -19
  170. package/src/pages/citizen/payment/payment-type.scss +0 -3
  171. package/src/pages/citizen/updatePropertyNumber.scss +0 -46
  172. package/src/pages/employee/EmployeeLogin.scss +0 -7
  173. package/src/pages/employee/cardfix.scss +0 -13
  174. package/src/pages/employee/container.scss +0 -72
  175. package/src/pages/employee/dss.scss +0 -266
  176. package/src/pages/employee/form-fields.scss +0 -13
  177. package/src/pages/employee/iframe.scss +0 -66
  178. package/src/pages/employee/inbox.scss +0 -585
  179. package/src/pages/employee/oldMobileInbox.scss +0 -5
  180. package/src/pages/employee/popupmodule.scss +0 -34
  181. package/src/pages/employee/response.scss +0 -3
  182. package/src/pages/employee/scroll-table.scss +0 -119
  183. package/src/pages/employee/surveys.scss +0 -273
  184. package/src/pages/employee/tooltip.scss +0 -36
  185. package/src/pages/employee/updateNumber.scss +0 -13
  186. package/svg/arrowdown.svg +0 -1
  187. package/svg/arrowleft.svg +0 -1
  188. package/svg/calendar.svg +0 -1
  189. package/svg/camera.svg +0 -4
  190. package/svg/check.svg +0 -4
  191. package/svg/close.svg +0 -4
  192. package/svg/error.svg +0 -4
  193. package/svg/error2.svg +0 -5
  194. package/svg/searchicon.svg +0 -4
  195. package/svg/starempty.svg +0 -4
  196. package/svg/starfilled.svg +0 -5
  197. package/svg/success.svg +0 -4
package/src/digitv2/typography.scss CHANGED
@@ -1,658 +1,639 @@
1
- @import url("../index.scss");
2
-
3
- .typography {
4
- &.text-heading-xl {
5
- font-family: theme(digitv2.fontFamily.rc);
6
- font-style: theme(digitv2.fontStyle.normal);
7
- font-weight: theme(digitv2.fontWeight.bold);
8
- color: theme(digitv2.lightTheme.text-primary);
9
- line-height: theme(digitv2.lineHeight.normal);
10
-
11
- @media (min-width: theme(digitv2.screens.desktop)) {
12
- font-size: theme(digitv2.fontSize.heading-xl.desktop);
13
- }
14
-
15
- @media (min-width: theme(digitv2.screens.tablet)) {
16
- font-size: theme(digitv2.fontSize.heading-xl.tablet);
17
- }
18
-
19
- @media (min-width: theme(digitv2.screens.mobile)) {
20
- font-size: theme(digitv2.fontSize.heading-xl.mobile);
21
- }
22
- }
23
-
24
- &.text-heading-l {
25
- font-family: theme(digitv2.fontFamily.sans);
26
- font-style: theme(digitv2.fontStyle.normal);
27
- font-weight: theme(digitv2.fontWeight.bold);
28
- color: theme(digitv2.lightTheme.text-primary);
29
- line-height: theme(digitv2.lineHeight.normal);
30
-
31
- @media screen and (min-width: theme(digitv2.screens.desktop)) {
32
- font-size: theme(digitv2.fontSize.heading-l.desktop);
33
- }
34
-
35
- @media screen and (min-width: theme(digitv2.screens.tablet)) {
36
- font-size: theme(digitv2.fontSize.heading-l.tablet);
37
- }
38
-
39
- @media screen and (min-width: theme(digitv2.screens.mobile)) {
40
- font-size: theme(digitv2.fontSize.heading-l.mobile);
41
- }
42
- }
43
-
44
- &.text-heading-m {
45
- font-family: theme(digitv2.fontFamily.sans);
46
- font-style: theme(digitv2.fontStyle.normal);
47
- font-weight: theme(digitv2.fontWeight.bold);
48
- color: theme(digitv2.lightTheme.text-primary);
49
- line-height: theme(digitv2.lineHeight.normal);
50
-
51
- @media screen and (min-width: theme(digitv2.screens.desktop)) {
52
- font-size: theme(digitv2.fontSize.heading-m.desktop);
53
- }
54
-
55
- @media screen and (min-width: theme(digitv2.screens.tablet)) {
56
- font-size: theme(digitv2.fontSize.heading-m.tablet);
57
- }
58
-
59
- @media screen and (min-width: theme(digitv2.screens.mobile)) {
60
- font-size: theme(digitv2.fontSize.heading-m.desktop);
61
- }
62
- }
63
-
64
- &.text-heading-s {
65
- font-family: theme(digitv2.fontFamily.sans);
66
- font-style: theme(digitv2.fontStyle.normal);
67
- font-weight: theme(digitv2.fontWeight.bold);
68
- color: theme(digitv2.lightTheme.text-primary);
69
- line-height: theme(digitv2.lineHeight.normal);
70
-
71
- @media screen and (min-width: theme(digitv2.screens.desktop)) {
72
- font-size: theme(digitv2.fontSize.heading-s.desktop);
73
- }
74
-
75
- @media screen and (min-width: theme(digitv2.screens.tablet)) {
76
- font-size: theme(digitv2.fontSize.heading-s.tablet);
77
- }
78
-
79
- @media screen and (min-width: theme(digitv2.screens.mobile)) {
80
- font-size: theme(digitv2.fontSize.heading-s.mobile);
81
- }
82
- }
83
-
84
- &.text-heading-xs {
85
- @media screen and (min-width: theme(digitv2.screens.mobile)) {
86
- font-size: theme(digitv2.fontSize.heading-xs.mobile);
87
- font-family: theme(digitv2.fontFamily.sans);
88
- font-style: theme(digitv2.fontStyle.normal);
89
- font-weight: theme(digitv2.fontWeight.bold);
90
- color: theme(digitv2.lightTheme.text-primary);
91
- line-height: theme(digitv2.lineHeight.normal);
92
- }
93
- }
94
-
95
- &.text-caption-l {
96
- font-family: theme(digitv2.fontFamily.sans);
97
- font-style: theme(digitv2.fontStyle.italic);
98
- font-weight: theme(digitv2.fontWeight.medium);
99
- color: theme(digitv2.lightTheme.text-primary);
100
- line-height: theme(digitv2.lineHeight.normal);
101
-
102
- @media screen and (min-width: theme(digitv2.screens.desktop)) {
103
- font-size: theme(digitv2.fontSize.caption-l.desktop);
104
- }
105
-
106
- @media screen and (min-width: theme(digitv2.screens.tablet)) {
107
- font-size: theme(digitv2.fontSize.caption-l.tablet);
108
- }
109
-
110
- @media screen and (min-width: theme(digitv2.screens.mobile)) {
111
- font-size: theme(digitv2.fontSize.caption-l.mobile);
112
- }
113
- }
114
-
115
- &.text-caption-m {
116
- font-family: theme(digitv2.fontFamily.sans);
117
- font-style: theme(digitv2.fontStyle.italic);
118
- font-weight: theme(digitv2.fontWeight.medium);
119
- color: theme(digitv2.lightTheme.text-primary);
120
- line-height: theme(digitv2.lineHeight.normal);
121
-
122
- @media screen and (min-width: theme(digitv2.screens.desktop)) {
123
- font-size: theme(digitv2.fontSize.caption-m.desktop);
124
- }
125
-
126
- @media screen and (min-width: theme(digitv2.screens.tablet)) {
127
- font-size: theme(digitv2.fontSize.caption-m.tablet);
128
- }
129
-
130
- @media screen and (min-width: theme(digitv2.screens.mobile)) {
131
- font-size: theme(digitv2.fontSize.caption-m.mobile);
132
- }
133
- }
134
-
135
- &.text-caption-s {
136
- font-family: theme(digitv2.fontFamily.sans);
137
- font-style: theme(digitv2.fontStyle.italic);
138
- font-weight: theme(digitv2.fontWeight.medium);
139
- color: theme(digitv2.lightTheme.text-primary);
140
- line-height: theme(digitv2.lineHeight.normal);
141
-
142
- @media screen and (min-width: theme(digitv2.screens.desktop)) {
143
- font-size: theme(digitv2.fontSize.caption-s.desktop);
144
- }
145
-
146
- @media screen and (min-width: theme(digitv2.screens.tablet)) {
147
- font-size: theme(digitv2.fontSize.caption-s.tablet);
148
- }
149
-
150
- @media screen and (min-width: theme(digitv2.screens.mobile)) {
151
- font-size: theme(digitv2.fontSize.caption-s.desktop);
152
- }
153
- }
154
-
155
- &.text-body-l {
156
- font-family: theme(digitv2.fontFamily.sans);
157
- font-style: theme(digitv2.fontStyle.italic);
158
- font-weight: theme(digitv2.fontWeight.regular);
159
- color: theme(digitv2.lightTheme.text-primary);
160
-
161
- @media screen and (min-width: theme(digitv2.screens.desktop)) {
162
- font-size: theme(digitv2.fontSize.body-l.desktop);
163
- line-height: theme(digitv2.lineHeight.line-height-body-l.desktop);
164
- }
165
-
166
- @media screen and (min-width: theme(digitv2.screens.tablet)) {
167
- font-size: theme(digitv2.fontSize.body-l.tablet);
168
- line-height: theme(digitv2.lineHeight.line-height-body-l.tablet);
169
- }
170
-
171
- @media screen and (min-width: theme(digitv2.screens.mobile)) {
172
- font-size: theme(digitv2.fontSize.body-l.mobile);
173
- line-height: theme(digitv2.lineHeight.line-height-body-l.mobile);
174
- }
175
- }
176
-
177
- &.text-body-s {
178
- font-family: theme(digitv2.fontFamily.sans);
179
- font-style: theme(digitv2.fontStyle.italic);
180
- font-weight: theme(digitv2.fontWeight.regular);
181
- color: theme(digitv2.lightTheme.text-primary);
182
-
183
- @media screen and (min-width: theme(digitv2.screens.desktop)) {
184
- font-size: theme(digitv2.fontSize.body-s.desktop);
185
- line-height: theme(digitv2.lineHeight.line-height-body-s.desktop);
186
- }
187
-
188
- @media screen and (min-width: theme(digitv2.screens.tablet)) {
189
- font-size: theme(digitv2.fontSize.body-s.tablet);
190
- line-height: theme(digitv2.lineHeight.line-height-body-s.tablet);
191
- }
192
-
193
- @media screen and (min-width: theme(digitv2.screens.mobile)) {
194
- font-size: theme(digitv2.fontSize.body-s.mobile);
195
- line-height: theme(digitv2.lineHeight.line-height-body-s.mobile);
196
- }
197
- }
198
-
199
- &.text-body-xs {
200
- font-family: theme(digitv2.fontFamily.sans);
201
- font-style: theme(digitv2.fontStyle.italic);
202
- font-weight: theme(digitv2.fontWeight.regular);
203
- color: theme(digitv2.lightTheme.text-primary);
204
-
205
- @media screen and (min-width: theme(digitv2.screens.desktop)) {
206
- font-size: theme(digitv2.fontSize.body-xs.desktop);
207
- line-height: theme(digitv2.lineHeight.line-height-body-xs.desktop);
208
- }
209
-
210
- @media screen and (min-width: theme(digitv2.screens.tablet)) {
211
- font-size: theme(digitv2.fontSize.body-xs.tablet);
212
- line-height: theme(digitv2.lineHeight.line-height-body-xs.tablet);
213
- }
214
-
215
- @media screen and (min-width: theme(digitv2.screens.mobile)) {
216
- font-size: theme(digitv2.fontSize.body-xs.mobile);
217
- line-height: theme(digitv2.lineHeight.line-height-body-xs.mobile);
218
- }
219
- }
220
-
221
- &.text-label {
222
- font-family: theme(digitv2.fontFamily.sans);
223
- font-style: theme(digitv2.fontStyle.italic);
224
- font-weight: theme(digitv2.fontWeight.regular);
225
- color: theme(digitv2.lightTheme.text-primary);
226
- line-height: theme(digitv2.lineHeight.normal);
227
-
228
- @media screen and (min-width: theme(digitv2.screens.desktop)) {
229
- font-size: theme(digitv2.fontSize.label.desktop);
230
- }
231
-
232
- @media screen and (min-width: theme(digitv2.screens.tablet)) {
233
- font-size: theme(digitv2.fontSize.label.tablet);
234
- }
235
-
236
- @media screen and (min-width: theme(digitv2.screens.mobile)) {
237
- font-size: theme(digitv2.fontSize.label.mobile);
238
- }
239
- }
240
-
241
- &.text-link {
242
- font-family: theme(digitv2.fontFamily.sans);
243
- font-style: theme(digitv2.fontStyle.normal);
244
- font-weight: theme(digitv2.fontWeight.regular);
245
- color: theme(digitv2.lightTheme.text-primary);
246
- line-height: theme(digitv2.lineHeight.normal);
247
- text-decoration: theme(digitv2.textDecorationLine.underline);
248
-
249
- @media screen and (min-width: theme(digitv2.screens.desktop)) {
250
- font-size: theme(digitv2.fontSize.link.desktop);
251
- }
252
-
253
- @media screen and (min-width: theme(digitv2.screens.tablet)) {
254
- font-size: theme(digitv2.fontSize.link.tablet);
255
- }
256
-
257
- @media screen and (min-width: theme(digitv2.screens.mobile)) {
258
- font-size: theme(digitv2.fontSize.link.mobile);
259
- }
260
- }
261
-
262
-
263
- &.heading-xl {
264
- font-family: theme(digitv2.fontFamily.sans);
265
- font-style: theme(digitv2.fontStyle.normal);
266
- font-weight: theme(digitv2.fontWeight.bold);
267
- line-height: theme(digitv2.lineHeight.lineheight1);
268
-
269
- @media (max-aspect-ratio: 9/16) {
270
- /* Media query for mobile */
271
- font-size: theme(digitv2.fontSize.heading-xl.mobile);
272
- }
273
-
274
- @media (min-aspect-ratio: 9/16) and (max-aspect-ratio: 3/4) {
275
- /* Media query for tablets */
276
- font-size: theme(digitv2.fontSize.heading-xl.tablet);
277
- }
278
-
279
- @media (min-aspect-ratio: 3/4) {
280
- /* Media query for desktop */
281
- font-size: theme(digitv2.fontSize.heading-xl.desktop);
282
- }
283
- }
284
-
285
- &.heading-l {
286
- font-family: theme(digitv2.fontFamily.sans);
287
- font-style: theme(digitv2.fontStyle.normal);
288
- font-weight: theme(digitv2.fontWeight.bold);
289
- line-height: theme(digitv2.lineHeight.lineheight1);
290
-
291
- @media (max-aspect-ratio: 9/16) {
292
- /* Media query for mobile */
293
- font-size: theme(digitv2.fontSize.heading-l.mobile);
294
- }
295
-
296
- @media (min-aspect-ratio: 9/16) and (max-aspect-ratio: 3/4) {
297
- /* Media query for tablets */
298
- font-size: theme(digitv2.fontSize.heading-l.tablet);
299
- }
300
-
301
- @media (min-aspect-ratio: 3/4) {
302
- /* Media query for desktop */
303
- font-size: theme(digitv2.fontSize.heading-l.desktop);
304
- }
305
- }
306
-
307
- &.heading-m {
308
- font-family: theme(digitv2.fontFamily.sans);
309
- font-style: theme(digitv2.fontStyle.normal);
310
- font-weight: theme(digitv2.fontWeight.bold);
311
- line-height: theme(digitv2.lineHeight.lineheight1);
312
-
313
- @media (max-aspect-ratio: 9/16) {
314
- /* Media query for mobile */
315
- font-size: theme(digitv2.fontSize.heading-m.mobile);
316
- }
317
-
318
- @media (min-aspect-ratio: 9/16) and (max-aspect-ratio: 3/4) {
319
- /* Media query for tablets */
320
- font-size: theme(digitv2.fontSize.heading-m.tablet);
321
- }
322
-
323
- @media (min-aspect-ratio: 3/4) {
324
- /* Media query for desktop */
325
- font-size: theme(digitv2.fontSize.heading-m.desktop);
326
- }
327
- }
328
-
329
- &.heading-s {
330
- font-family: theme(digitv2.fontFamily.sans);
331
- font-style: theme(digitv2.fontStyle.normal);
332
- font-weight: theme(digitv2.fontWeight.bold);
333
- line-height: theme(digitv2.lineHeight.lineheight1);
334
-
335
- @media (max-aspect-ratio: 9/16) {
336
- /* Media query for mobile */
337
- font-size: theme(digitv2.fontSize.heading-s.mobile);
338
- }
339
-
340
- @media (min-aspect-ratio: 9/16) and (max-aspect-ratio: 3/4) {
341
- /* Media query for tablets */
342
- font-size: theme(digitv2.fontSize.heading-s.tablet);
343
- }
344
-
345
- @media (min-aspect-ratio: 3/4) {
346
- /* Media query for desktop */
347
- font-size: theme(digitv2.fontSize.heading-s.desktop);
348
- }
349
- }
350
-
351
- &.heading-xs {
352
- font-family: theme(digitv2.fontFamily.sans);
353
- font-style: theme(digitv2.fontStyle.normal);
354
- font-weight: theme(digitv2.fontWeight.bold);
355
- line-height: theme(digitv2.lineHeight.lineheight1);
356
-
357
- @media (max-aspect-ratio: 9/16) {
358
- /* Media query for mobile */
359
- font-size: theme(digitv2.fontSize.heading-xs.mobile);
360
- }
361
-
362
- @media (min-aspect-ratio: 9/16) and (max-aspect-ratio: 3/4) {
363
- /* Media query for tablets */
364
- font-size: theme(digitv2.fontSize.heading-xs.tablet);
365
- }
366
-
367
- @media (min-aspect-ratio: 3/4) {
368
- /* Media query for desktop */
369
- font-size: theme(digitv2.fontSize.heading-xs.desktop);
370
- }
371
- }
372
-
373
- &.caption-l {
374
- font-family: theme(digitv2.fontFamily.sans);
375
- font-style: theme(digitv2.fontStyle.normal);
376
- font-weight: theme(digitv2.fontWeight.medium);
377
- line-height: theme(digitv2.lineHeight.lineheight1);
378
-
379
- @media (max-aspect-ratio: 9/16) {
380
- /* Media query for mobile */
381
- font-size: theme(digitv2.fontSize.caption-l.mobile);
382
- }
383
-
384
- @media (min-aspect-ratio: 9/16) and (max-aspect-ratio: 3/4) {
385
- /* Media query for tablets */
386
- font-size: theme(digitv2.fontSize.caption-l.tablet);
387
- }
388
-
389
- @media (min-aspect-ratio: 3/4) {
390
- /* Media query for desktop */
391
- font-size: theme(digitv2.fontSize.caption-l.desktop);
392
- }
393
- }
394
-
395
- &.caption-m {
396
- font-family: theme(digitv2.fontFamily.sans);
397
- font-style: theme(digitv2.fontStyle.normal);
398
- font-weight: theme(digitv2.fontWeight.medium);
399
- line-height: theme(digitv2.lineHeight.lineheight1);
400
-
401
- @media (max-aspect-ratio: 9/16) {
402
- /* Media query for mobile */
403
- font-size: theme(digitv2.fontSize.caption-m.mobile);
404
- }
405
-
406
- @media (min-aspect-ratio: 9/16) and (max-aspect-ratio: 3/4) {
407
- /* Media query for tablets */
408
- font-size: theme(digitv2.fontSize.caption-m.tablet);
409
-
410
- }
411
-
412
- @media (min-aspect-ratio: 3/4){
413
- /* Media query for desktop */
414
- font-size: theme(digitv2.fontSize.caption-m.desktop);
415
- }
416
-
417
- }
418
-
419
- &.caption-s {
420
- font-family: theme(digitv2.fontFamily.sans);
421
- font-style: theme(digitv2.fontStyle.normal);
422
- font-weight: theme(digitv2.fontWeight.medium);
423
- line-height: theme(digitv2.lineHeight.lineheight1);
424
-
425
- @media (max-aspect-ratio: 9/16) {
426
- /* Media query for mobile */
427
- font-size: theme(digitv2.fontSize.caption-s.mobile);
428
- }
429
-
430
- @media (min-aspect-ratio: 9/16) and (max-aspect-ratio: 3/4) {
431
- /* Media query for tablets */
432
- font-size: theme(digitv2.fontSize.caption-s.tablet);
433
- }
434
-
435
- @media (min-aspect-ratio: 3/4){
436
- /* Media query for desktop */
437
- font-size: theme(digitv2.fontSize.caption-s.desktop);
438
- }
439
-
440
- }
441
-
442
- &.body-l {
443
- font-family: theme(digitv2.fontFamily.sans);
444
- font-style: theme(digitv2.fontStyle.normal);
445
- font-weight: theme(digitv2.fontWeight.regular);
446
- line-height: theme(digitv2.lineHeight.lineheight2);
447
-
448
- @media (max-aspect-ratio: 9/16) {
449
- /* Media query for mobile */
450
- font-size: theme(digitv2.fontSize.body-l.mobile);
451
- }
452
-
453
- @media (min-aspect-ratio: 9/16) and (max-aspect-ratio: 3/4) {
454
- /* Media query for tablets */
455
- font-size: theme(digitv2.fontSize.body-l.tablet);
456
- }
457
-
458
- @media (min-aspect-ratio: 3/4) {
459
- /* Media query for desktop */
460
- font-size: theme(digitv2.fontSize.body-l.desktop);
461
- }
462
- }
463
-
464
- &.body-s {
465
- font-family: theme(digitv2.fontFamily.sans);
466
- font-style: theme(digitv2.fontStyle.normal);
467
- font-weight: theme(digitv2.fontWeight.regular);
468
- line-height: theme(digitv2.lineHeight.lineheight2);
469
-
470
- @media (max-aspect-ratio: 9/16) {
471
- /* Media query for mobile */
472
- font-size: theme(digitv2.fontSize.body-s.mobile);
473
- }
474
-
475
- @media (min-aspect-ratio: 9/16) and (max-aspect-ratio: 3/4) {
476
- /* Media query for tablets */
477
- font-size: theme(digitv2.fontSize.body-s.tablet);
478
- }
479
-
480
- @media (min-aspect-ratio: 3/4) {
481
- /* Media query for desktop */
482
- font-size: theme(digitv2.fontSize.body-s.desktop);
483
- }
484
- }
485
-
486
- &.body-xs {
487
- font-family: theme(digitv2.fontFamily.sans);
488
- font-style: theme(digitv2.fontStyle.normal);
489
- font-weight: theme(digitv2.fontWeight.regular);
490
- line-height: theme(digitv2.lineHeight.lineheight2);
491
-
492
- @media (max-aspect-ratio: 9/16) {
493
- /* Media query for mobile */
494
- font-size: theme(digitv2.fontSize.body-xs.mobile);
495
- }
496
-
497
- @media (min-aspect-ratio: 9/16) and (max-aspect-ratio: 3/4) {
498
- /* Media query for tablets */
499
- font-size: theme(digitv2.fontSize.body-xs.tablet);
500
- }
501
-
502
- @media (min-aspect-ratio: 3/4) {
503
- /* Media query for desktop */
504
- font-size: theme(digitv2.fontSize.body-xs.desktop);
505
- }
506
- }
507
-
508
- &.label {
509
- font-family: theme(digitv2.fontFamily.sans);
510
- font-style: theme(digitv2.fontStyle.normal);
511
- font-weight: theme(digitv2.fontWeight.regular);
512
- line-height: theme(digitv2.lineHeight.lineheight2);
513
-
514
- @media (max-aspect-ratio: 9/16) {
515
- /* Media query for mobile */
516
- font-size: theme(digitv2.fontSize.label.mobile);
517
- }
518
-
519
- @media (min-aspect-ratio: 9/16) and (max-aspect-ratio: 3/4) {
520
- /* Media query for tablets */
521
- font-size: theme(digitv2.fontSize.label.tablet);
522
- }
523
-
524
- @media (min-aspect-ratio: 3/4) {
525
- /* Media query for desktop */
526
- font-size: theme(digitv2.fontSize.label.desktop);
527
- }
528
- }
529
-
530
- &.link {
531
- font-family: theme(digitv2.fontFamily.sans);
532
- font-style: theme(digitv2.fontStyle.normal);
533
- font-weight: theme(digitv2.fontWeight.regular);
534
- text-decoration: theme(digitv2.textDecorationLine.underline);
535
- font-size: theme(digitv2.fontSize.link-l.mobile);
536
- }
537
-
538
- &.link-L {
539
- @media (max-aspect-ratio: 9/16) {
540
- /* Media query for mobile */
541
- font-family: theme(digitv2.fontFamily.sans);
542
- font-size: theme(digitv2.fontSize.link-l.mobile);
543
- font-weight: theme(digitv2.fontWeight.regular);
544
- line-height: theme(digitv2.lineHeight.lineheight2);
545
- text-decoration: theme(digitv2.textDecorationLine.underline);
546
- text-decoration-thickness: 0.063rem;
547
- }
548
-
549
- @media (min-aspect-ratio: 9/16) and (max-aspect-ratio: 3/4){
550
- /* Media query for tablets */
551
- font-family: theme(digitv2.fontFamily.sans);
552
- font-size: theme(digitv2.fontSize.link-l.tablet);
553
- font-weight: theme(digitv2.fontWeight.regular);
554
- line-height: theme(digitv2.lineHeight.lineheight2);
555
- text-decoration: theme(digitv2.textDecorationLine.underline);
556
- text-decoration-thickness: 0.063rem;
557
- }
558
-
559
- @media (min-aspect-ratio: 3/4) {
560
- /* Media query for desktop */
561
- font-family: theme(digitv2.fontFamily.sans);
562
- font-size: theme(digitv2.fontSize.link-l.desktop);
563
- font-weight: theme(digitv2.fontWeight.regular);
564
- line-height: theme(digitv2.lineHeight.lineheight2);
565
- text-decoration: theme(digitv2.textDecorationLine.underline);
566
- text-decoration-thickness: 0.063rem;
567
- }
568
- }
569
-
570
- &.link-S {
571
- @media (max-aspect-ratio: 9/16) {
572
- /* Media query for mobile */
573
- font-family: theme(digitv2.fontFamily.sans);
574
- font-size: theme(digitv2.fontSize.link-s.mobile);
575
- font-weight: theme(digitv2.fontWeight.regular);
576
- line-height: theme(digitv2.lineHeight.lineheight2);
577
- text-decoration: theme(digitv2.textDecorationLine.underline);
578
- text-decoration-thickness: 0.063rem;
579
- }
580
-
581
- @media (min-aspect-ratio: 9/16) and (max-aspect-ratio: 3/4) {
582
- /* Media query for tablets */
583
- font-family: theme(digitv2.fontFamily.sans);
584
- font-size: theme(digitv2.fontSize.link-s.tablet);
585
- font-weight: theme(digitv2.fontWeight.regular);
586
- line-height: theme(digitv2.lineHeight.lineheight2);
587
- text-decoration: theme(digitv2.textDecorationLine.underline);
588
- text-decoration-thickness: 0.063rem;
589
- }
590
-
591
-
592
- @media (min-aspect-ratio: 3/4){
593
- /* Media query for desktop */
594
- font-family: theme(digitv2.fontFamily.sans);
595
- font-size: theme(digitv2.fontSize.link-s.desktop);
596
- font-weight: theme(digitv2.fontWeight.regular);
597
- line-height: theme(digitv2.lineHeight.lineheight2);
598
- text-decoration: theme(digitv2.textDecorationLine.underline);
599
- text-decoration-thickness: 0.063rem;
600
- }
601
- }
602
-
603
- &.link-XS {
604
- @media (max-aspect-ratio: 9/16) {
605
- /* Media query for mobile */
606
- font-family: theme(digitv2.fontFamily.sans);
607
- font-size: theme(digitv2.fontSize.link-xs.mobile);
608
- font-weight: theme(digitv2.fontWeight.regular);
609
- line-height: theme(digitv2.lineHeight.lineheight2);
610
- text-decoration: theme(digitv2.textDecorationLine.underline);
611
- text-decoration-thickness: 0.063rem;
612
- }
613
-
614
- @media (min-aspect-ratio: 9/16) and (max-aspect-ratio: 3/4) {
615
- /* Media query for tablets */
616
- font-family: theme(digitv2.fontFamily.sans);
617
- font-size: theme(digitv2.fontSize.link-xs.tablet);
618
- font-weight: theme(digitv2.fontWeight.regular);
619
- line-height: theme(digitv2.lineHeight.lineheight2);
620
- text-decoration: theme(digitv2.textDecorationLine.underline);
621
- text-decoration-thickness: 0.063rem;
622
- }
623
-
624
- @media (min-aspect-ratio: 3/4) {
625
- /* Media query for desktop */
626
- font-family: theme(digitv2.fontFamily.sans);
627
- font-size: theme(digitv2.fontSize.link-xs.desktop);
628
- font-weight: theme(digitv2.fontWeight.regular);
629
- line-height: theme(digitv2.lineHeight.lineheight2);
630
- text-decoration: theme(digitv2.textDecorationLine.underline);
631
- text-decoration-thickness: 0.063rem;
632
- }
633
- }
634
-
635
- &.button {
636
-
637
- &.large {
638
- font-size: theme(digitv2.fontSize.button.large);
639
- line-height: theme(digitv2.lineHeight.lineheight1);
640
- font-family: theme(digitv2.fontFamily.sans);
641
- font-weight: theme(digitv2.fontWeight.medium);
642
- }
643
-
644
- &.medium {
645
- font-size: theme(digitv2.fontSize.button.medium);
646
- line-height: theme(digitv2.lineHeight.lineheight1);
647
- font-family: theme(digitv2.fontFamily.sans);
648
- font-weight: theme(digitv2.fontWeight.medium);
649
- }
650
-
651
- &.small {
652
- font-size: theme(digitv2.fontSize.button.small);
653
- line-height: theme(digitv2.lineHeight.lineheight1);
654
- font-family: theme(digitv2.fontFamily.sans);
655
- font-weight: theme(digitv2.fontWeight.medium);
656
- }
657
- }
1
+ @import url("../index.scss");
2
+
3
+ .typography {
4
+
5
+ &.text-heading-l {
6
+ font-family: theme(digitv2.fontFamily.sans);
7
+ font-style: theme(digitv2.fontStyle.normal);
8
+ font-weight: theme(digitv2.fontWeight.bold);
9
+ color: theme(digitv2.lightTheme.text-primary);
10
+ line-height: theme(digitv2.lineHeight.normal);
11
+
12
+ @media screen and (min-width: theme(digitv2.screens.desktop)) {
13
+ font-size: theme(digitv2.fontSize.heading-l.desktop);
14
+ }
15
+
16
+ @media screen and (min-width: theme(digitv2.screens.tablet)) {
17
+ font-size: theme(digitv2.fontSize.heading-l.tablet);
18
+ }
19
+
20
+ @media screen and (min-width: theme(digitv2.screens.mobile)) {
21
+ font-size: theme(digitv2.fontSize.heading-l.mobile);
22
+ }
23
+ }
24
+
25
+ &.text-heading-m {
26
+ font-family: theme(digitv2.fontFamily.sans);
27
+ font-style: theme(digitv2.fontStyle.normal);
28
+ font-weight: theme(digitv2.fontWeight.bold);
29
+ color: theme(digitv2.lightTheme.text-primary);
30
+ line-height: theme(digitv2.lineHeight.normal);
31
+
32
+ @media screen and (min-width: theme(digitv2.screens.desktop)) {
33
+ font-size: theme(digitv2.fontSize.heading-m.desktop);
34
+ }
35
+
36
+ @media screen and (min-width: theme(digitv2.screens.tablet)) {
37
+ font-size: theme(digitv2.fontSize.heading-m.tablet);
38
+ }
39
+
40
+ @media screen and (min-width: theme(digitv2.screens.mobile)) {
41
+ font-size: theme(digitv2.fontSize.heading-m.desktop);
42
+ }
43
+ }
44
+
45
+ &.text-heading-s {
46
+ font-family: theme(digitv2.fontFamily.sans);
47
+ font-style: theme(digitv2.fontStyle.normal);
48
+ font-weight: theme(digitv2.fontWeight.bold);
49
+ color: theme(digitv2.lightTheme.text-primary);
50
+ line-height: theme(digitv2.lineHeight.normal);
51
+
52
+ @media screen and (min-width: theme(digitv2.screens.desktop)) {
53
+ font-size: theme(digitv2.fontSize.heading-s.desktop);
54
+ }
55
+
56
+ @media screen and (min-width: theme(digitv2.screens.tablet)) {
57
+ font-size: theme(digitv2.fontSize.heading-s.tablet);
58
+ }
59
+
60
+ @media screen and (min-width: theme(digitv2.screens.mobile)) {
61
+ font-size: theme(digitv2.fontSize.heading-s.mobile);
62
+ }
63
+ }
64
+
65
+ &.text-heading-xs {
66
+ @media screen and (min-width: theme(digitv2.screens.mobile)) {
67
+ font-size: theme(digitv2.fontSize.heading-xs.mobile);
68
+ font-family: theme(digitv2.fontFamily.sans);
69
+ font-style: theme(digitv2.fontStyle.normal);
70
+ font-weight: theme(digitv2.fontWeight.bold);
71
+ color: theme(digitv2.lightTheme.text-primary);
72
+ line-height: theme(digitv2.lineHeight.normal);
73
+ }
74
+ }
75
+
76
+ &.text-caption-l {
77
+ font-family: theme(digitv2.fontFamily.sans);
78
+ font-style: theme(digitv2.fontStyle.italic);
79
+ font-weight: theme(digitv2.fontWeight.medium);
80
+ color: theme(digitv2.lightTheme.text-primary);
81
+ line-height: theme(digitv2.lineHeight.normal);
82
+
83
+ @media screen and (min-width: theme(digitv2.screens.desktop)) {
84
+ font-size: theme(digitv2.fontSize.caption-l.desktop);
85
+ }
86
+
87
+ @media screen and (min-width: theme(digitv2.screens.tablet)) {
88
+ font-size: theme(digitv2.fontSize.caption-l.tablet);
89
+ }
90
+
91
+ @media screen and (min-width: theme(digitv2.screens.mobile)) {
92
+ font-size: theme(digitv2.fontSize.caption-l.mobile);
93
+ }
94
+ }
95
+
96
+ &.text-caption-m {
97
+ font-family: theme(digitv2.fontFamily.sans);
98
+ font-style: theme(digitv2.fontStyle.italic);
99
+ font-weight: theme(digitv2.fontWeight.medium);
100
+ color: theme(digitv2.lightTheme.text-primary);
101
+ line-height: theme(digitv2.lineHeight.normal);
102
+
103
+ @media screen and (min-width: theme(digitv2.screens.desktop)) {
104
+ font-size: theme(digitv2.fontSize.caption-m.desktop);
105
+ }
106
+
107
+ @media screen and (min-width: theme(digitv2.screens.tablet)) {
108
+ font-size: theme(digitv2.fontSize.caption-m.tablet);
109
+ }
110
+
111
+ @media screen and (min-width: theme(digitv2.screens.mobile)) {
112
+ font-size: theme(digitv2.fontSize.caption-m.mobile);
113
+ }
114
+ }
115
+
116
+ &.text-caption-s {
117
+ font-family: theme(digitv2.fontFamily.sans);
118
+ font-style: theme(digitv2.fontStyle.italic);
119
+ font-weight: theme(digitv2.fontWeight.medium);
120
+ color: theme(digitv2.lightTheme.text-primary);
121
+ line-height: theme(digitv2.lineHeight.normal);
122
+
123
+ @media screen and (min-width: theme(digitv2.screens.desktop)) {
124
+ font-size: theme(digitv2.fontSize.caption-s.desktop);
125
+ }
126
+
127
+ @media screen and (min-width: theme(digitv2.screens.tablet)) {
128
+ font-size: theme(digitv2.fontSize.caption-s.tablet);
129
+ }
130
+
131
+ @media screen and (min-width: theme(digitv2.screens.mobile)) {
132
+ font-size: theme(digitv2.fontSize.caption-s.desktop);
133
+ }
134
+ }
135
+
136
+ &.text-body-l {
137
+ font-family: theme(digitv2.fontFamily.sans);
138
+ font-style: theme(digitv2.fontStyle.italic);
139
+ font-weight: theme(digitv2.fontWeight.regular);
140
+ color: theme(digitv2.lightTheme.text-primary);
141
+
142
+ @media screen and (min-width: theme(digitv2.screens.desktop)) {
143
+ font-size: theme(digitv2.fontSize.body-l.desktop);
144
+ line-height: theme(digitv2.lineHeight.line-height-body-l.desktop);
145
+ }
146
+
147
+ @media screen and (min-width: theme(digitv2.screens.tablet)) {
148
+ font-size: theme(digitv2.fontSize.body-l.tablet);
149
+ line-height: theme(digitv2.lineHeight.line-height-body-l.tablet);
150
+ }
151
+
152
+ @media screen and (min-width: theme(digitv2.screens.mobile)) {
153
+ font-size: theme(digitv2.fontSize.body-l.mobile);
154
+ line-height: theme(digitv2.lineHeight.line-height-body-l.mobile);
155
+ }
156
+ }
157
+
158
+ &.text-body-s {
159
+ font-family: theme(digitv2.fontFamily.sans);
160
+ font-style: theme(digitv2.fontStyle.italic);
161
+ font-weight: theme(digitv2.fontWeight.regular);
162
+ color: theme(digitv2.lightTheme.text-primary);
163
+
164
+ @media screen and (min-width: theme(digitv2.screens.desktop)) {
165
+ font-size: theme(digitv2.fontSize.body-s.desktop);
166
+ line-height: theme(digitv2.lineHeight.line-height-body-s.desktop);
167
+ }
168
+
169
+ @media screen and (min-width: theme(digitv2.screens.tablet)) {
170
+ font-size: theme(digitv2.fontSize.body-s.tablet);
171
+ line-height: theme(digitv2.lineHeight.line-height-body-s.tablet);
172
+ }
173
+
174
+ @media screen and (min-width: theme(digitv2.screens.mobile)) {
175
+ font-size: theme(digitv2.fontSize.body-s.mobile);
176
+ line-height: theme(digitv2.lineHeight.line-height-body-s.mobile);
177
+ }
178
+ }
179
+
180
+ &.text-body-xs {
181
+ font-family: theme(digitv2.fontFamily.sans);
182
+ font-style: theme(digitv2.fontStyle.italic);
183
+ font-weight: theme(digitv2.fontWeight.regular);
184
+ color: theme(digitv2.lightTheme.text-primary);
185
+
186
+ @media screen and (min-width: theme(digitv2.screens.desktop)) {
187
+ font-size: theme(digitv2.fontSize.body-xs.desktop);
188
+ line-height: theme(digitv2.lineHeight.line-height-body-xs.desktop);
189
+ }
190
+
191
+ @media screen and (min-width: theme(digitv2.screens.tablet)) {
192
+ font-size: theme(digitv2.fontSize.body-xs.tablet);
193
+ line-height: theme(digitv2.lineHeight.line-height-body-xs.tablet);
194
+ }
195
+
196
+ @media screen and (min-width: theme(digitv2.screens.mobile)) {
197
+ font-size: theme(digitv2.fontSize.body-xs.mobile);
198
+ line-height: theme(digitv2.lineHeight.line-height-body-xs.mobile);
199
+ }
200
+ }
201
+
202
+ &.text-label {
203
+ font-family: theme(digitv2.fontFamily.sans);
204
+ font-style: theme(digitv2.fontStyle.italic);
205
+ font-weight: theme(digitv2.fontWeight.regular);
206
+ color: theme(digitv2.lightTheme.text-primary);
207
+ line-height: theme(digitv2.lineHeight.normal);
208
+
209
+ @media screen and (min-width: theme(digitv2.screens.desktop)) {
210
+ font-size: theme(digitv2.fontSize.label.desktop);
211
+ }
212
+
213
+ @media screen and (min-width: theme(digitv2.screens.tablet)) {
214
+ font-size: theme(digitv2.fontSize.label.tablet);
215
+ }
216
+
217
+ @media screen and (min-width: theme(digitv2.screens.mobile)) {
218
+ font-size: theme(digitv2.fontSize.label.mobile);
219
+ }
220
+ }
221
+
222
+ &.text-link {
223
+ font-family: theme(digitv2.fontFamily.sans);
224
+ font-style: theme(digitv2.fontStyle.normal);
225
+ font-weight: theme(digitv2.fontWeight.regular);
226
+ color: theme(digitv2.lightTheme.text-primary);
227
+ line-height: theme(digitv2.lineHeight.normal);
228
+ text-decoration: theme(digitv2.textDecorationLine.underline);
229
+
230
+ @media screen and (min-width: theme(digitv2.screens.desktop)) {
231
+ font-size: theme(digitv2.fontSize.link.desktop);
232
+ }
233
+
234
+ @media screen and (min-width: theme(digitv2.screens.tablet)) {
235
+ font-size: theme(digitv2.fontSize.link.tablet);
236
+ }
237
+
238
+ @media screen and (min-width: theme(digitv2.screens.mobile)) {
239
+ font-size: theme(digitv2.fontSize.link.mobile);
240
+ }
241
+ }
242
+
243
+
244
+ &.heading-xl {
245
+ font-family: theme(digitv2.fontFamily.rc);
246
+ font-style: theme(digitv2.fontStyle.normal);
247
+ font-weight: theme(digitv2.fontWeight.bold);
248
+ line-height: theme(digitv2.lineHeight.lineheight1);
249
+
250
+ @media (max-aspect-ratio: 9/16) {
251
+ /* Media query for mobile */
252
+ font-size: theme(digitv2.fontSize.heading-xl.mobile);
253
+ }
254
+
255
+ @media (min-aspect-ratio: 9/16) and (max-aspect-ratio: 3/4) {
256
+ /* Media query for tablets */
257
+ font-size: theme(digitv2.fontSize.heading-xl.tablet);
258
+ }
259
+
260
+ @media (min-aspect-ratio: 3/4) {
261
+ /* Media query for desktop */
262
+ font-size: theme(digitv2.fontSize.heading-xl.desktop);
263
+ }
264
+ }
265
+
266
+ &.heading-l {
267
+ font-family: theme(digitv2.fontFamily.sans);
268
+ font-style: theme(digitv2.fontStyle.normal);
269
+ font-weight: theme(digitv2.fontWeight.bold);
270
+ line-height: theme(digitv2.lineHeight.lineheight1);
271
+
272
+ @media (max-aspect-ratio: 9/16) {
273
+ /* Media query for mobile */
274
+ font-size: theme(digitv2.fontSize.heading-l.mobile);
275
+ }
276
+
277
+ @media (min-aspect-ratio: 9/16) and (max-aspect-ratio: 3/4) {
278
+ /* Media query for tablets */
279
+ font-size: theme(digitv2.fontSize.heading-l.tablet);
280
+ }
281
+
282
+ @media (min-aspect-ratio: 3/4) {
283
+ /* Media query for desktop */
284
+ font-size: theme(digitv2.fontSize.heading-l.desktop);
285
+ }
286
+ }
287
+
288
+ &.heading-m {
289
+ font-family: theme(digitv2.fontFamily.sans);
290
+ font-style: theme(digitv2.fontStyle.normal);
291
+ font-weight: theme(digitv2.fontWeight.bold);
292
+ line-height: theme(digitv2.lineHeight.lineheight1);
293
+
294
+ @media (max-aspect-ratio: 9/16) {
295
+ /* Media query for mobile */
296
+ font-size: theme(digitv2.fontSize.heading-m.mobile);
297
+ }
298
+
299
+ @media (min-aspect-ratio: 9/16) and (max-aspect-ratio: 3/4) {
300
+ /* Media query for tablets */
301
+ font-size: theme(digitv2.fontSize.heading-m.tablet);
302
+ }
303
+
304
+ @media (min-aspect-ratio: 3/4) {
305
+ /* Media query for desktop */
306
+ font-size: theme(digitv2.fontSize.heading-m.desktop);
307
+ }
308
+ }
309
+
310
+ &.heading-s {
311
+ font-family: theme(digitv2.fontFamily.sans);
312
+ font-style: theme(digitv2.fontStyle.normal);
313
+ font-weight: theme(digitv2.fontWeight.bold);
314
+ line-height: theme(digitv2.lineHeight.lineheight1);
315
+
316
+ @media (max-aspect-ratio: 9/16) {
317
+ /* Media query for mobile */
318
+ font-size: theme(digitv2.fontSize.heading-s.mobile);
319
+ }
320
+
321
+ @media (min-aspect-ratio: 9/16) and (max-aspect-ratio: 3/4) {
322
+ /* Media query for tablets */
323
+ font-size: theme(digitv2.fontSize.heading-s.tablet);
324
+ }
325
+
326
+ @media (min-aspect-ratio: 3/4) {
327
+ /* Media query for desktop */
328
+ font-size: theme(digitv2.fontSize.heading-s.desktop);
329
+ }
330
+ }
331
+
332
+ &.heading-xs {
333
+ font-family: theme(digitv2.fontFamily.sans);
334
+ font-style: theme(digitv2.fontStyle.normal);
335
+ font-weight: theme(digitv2.fontWeight.bold);
336
+ line-height: theme(digitv2.lineHeight.lineheight1);
337
+
338
+ @media (max-aspect-ratio: 9/16) {
339
+ /* Media query for mobile */
340
+ font-size: theme(digitv2.fontSize.heading-xs.mobile);
341
+ }
342
+
343
+ @media (min-aspect-ratio: 9/16) and (max-aspect-ratio: 3/4) {
344
+ /* Media query for tablets */
345
+ font-size: theme(digitv2.fontSize.heading-xs.tablet);
346
+ }
347
+
348
+ @media (min-aspect-ratio: 3/4) {
349
+ /* Media query for desktop */
350
+ font-size: theme(digitv2.fontSize.heading-xs.desktop);
351
+ }
352
+ }
353
+
354
+ &.caption-l {
355
+ font-family: theme(digitv2.fontFamily.sans);
356
+ font-style: theme(digitv2.fontStyle.normal);
357
+ font-weight: theme(digitv2.fontWeight.medium);
358
+ line-height: theme(digitv2.lineHeight.lineheight1);
359
+
360
+ @media (max-aspect-ratio: 9/16) {
361
+ /* Media query for mobile */
362
+ font-size: theme(digitv2.fontSize.caption-l.mobile);
363
+ }
364
+
365
+ @media (min-aspect-ratio: 9/16) and (max-aspect-ratio: 3/4) {
366
+ /* Media query for tablets */
367
+ font-size: theme(digitv2.fontSize.caption-l.tablet);
368
+ }
369
+
370
+ @media (min-aspect-ratio: 3/4) {
371
+ /* Media query for desktop */
372
+ font-size: theme(digitv2.fontSize.caption-l.desktop);
373
+ }
374
+ }
375
+
376
+ &.caption-m {
377
+ font-family: theme(digitv2.fontFamily.sans);
378
+ font-style: theme(digitv2.fontStyle.normal);
379
+ font-weight: theme(digitv2.fontWeight.medium);
380
+ line-height: theme(digitv2.lineHeight.lineheight1);
381
+
382
+ @media (max-aspect-ratio: 9/16) {
383
+ /* Media query for mobile */
384
+ font-size: theme(digitv2.fontSize.caption-m.mobile);
385
+ }
386
+
387
+ @media (min-aspect-ratio: 9/16) and (max-aspect-ratio: 3/4) {
388
+ /* Media query for tablets */
389
+ font-size: theme(digitv2.fontSize.caption-m.tablet);
390
+
391
+ }
392
+
393
+ @media (min-aspect-ratio: 3/4){
394
+ /* Media query for desktop */
395
+ font-size: theme(digitv2.fontSize.caption-m.desktop);
396
+ }
397
+
398
+ }
399
+
400
+ &.caption-s {
401
+ font-family: theme(digitv2.fontFamily.sans);
402
+ font-style: theme(digitv2.fontStyle.normal);
403
+ font-weight: theme(digitv2.fontWeight.medium);
404
+ line-height: theme(digitv2.lineHeight.lineheight1);
405
+
406
+ @media (max-aspect-ratio: 9/16) {
407
+ /* Media query for mobile */
408
+ font-size: theme(digitv2.fontSize.caption-s.mobile);
409
+ }
410
+
411
+ @media (min-aspect-ratio: 9/16) and (max-aspect-ratio: 3/4) {
412
+ /* Media query for tablets */
413
+ font-size: theme(digitv2.fontSize.caption-s.tablet);
414
+ }
415
+
416
+ @media (min-aspect-ratio: 3/4){
417
+ /* Media query for desktop */
418
+ font-size: theme(digitv2.fontSize.caption-s.desktop);
419
+ }
420
+
421
+ }
422
+
423
+ &.body-l {
424
+ font-family: theme(digitv2.fontFamily.sans);
425
+ font-style: theme(digitv2.fontStyle.normal);
426
+ font-weight: theme(digitv2.fontWeight.regular);
427
+ line-height: theme(digitv2.lineHeight.lineheight2);
428
+
429
+ @media (max-aspect-ratio: 9/16) {
430
+ /* Media query for mobile */
431
+ font-size: theme(digitv2.fontSize.body-l.mobile);
432
+ }
433
+
434
+ @media (min-aspect-ratio: 9/16) and (max-aspect-ratio: 3/4) {
435
+ /* Media query for tablets */
436
+ font-size: theme(digitv2.fontSize.body-l.tablet);
437
+ }
438
+
439
+ @media (min-aspect-ratio: 3/4) {
440
+ /* Media query for desktop */
441
+ font-size: theme(digitv2.fontSize.body-l.desktop);
442
+ }
443
+ }
444
+
445
+ &.body-s {
446
+ font-family: theme(digitv2.fontFamily.sans);
447
+ font-style: theme(digitv2.fontStyle.normal);
448
+ font-weight: theme(digitv2.fontWeight.regular);
449
+ line-height: theme(digitv2.lineHeight.lineheight2);
450
+
451
+ @media (max-aspect-ratio: 9/16) {
452
+ /* Media query for mobile */
453
+ font-size: theme(digitv2.fontSize.body-s.mobile);
454
+ }
455
+
456
+ @media (min-aspect-ratio: 9/16) and (max-aspect-ratio: 3/4) {
457
+ /* Media query for tablets */
458
+ font-size: theme(digitv2.fontSize.body-s.tablet);
459
+ }
460
+
461
+ @media (min-aspect-ratio: 3/4) {
462
+ /* Media query for desktop */
463
+ font-size: theme(digitv2.fontSize.body-s.desktop);
464
+ }
465
+ }
466
+
467
+ &.body-xs {
468
+ font-family: theme(digitv2.fontFamily.sans);
469
+ font-style: theme(digitv2.fontStyle.normal);
470
+ font-weight: theme(digitv2.fontWeight.regular);
471
+ line-height: theme(digitv2.lineHeight.lineheight2);
472
+
473
+ @media (max-aspect-ratio: 9/16) {
474
+ /* Media query for mobile */
475
+ font-size: theme(digitv2.fontSize.body-xs.mobile);
476
+ }
477
+
478
+ @media (min-aspect-ratio: 9/16) and (max-aspect-ratio: 3/4) {
479
+ /* Media query for tablets */
480
+ font-size: theme(digitv2.fontSize.body-xs.tablet);
481
+ }
482
+
483
+ @media (min-aspect-ratio: 3/4) {
484
+ /* Media query for desktop */
485
+ font-size: theme(digitv2.fontSize.body-xs.desktop);
486
+ }
487
+ }
488
+
489
+ &.label {
490
+ font-family: theme(digitv2.fontFamily.sans);
491
+ font-style: theme(digitv2.fontStyle.normal);
492
+ font-weight: theme(digitv2.fontWeight.regular);
493
+ line-height: theme(digitv2.lineHeight.lineheight2);
494
+
495
+ @media (max-aspect-ratio: 9/16) {
496
+ /* Media query for mobile */
497
+ font-size: theme(digitv2.fontSize.label.mobile);
498
+ }
499
+
500
+ @media (min-aspect-ratio: 9/16) and (max-aspect-ratio: 3/4) {
501
+ /* Media query for tablets */
502
+ font-size: theme(digitv2.fontSize.label.tablet);
503
+ }
504
+
505
+ @media (min-aspect-ratio: 3/4) {
506
+ /* Media query for desktop */
507
+ font-size: theme(digitv2.fontSize.label.desktop);
508
+ }
509
+ }
510
+
511
+ &.link {
512
+ font-family: theme(digitv2.fontFamily.sans);
513
+ font-style: theme(digitv2.fontStyle.normal);
514
+ font-weight: theme(digitv2.fontWeight.regular);
515
+ text-decoration: theme(digitv2.textDecorationLine.underline);
516
+ font-size: theme(digitv2.fontSize.link-l.mobile);
517
+ }
518
+
519
+ &.link-L {
520
+ @media (max-aspect-ratio: 9/16) {
521
+ /* Media query for mobile */
522
+ font-family: theme(digitv2.fontFamily.sans);
523
+ font-size: theme(digitv2.fontSize.link-l.mobile);
524
+ font-weight: theme(digitv2.fontWeight.regular);
525
+ line-height: theme(digitv2.lineHeight.lineheight2);
526
+ text-decoration: theme(digitv2.textDecorationLine.underline);
527
+ text-decoration-thickness: 0.063rem;
528
+ }
529
+
530
+ @media (min-aspect-ratio: 9/16) and (max-aspect-ratio: 3/4){
531
+ /* Media query for tablets */
532
+ font-family: theme(digitv2.fontFamily.sans);
533
+ font-size: theme(digitv2.fontSize.link-l.tablet);
534
+ font-weight: theme(digitv2.fontWeight.regular);
535
+ line-height: theme(digitv2.lineHeight.lineheight2);
536
+ text-decoration: theme(digitv2.textDecorationLine.underline);
537
+ text-decoration-thickness: 0.063rem;
538
+ }
539
+
540
+ @media (min-aspect-ratio: 3/4) {
541
+ /* Media query for desktop */
542
+ font-family: theme(digitv2.fontFamily.sans);
543
+ font-size: theme(digitv2.fontSize.link-l.desktop);
544
+ font-weight: theme(digitv2.fontWeight.regular);
545
+ line-height: theme(digitv2.lineHeight.lineheight2);
546
+ text-decoration: theme(digitv2.textDecorationLine.underline);
547
+ text-decoration-thickness: 0.063rem;
548
+ }
549
+ }
550
+
551
+ &.link-S {
552
+ @media (max-aspect-ratio: 9/16) {
553
+ /* Media query for mobile */
554
+ font-family: theme(digitv2.fontFamily.sans);
555
+ font-size: theme(digitv2.fontSize.link-s.mobile);
556
+ font-weight: theme(digitv2.fontWeight.regular);
557
+ line-height: theme(digitv2.lineHeight.lineheight2);
558
+ text-decoration: theme(digitv2.textDecorationLine.underline);
559
+ text-decoration-thickness: 0.063rem;
560
+ }
561
+
562
+ @media (min-aspect-ratio: 9/16) and (max-aspect-ratio: 3/4) {
563
+ /* Media query for tablets */
564
+ font-family: theme(digitv2.fontFamily.sans);
565
+ font-size: theme(digitv2.fontSize.link-s.tablet);
566
+ font-weight: theme(digitv2.fontWeight.regular);
567
+ line-height: theme(digitv2.lineHeight.lineheight2);
568
+ text-decoration: theme(digitv2.textDecorationLine.underline);
569
+ text-decoration-thickness: 0.063rem;
570
+ }
571
+
572
+
573
+ @media (min-aspect-ratio: 3/4){
574
+ /* Media query for desktop */
575
+ font-family: theme(digitv2.fontFamily.sans);
576
+ font-size: theme(digitv2.fontSize.link-s.desktop);
577
+ font-weight: theme(digitv2.fontWeight.regular);
578
+ line-height: theme(digitv2.lineHeight.lineheight2);
579
+ text-decoration: theme(digitv2.textDecorationLine.underline);
580
+ text-decoration-thickness: 0.063rem;
581
+ }
582
+ }
583
+
584
+ &.link-XS {
585
+ @media (max-aspect-ratio: 9/16) {
586
+ /* Media query for mobile */
587
+ font-family: theme(digitv2.fontFamily.sans);
588
+ font-size: theme(digitv2.fontSize.link-xs.mobile);
589
+ font-weight: theme(digitv2.fontWeight.regular);
590
+ line-height: theme(digitv2.lineHeight.lineheight2);
591
+ text-decoration: theme(digitv2.textDecorationLine.underline);
592
+ text-decoration-thickness: 0.063rem;
593
+ }
594
+
595
+ @media (min-aspect-ratio: 9/16) and (max-aspect-ratio: 3/4) {
596
+ /* Media query for tablets */
597
+ font-family: theme(digitv2.fontFamily.sans);
598
+ font-size: theme(digitv2.fontSize.link-xs.tablet);
599
+ font-weight: theme(digitv2.fontWeight.regular);
600
+ line-height: theme(digitv2.lineHeight.lineheight2);
601
+ text-decoration: theme(digitv2.textDecorationLine.underline);
602
+ text-decoration-thickness: 0.063rem;
603
+ }
604
+
605
+ @media (min-aspect-ratio: 3/4) {
606
+ /* Media query for desktop */
607
+ font-family: theme(digitv2.fontFamily.sans);
608
+ font-size: theme(digitv2.fontSize.link-xs.desktop);
609
+ font-weight: theme(digitv2.fontWeight.regular);
610
+ line-height: theme(digitv2.lineHeight.lineheight2);
611
+ text-decoration: theme(digitv2.textDecorationLine.underline);
612
+ text-decoration-thickness: 0.063rem;
613
+ }
614
+ }
615
+
616
+ &.button {
617
+
618
+ &.large {
619
+ font-size: theme(digitv2.fontSize.button.large);
620
+ line-height: theme(digitv2.lineHeight.lineheight1);
621
+ font-family: theme(digitv2.fontFamily.sans);
622
+ font-weight: theme(digitv2.fontWeight.medium);
623
+ }
624
+
625
+ &.medium {
626
+ font-size: theme(digitv2.fontSize.button.medium);
627
+ line-height: theme(digitv2.lineHeight.lineheight1);
628
+ font-family: theme(digitv2.fontFamily.sans);
629
+ font-weight: theme(digitv2.fontWeight.medium);
630
+ }
631
+
632
+ &.small {
633
+ font-size: theme(digitv2.fontSize.button.small);
634
+ line-height: theme(digitv2.lineHeight.lineheight1);
635
+ font-family: theme(digitv2.fontFamily.sans);
636
+ font-weight: theme(digitv2.fontWeight.medium);
637
+ }
638
+ }
658
639
  }