testio-tailwind 0.1.0 → 0.2.1

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 (380) hide show
  1. package/.circleci/config.yml +217 -0
  2. package/.dockerignore +4 -0
  3. package/.eleventy.js +57 -57
  4. package/Dockerfile +27 -0
  5. package/LICENSE +21 -21
  6. package/README.md +43 -43
  7. package/icon-classes-extractor.js +29 -29
  8. package/index.html +399 -478
  9. package/package.json +66 -66
  10. package/src/_data/navigation.json +44 -44
  11. package/src/_data/site.js +12 -12
  12. package/src/_includes/card_popover.haml +7 -7
  13. package/src/_includes/example-header-customer.pug +99 -99
  14. package/src/_includes/example-header-manager.njk +53 -53
  15. package/src/_includes/example-header-tester.njk +99 -99
  16. package/src/_includes/example-header.njk +50 -50
  17. package/src/_includes/page-with-sidebar-nocode.njk +46 -46
  18. package/src/_includes/page-with-sidebar.njk +46 -46
  19. package/src/_includes/page.njk +38 -38
  20. package/src/_layouts/base.njk +83 -83
  21. package/src/_layouts/email-template.njk +90 -90
  22. package/src/_layouts/page-example-customer.njk +74 -74
  23. package/src/_layouts/page-example-manager.njk +74 -74
  24. package/src/_layouts/page-example-tester.njk +75 -75
  25. package/src/_layouts/page-example.njk +83 -83
  26. package/src/assets/images/Cirro-App-Defaultimage.svg +25 -25
  27. package/src/assets/images/arrow-down.svg +13 -13
  28. package/src/assets/images/arrow-left.svg +13 -13
  29. package/src/assets/images/arrow-right.svg +13 -13
  30. package/src/assets/images/arrow-thick-left.svg +13 -13
  31. package/src/assets/images/arrow-thick-right.svg +13 -13
  32. package/src/assets/images/arrow-up.svg +13 -13
  33. package/src/assets/images/at-sign.svg +12 -12
  34. package/src/assets/images/attachment-fallbackimage.svg +19 -19
  35. package/src/assets/images/attachment.svg +8 -8
  36. package/src/assets/images/bell-smile-xl.svg +18 -18
  37. package/src/assets/images/blocked.svg +7 -7
  38. package/src/assets/images/bug-chat-xl.svg +15 -15
  39. package/src/assets/images/bug-deceased-xl.svg +15 -15
  40. package/src/assets/images/bug-reproduction.svg +14 -14
  41. package/src/assets/images/bug-sad-xl.svg +13 -13
  42. package/src/assets/images/bug-search-xl.svg +18 -18
  43. package/src/assets/images/bug-sleeping-xl.svg +14 -14
  44. package/src/assets/images/bug-smile-xl.svg +9 -9
  45. package/src/assets/images/calendar.svg +15 -15
  46. package/src/assets/images/caret-down-centered.svg +6 -6
  47. package/src/assets/images/caret-down.svg +11 -11
  48. package/src/assets/images/caret-left-centered.svg +6 -6
  49. package/src/assets/images/caret-left.svg +6 -6
  50. package/src/assets/images/caret-right-centered.svg +6 -6
  51. package/src/assets/images/caret-right.svg +6 -6
  52. package/src/assets/images/caret-up-centered.svg +6 -6
  53. package/src/assets/images/caret-up.svg +11 -11
  54. package/src/assets/images/check-circle-filled-white.svg +9 -9
  55. package/src/assets/images/check-circle-filled.svg +12 -12
  56. package/src/assets/images/check-circle.svg +7 -7
  57. package/src/assets/images/check-selectable-items.svg +11 -11
  58. package/src/assets/images/check-thick-outline.svg +11 -11
  59. package/src/assets/images/check-thick.svg +6 -6
  60. package/src/assets/images/check.svg +17 -17
  61. package/src/assets/images/checkbox-background-black.svg +6 -6
  62. package/src/assets/images/checkbox-background-sm.svg +12 -12
  63. package/src/assets/images/checkbox-background-white.svg +6 -6
  64. package/src/assets/images/checkbox-background.svg +6 -6
  65. package/src/assets/images/checkbox-sm-checked.svg +11 -11
  66. package/src/assets/images/circle-empty-white.svg +6 -6
  67. package/src/assets/images/circle-sm-filled.svg +6 -6
  68. package/src/assets/images/clock.svg +12 -12
  69. package/src/assets/images/cross-circle-filled.svg +6 -6
  70. package/src/assets/images/cross-circle.svg +7 -7
  71. package/src/assets/images/cross-thick.svg +15 -15
  72. package/src/assets/images/cross.svg +7 -7
  73. package/src/assets/images/exclamation-circle-filled.svg +11 -11
  74. package/src/assets/images/exclamation-circle.svg +12 -12
  75. package/src/assets/images/feature-check.svg +9 -9
  76. package/src/assets/images/feature-cross.svg +10 -10
  77. package/src/assets/images/feature-draft.svg +14 -14
  78. package/src/assets/images/feature.svg +8 -8
  79. package/src/assets/images/file-image-plus-lg.svg +19 -19
  80. package/src/assets/images/file-image-plus-xl.svg +20 -20
  81. package/src/assets/images/format-bold.svg +11 -11
  82. package/src/assets/images/format-code.svg +12 -12
  83. package/src/assets/images/format-heading.svg +11 -11
  84. package/src/assets/images/format-indent-decrease.svg +11 -11
  85. package/src/assets/images/format-indent-increase.svg +11 -11
  86. package/src/assets/images/format-italic.svg +11 -11
  87. package/src/assets/images/format-link.svg +11 -11
  88. package/src/assets/images/format-list-bulleted.svg +17 -17
  89. package/src/assets/images/format-list-numbered.svg +17 -17
  90. package/src/assets/images/format-mark.svg +13 -13
  91. package/src/assets/images/format-quote.svg +17 -17
  92. package/src/assets/images/format-strikethrough.svg +11 -11
  93. package/src/assets/images/forward.svg +11 -11
  94. package/src/assets/images/google_signin.svg +22 -22
  95. package/src/assets/images/info-circle-cirro.svg +21 -21
  96. package/src/assets/images/info-circle-ux.svg +21 -21
  97. package/src/assets/images/lock.svg +15 -15
  98. package/src/assets/images/logo-mobile-cloud.svg +12 -12
  99. package/src/assets/images/logo-testio/testio_horizontal_black.svg +14 -14
  100. package/src/assets/images/logo-testio/testio_horizontal_icon_black.svg +25 -25
  101. package/src/assets/images/logo-testio/testio_horizontal_icon_purple_black.svg +27 -27
  102. package/src/assets/images/logo-testio/testio_horizontal_icon_purple_white.svg +25 -25
  103. package/src/assets/images/logo-testio/testio_horizontal_icon_white.svg +25 -25
  104. package/src/assets/images/logo-testio/testio_horizontal_purple_black.svg +9 -9
  105. package/src/assets/images/logo-testio/testio_horizontal_purple_white.svg +14 -14
  106. package/src/assets/images/logo-testio/testio_horizontal_purpleteal_black.svg +21 -21
  107. package/src/assets/images/logo-testio/testio_horizontal_purpleteal_white.svg +19 -19
  108. package/src/assets/images/logo-testio/testio_horizontal_teal_black.svg +14 -14
  109. package/src/assets/images/logo-testio/testio_horizontal_teal_white.svg +14 -14
  110. package/src/assets/images/logo-testio/testio_horizontal_tealpurple_black.svg +21 -21
  111. package/src/assets/images/logo-testio/testio_horizontal_tealpurple_white.svg +21 -21
  112. package/src/assets/images/logo-testio/testio_horizontal_white.svg +14 -14
  113. package/src/assets/images/logo-testio/testio_symbol_black_round.svg +11 -11
  114. package/src/assets/images/logo-testio/testio_symbol_purple.svg +15 -15
  115. package/src/assets/images/logo-testio/testio_symbol_purpleteal_round.svg +18 -18
  116. package/src/assets/images/logo-testio/testio_symbol_purpleteal_square.svg +18 -18
  117. package/src/assets/images/logo-testio/testio_symbol_teal.svg +15 -15
  118. package/src/assets/images/logo-testio/testio_symbol_tealpurple_round.svg +18 -18
  119. package/src/assets/images/logo-testio/testio_symbol_tealpurple_square.svg +18 -18
  120. package/src/assets/images/logo-testio/testio_symbol_white_round.svg +11 -11
  121. package/src/assets/images/logo-testio/testio_typo_black.svg +11 -11
  122. package/src/assets/images/logo-testio/testio_typo_white.svg +11 -11
  123. package/src/assets/images/logo-testio/testio_vertical_purpleteal_black.svg +19 -19
  124. package/src/assets/images/logo-testio/testio_vertical_purpleteal_white.svg +19 -19
  125. package/src/assets/images/logo-testio/testio_vertical_tealpurple_black.svg +19 -19
  126. package/src/assets/images/logo-testio/testio_vertical_tealpurple_white.svg +19 -19
  127. package/src/assets/images/message-feedback.svg +10 -10
  128. package/src/assets/images/message-question-filled.svg +6 -6
  129. package/src/assets/images/message-question.svg +8 -8
  130. package/src/assets/images/message.svg +11 -11
  131. package/src/assets/images/question-circle.svg +24 -24
  132. package/src/assets/images/radio-checked-black.svg +5 -5
  133. package/src/assets/images/redo.svg +7 -7
  134. package/src/assets/images/remove.svg +6 -6
  135. package/src/assets/images/search.svg +11 -11
  136. package/src/assets/images/seat.svg +14 -14
  137. package/src/assets/images/section.svg +8 -8
  138. package/src/assets/images/sendmessage.svg +15 -15
  139. package/src/assets/images/speaker.svg +10 -10
  140. package/src/assets/images/test-archived.svg +12 -12
  141. package/src/assets/images/test-automation.svg +8 -8
  142. package/src/assets/images/test-check.svg +9 -9
  143. package/src/assets/images/test-ended.svg +9 -9
  144. package/src/assets/images/test-failed.svg +10 -10
  145. package/src/assets/images/test-initialized.svg +10 -10
  146. package/src/assets/images/test-locked.svg +15 -15
  147. package/src/assets/images/test-plus.svg +11 -11
  148. package/src/assets/images/test-promoted.svg +9 -9
  149. package/src/assets/images/test-running.svg +9 -9
  150. package/src/assets/images/test-stopped.svg +17 -17
  151. package/src/assets/images/test.svg +8 -8
  152. package/src/assets/images/testcase.svg +10 -10
  153. package/src/assets/images/triangle-centered-down.svg +12 -12
  154. package/src/assets/images/triangle-centered-left.svg +12 -12
  155. package/src/assets/images/triangle-centered-right.svg +12 -12
  156. package/src/assets/images/triangle-centered-up.svg +12 -12
  157. package/src/assets/images/triangle-down.svg +5 -5
  158. package/src/assets/images/triangle-up.svg +5 -5
  159. package/src/assets/images/undo.svg +7 -7
  160. package/src/assets/images/verify-exclamation.svg +11 -11
  161. package/src/assets/scripts/app.js +150 -150
  162. package/src/assets/scripts/modules/colors.js +10 -10
  163. package/src/assets/scripts/modules/echarts_area.js +94 -94
  164. package/src/assets/scripts/modules/echarts_donut.js +85 -85
  165. package/src/assets/scripts/modules/echarts_exampledata.js +105 -105
  166. package/src/assets/scripts/modules/echarts_exampleseries.js +146 -146
  167. package/src/assets/scripts/modules/echarts_gauge.js +74 -74
  168. package/src/assets/scripts/modules/echarts_horizontal.js +80 -80
  169. package/src/assets/scripts/modules/echarts_legend.js +12 -12
  170. package/src/assets/scripts/modules/echarts_vertical.js +80 -80
  171. package/src/assets/stylesheets/app.css +77 -76
  172. package/src/assets/stylesheets/components/actionbar.css +41 -41
  173. package/src/assets/stylesheets/components/alerts.css +50 -50
  174. package/src/assets/stylesheets/components/banner_card.css +56 -56
  175. package/src/assets/stylesheets/components/buttons.css +192 -192
  176. package/src/assets/stylesheets/components/cards.css +148 -148
  177. package/src/assets/stylesheets/components/chat.css +265 -265
  178. package/src/assets/stylesheets/components/checkboxes_radiobuttons.css +173 -173
  179. package/src/assets/stylesheets/components/customer/customer_header.css +97 -97
  180. package/src/assets/stylesheets/components/customer/customer_productcards.css +212 -212
  181. package/src/assets/stylesheets/components/customer/customer_sidebar.css +76 -76
  182. package/src/assets/stylesheets/components/devices.css +77 -83
  183. package/src/assets/stylesheets/components/drawer.css +99 -99
  184. package/src/assets/stylesheets/components/dropdown.css +92 -92
  185. package/src/assets/stylesheets/components/emptystate_message.css +41 -41
  186. package/src/assets/stylesheets/components/form_card.css +20 -20
  187. package/src/assets/stylesheets/components/form_grid.css +11 -11
  188. package/src/assets/stylesheets/components/forms.css +106 -106
  189. package/src/assets/stylesheets/components/header.css +220 -220
  190. package/src/assets/stylesheets/components/iconfont.css +3303 -3303
  191. package/src/assets/stylesheets/components/icons.css +142 -142
  192. package/src/assets/stylesheets/components/images.css +27 -27
  193. package/src/assets/stylesheets/components/layout.css +37 -82
  194. package/src/assets/stylesheets/components/list_item.css +285 -281
  195. package/src/assets/stylesheets/components/lists.css +67 -67
  196. package/src/assets/stylesheets/components/loading_spinner.css +104 -104
  197. package/src/assets/stylesheets/components/manager/manager_header.css +50 -50
  198. package/src/assets/stylesheets/components/manager/manager_sidebar.css +76 -76
  199. package/src/assets/stylesheets/components/markdown_trix_styles.css +200 -200
  200. package/src/assets/stylesheets/components/metasidebar.css +56 -56
  201. package/src/assets/stylesheets/components/metrics.css +12 -12
  202. package/src/assets/stylesheets/components/modals.css +105 -105
  203. package/src/assets/stylesheets/components/notifications.css +154 -154
  204. package/src/assets/stylesheets/components/popover.css +120 -120
  205. package/src/assets/stylesheets/components/progress.css +69 -69
  206. package/src/assets/stylesheets/components/radio_tabs.css +59 -59
  207. package/src/assets/stylesheets/components/reset.css +26 -26
  208. package/src/assets/stylesheets/components/resultmodule.css +132 -132
  209. package/src/assets/stylesheets/components/search.css +110 -110
  210. package/src/assets/stylesheets/components/sections.css +97 -97
  211. package/src/assets/stylesheets/components/select.css +50 -50
  212. package/src/assets/stylesheets/components/select2.css +252 -252
  213. package/src/assets/stylesheets/components/selectable_token.css +223 -223
  214. package/src/assets/stylesheets/components/sidebar.css +480 -480
  215. package/src/assets/stylesheets/components/splitview.css +307 -304
  216. package/src/assets/stylesheets/components/tables.css +108 -108
  217. package/src/assets/stylesheets/components/tabs.css +121 -121
  218. package/src/assets/stylesheets/components/tags.css +28 -28
  219. package/src/assets/stylesheets/components/task_issue_item.css +78 -78
  220. package/src/assets/stylesheets/components/test_header.css +167 -0
  221. package/src/assets/stylesheets/components/test_item.css +89 -89
  222. package/src/assets/stylesheets/components/tester/tester_cards.css +143 -143
  223. package/src/assets/stylesheets/components/tester/tester_header.css +37 -37
  224. package/src/assets/stylesheets/components/tester/tester_sidebar.css +92 -92
  225. package/src/assets/stylesheets/components/toggleswitch.css +118 -118
  226. package/src/assets/stylesheets/components/tom_select.css +186 -186
  227. package/src/assets/stylesheets/components/trix_editor.css +174 -174
  228. package/src/assets/stylesheets/components/typography.css +81 -81
  229. package/src/assets/stylesheets/components/uploads.css +194 -194
  230. package/src/assets/stylesheets/components/user_item.css +57 -57
  231. package/src/assets/stylesheets/designsystem-styles.css +81 -81
  232. package/src/assets/stylesheets/postcss.config.js +16 -16
  233. package/src/assets/stylesheets/tailwind.config.js +331 -331
  234. package/src/humans.txt.njk +10 -10
  235. package/src/index.pug +16 -16
  236. package/src/pages/buttons/block.haml +39 -39
  237. package/src/pages/buttons/buttons-lg.haml +20 -20
  238. package/src/pages/buttons/buttons-sm.haml +41 -41
  239. package/src/pages/buttons/buttons-xl.haml +23 -23
  240. package/src/pages/buttons/buttons.haml +58 -58
  241. package/src/pages/buttons/buttons_input.haml +39 -39
  242. package/src/pages/buttons/dropdown-menu.haml +73 -73
  243. package/src/pages/buttons/index.njk +7 -7
  244. package/src/pages/buttons/info_popover.haml +32 -32
  245. package/src/pages/buttons/link-with-icon.haml +13 -13
  246. package/src/pages/buttons/square-buttons.haml +55 -55
  247. package/src/pages/charts/area.haml +215 -215
  248. package/src/pages/charts/bar_horizontal.haml +335 -335
  249. package/src/pages/charts/bar_vertical.haml +391 -391
  250. package/src/pages/charts/donut.haml +269 -269
  251. package/src/pages/charts/gauge.haml +214 -214
  252. package/src/pages/charts/index.njk +6 -6
  253. package/src/pages/ci.pug +8 -8
  254. package/src/pages/colors.pug +147 -147
  255. package/src/pages/components/alerts.haml +31 -31
  256. package/src/pages/components/banner_cards.haml +45 -45
  257. package/src/pages/components/cards.haml +111 -111
  258. package/src/pages/components/cards_customer.haml +487 -487
  259. package/src/pages/components/cards_fixedwidth.haml +135 -135
  260. package/src/pages/components/cards_iconheader.haml +57 -57
  261. package/src/pages/components/cards_tester.haml +159 -159
  262. package/src/pages/components/chat_window.haml +240 -240
  263. package/src/pages/components/comments_bug_preview.haml +29 -29
  264. package/src/pages/components/comments_chatmessages.haml +229 -229
  265. package/src/pages/components/descriptionlist.haml +47 -47
  266. package/src/pages/components/devices.haml +115 -115
  267. package/src/pages/components/drawer.haml +49 -49
  268. package/src/pages/components/drawer_filter.haml +76 -76
  269. package/src/pages/components/emptystate.haml +15 -15
  270. package/src/pages/components/index.njk +6 -6
  271. package/src/pages/components/issue-item.haml +18 -18
  272. package/src/pages/components/listitem_with_footer.haml +208 -208
  273. package/src/pages/components/listitems.haml +136 -136
  274. package/src/pages/components/listitems_badge.haml +36 -36
  275. package/src/pages/components/listitems_collapsable.haml +117 -117
  276. package/src/pages/components/listitems_nested.haml +50 -50
  277. package/src/pages/components/listitems_selectable.haml +59 -59
  278. package/src/pages/components/listitems_white.haml +82 -82
  279. package/src/pages/components/loading_spinner.haml +11 -11
  280. package/src/pages/components/metasidebar.haml +13 -13
  281. package/src/pages/components/modal_details.haml +68 -68
  282. package/src/pages/components/notification_center.haml +48 -48
  283. package/src/pages/components/notifications.haml +42 -42
  284. package/src/pages/components/profilethumb.haml +27 -27
  285. package/src/pages/components/progress.haml +23 -23
  286. package/src/pages/components/resultmodule.haml +150 -150
  287. package/src/pages/components/resultmodule_testcase.haml +125 -125
  288. package/src/pages/components/section_collapsable.haml +24 -24
  289. package/src/pages/components/splitview_item.haml +111 -111
  290. package/src/pages/components/splitview_item_collapsable.haml +65 -65
  291. package/src/pages/components/tables.haml +57 -57
  292. package/src/pages/components/tables_linked.haml +29 -29
  293. package/src/pages/components/tags.haml +12 -12
  294. package/src/pages/components/task_item.haml +33 -33
  295. package/src/pages/components/test_item.haml +119 -119
  296. package/src/pages/components/tester_levels.haml +70 -70
  297. package/src/pages/components/user_item.haml +49 -49
  298. package/src/pages/examples/layout-actionbar.haml +267 -267
  299. package/src/pages/examples/layout-basic.haml +28 -28
  300. package/src/pages/examples/layout-chat.haml +327 -327
  301. package/src/pages/examples/layout-customer.haml +189 -189
  302. package/src/pages/examples/layout-form-sidebar-actionbar-metasidebar.haml +312 -312
  303. package/src/pages/examples/layout-manager.haml +98 -98
  304. package/src/pages/examples/layout-metasidebar.haml +269 -269
  305. package/src/pages/examples/layout-sidebar-actionbar-metasidebar.haml +308 -308
  306. package/src/pages/examples/layout-sidebar-actionbar.haml +308 -308
  307. package/src/pages/examples/layout-sidebar.haml +296 -296
  308. package/src/pages/examples/layout-tester.haml +105 -105
  309. package/src/pages/examples/splitview-testcases.haml +477 -477
  310. package/src/pages/examples/splitview.haml +389 -389
  311. package/src/pages/forms/checkboxes.haml +64 -64
  312. package/src/pages/forms/checkboxes_devices.haml +45 -45
  313. package/src/pages/forms/form-addon.haml +16 -16
  314. package/src/pages/forms/form-card.haml +36 -36
  315. package/src/pages/forms/form-grid.haml +16 -16
  316. package/src/pages/forms/form_grid_narrow.haml +18 -18
  317. package/src/pages/forms/forms.haml +22 -22
  318. package/src/pages/forms/index.njk +6 -6
  319. package/src/pages/forms/radiobuttons.haml +50 -50
  320. package/src/pages/forms/rating_scale.haml +62 -62
  321. package/src/pages/forms/search.haml +71 -71
  322. package/src/pages/forms/select2.haml +72 -72
  323. package/src/pages/forms/select_native.haml +74 -74
  324. package/src/pages/forms/selectable_token.haml +49 -49
  325. package/src/pages/forms/selectable_token_browsers.haml +66 -66
  326. package/src/pages/forms/selectable_token_lg.haml +49 -49
  327. package/src/pages/forms/selectable_token_xl.haml +49 -49
  328. package/src/pages/forms/textarea.haml +24 -24
  329. package/src/pages/forms/toggle-buttons.haml +94 -94
  330. package/src/pages/forms/toggle-switch.haml +31 -31
  331. package/src/pages/forms/tomselect.haml +76 -76
  332. package/src/pages/forms/trix_editor.pug +10 -10
  333. package/src/pages/forms/uploads.pug +101 -101
  334. package/src/pages/icons/bug-icons.haml +75 -75
  335. package/src/pages/icons/index.njk +83 -83
  336. package/src/pages/icons/marketingicons.haml +15 -15
  337. package/src/pages/icons/status-icons.haml +38 -38
  338. package/src/pages/layout/app_layout.haml +27 -27
  339. package/src/pages/layout/index.njk +6 -6
  340. package/src/pages/layout/max_width.haml +49 -49
  341. package/src/pages/layout/spacing.haml +30 -30
  342. package/src/pages/navigation/header-manager.haml +73 -73
  343. package/src/pages/navigation/header-tester.haml +100 -100
  344. package/src/pages/navigation/header.haml +76 -76
  345. package/src/pages/navigation/header_customer.haml +77 -77
  346. package/src/pages/navigation/header_tester_epam.haml +108 -108
  347. package/src/pages/navigation/index.njk +7 -7
  348. package/src/pages/navigation/product_dropdown.haml +65 -65
  349. package/src/pages/navigation/radio_tabs.haml +22 -22
  350. package/src/pages/navigation/sidebar-manager.haml +46 -46
  351. package/src/pages/navigation/sidebar-tester-elements.haml +105 -105
  352. package/src/pages/navigation/sidebar-tester-seatlimitation.haml +108 -108
  353. package/src/pages/navigation/sidebar-tester.haml +75 -75
  354. package/src/pages/navigation/sidebar.haml +46 -46
  355. package/src/pages/navigation/sidebar_collapsables.haml +136 -136
  356. package/src/pages/navigation/sidebar_customer.haml +146 -146
  357. package/src/pages/navigation/tabnavigation.haml +12 -12
  358. package/src/pages/navigation/tabnavigation_actions.haml +21 -21
  359. package/src/pages/navigation/tabnavigation_pills.haml +12 -12
  360. package/src/pages/navigation/test-header-tester.haml +178 -0
  361. package/src/pages/typography/index.njk +7 -7
  362. package/src/pages/typography/link_with_icon.haml +12 -12
  363. package/src/pages/typography/linked_icon.haml +10 -10
  364. package/src/pages/typography/markdown.md +112 -112
  365. package/src/pages/typography/section_header.haml +25 -25
  366. package/src/pages/typography/section_header_actions.haml +59 -59
  367. package/src/pages/typography/text_with_icon.haml +12 -12
  368. package/src/pages/typography/trix_styles.haml +127 -127
  369. package/src/pages/typography/typography.haml +51 -51
  370. package/src/sitemap.xml.njk +13 -13
  371. package/src/static/app.compiled.css +536 -208
  372. package/src/static/app.compiled.css.map +1 -1
  373. package/src/static/browserconfig.xml +9 -9
  374. package/src/static/site.webmanifest +3 -3
  375. package/utils/collections.js +29 -29
  376. package/utils/filters.js +11 -11
  377. package/utils/markdown.js +9 -9
  378. package/utils/shortcodes.js +6 -6
  379. package/utils/transforms.js +19 -19
  380. package/webpack.config.js +24 -24
package/index.html CHANGED
@@ -1,478 +1,399 @@
1
-
2
- <!DOCTYPE html>
3
- <html lang="en">
4
- <head>
5
- <!--
6
- Maintained with the excellent knowledge from https://htmlhead.dev
7
- These comments will be removed in production
8
-
9
- ========================
10
-
11
- The following 2 meta tags *must* come first in the <head>
12
- to consistently ensure proper document rendering.
13
- Any other head element should come *after* these tags.
14
- -->
15
- <meta charset="utf-8">
16
- <meta name="viewport" content="width=device-width, initial-scale=1">
17
-
18
- <!-- Set the base URL for all relative URLs within the document -->
19
- <base href="/">
20
-
21
- <!--
22
- Short description of the document (limit to 150 characters)
23
- This content *may* be used as a part of search engine results.
24
- -->
25
- <meta name="description" content="Fortissimo Design System">
26
-
27
- <!-- Control the behavior of search engine crawling and indexing -->
28
- <meta name="robots" content="index,follow"><!-- All Search Engines -->
29
- <meta name="googlebot" content="index,follow"><!-- Google Specific -->
30
-
31
- <!-- Tells Google not to show the sitelinks search box -->
32
- <meta name="google" content="nositelinkssearchbox">
33
- <!-- Tells Google not to provide a translation for this document -->
34
- <meta name="google" content="notranslate">
35
-
36
- <!-- Identify the software used to build the document, Eleventy ftw! -->
37
- <meta name="generator" content="eleventy">
38
-
39
- <!-- Disable automatic detection and formatting of possible phone numbers -->
40
- <meta name="format-detection" content="telephone=no">
41
-
42
- <!-- Helps prevent duplicate content issues -->
43
- <link rel="canonical" href="https://test.io/">
44
-
45
- <title>Translation space - Design System - Fortissimo Design system</title>
46
-
47
- <!-- Links to information about the author(s) of the document -->
48
- <link rel="author" href="humans.txt">
49
-
50
- <link rel="apple-touch-icon" sizes="180x180" href="/apple-touch-icon.png">
51
- <link rel="icon" type="image/png" sizes="32x32" href="/favicon-32x32.png">
52
- <link rel="icon" type="image/png" sizes="16x16" href="/favicon-16x16.png">
53
- <link rel="manifest" href="/site.webmanifest">
54
- <link rel="mask-icon" href="/safari-pinned-tab.svg" color="#5bbad5">
55
- <meta name="msapplication-TileColor" content="#000000">
56
- <meta name="theme-color" content="#ffffff">
57
-
58
- <!-- Facebook Open Graph meta -->
59
- <meta property="og:url" content="https://test.io/">
60
- <meta property="og:type" content="website">
61
- <meta property="og:title" content="Translation space - Design System">
62
-
63
- <meta property="og:description" content="Fortissimo Design System" />
64
- <meta property="og:site_name" content="Fortissimo Design system">
65
- <meta property="og:locale" content="en_US">
66
- <meta property="article:author" content="test IO">
67
-
68
- <!-- Twitter Open Graph meta -->
69
- <meta name="twitter:card" content="summary_large_image">
70
- <meta name="twitter:site" content="">
71
- <meta name="twitter:creator" content="">
72
-
73
- <!-- disallow Twitter from using your site's info for personalization purposes -->
74
- <meta name="twitter:dnt" content="on">
75
-
76
-
77
- <link rel="stylesheet" href="/static/app.compiled.css" id="cirro-space-stylesheet" title="Cirro Space Design System">
78
- <script src="https://cdnjs.cloudflare.com/ajax/libs/js-beautify/1.13.0/beautify-html.js"></script>
79
- <script>
80
- window.onload = () => {
81
- const previews = document.getElementsByClassName("html-preview");
82
- for (i = 0; i < previews.length; i++) {
83
- previews[i].innerText = html_beautify(previews[i].textContent)
84
- }
85
- }
86
- </script>
87
-
88
- <script type="module" integrity="sha512-7Y25+FX/kRUbZEHtQBOSLffzofBxz8ABQErLAVpGkfzactkpJU5wtTmhIfIZeTw7VHg1JeTIC5kHkzPq7LqR1w==" src="/.11ty/reload-client.js"></script></head>
89
-
90
- <body class="app-body">
91
- <a href="#main-content" class="skip-link">Skip to main content</a>
92
-
93
- <header class="header"><a class="navlink header-logo" href="/"></a>
94
- <div class="navlinks">
95
-
96
- <a href="/buttons/"
97
-
98
- class="navlink
99
- ">
100
- Buttons
101
- </a>
102
-
103
- <a href="/ci/"
104
-
105
- class="navlink
106
- ">
107
- CI
108
- </a>
109
-
110
- <a href="/colors/"
111
-
112
- class="navlink
113
- ">
114
- Colors
115
- </a>
116
-
117
- <a href="/components/"
118
-
119
- class="navlink
120
- ">
121
- Components
122
- </a>
123
-
124
- <a href="/forms/"
125
-
126
- class="navlink
127
- ">
128
- Forms
129
- </a>
130
-
131
- <a href="/icons/"
132
-
133
- class="navlink
134
- ">
135
- Icons
136
- </a>
137
-
138
- <a href="/layout/"
139
-
140
- class="navlink
141
- ">
142
- Layout
143
- </a>
144
-
145
- <a href="/navigation/"
146
-
147
- class="navlink
148
- ">
149
- Navigation
150
- </a>
151
-
152
- <a href="/typography/"
153
-
154
- class="navlink
155
- ">
156
- Typography
157
- </a>
158
-
159
- <details class="header-dropdown">
160
- <summary class="navlink">Examples</summary>
161
- <div class="dropdown-menu">
162
-
163
- <a href="/pages/examples/clientui-collaborators/"
164
- class="dropdown-link">
165
- Client UI - Collaborators
166
- </a>
167
-
168
- <a href="/pages/examples/clientui-request-details/"
169
- class="dropdown-link">
170
- Client UI - Request details
171
- </a>
172
-
173
- <a href="/pages/examples/clientui-request-form/"
174
- class="dropdown-link">
175
- Client UI - Request form
176
- </a>
177
-
178
- <a href="/pages/examples/dashboard/"
179
- class="dropdown-link">
180
- Dashboard
181
- </a>
182
-
183
- <a href="/pages/examples/layout-actionbar/"
184
- class="dropdown-link">
185
- Layout with actionbar
186
- </a>
187
-
188
- <a href="/pages/examples/layout-basic/"
189
- class="dropdown-link">
190
- Basic layout
191
- </a>
192
-
193
- <a href="/pages/examples/layout-infosidebar/"
194
- class="dropdown-link">
195
- Layout with info sidebar
196
- </a>
197
-
198
- <a href="/pages/examples/layout-sidebar-actionbar/"
199
- class="dropdown-link">
200
- Layout with sidebar and actionbar
201
- </a>
202
-
203
- <a href="/pages/examples/layout-sidebar-contentactionbar/"
204
- class="dropdown-link">
205
- Layout with sidebar and content actionbar
206
- </a>
207
-
208
- <a href="/pages/examples/layout-sidebar-form-actionbar-aside/"
209
- class="dropdown-link">
210
- Form layout: sidebar, actionbar, aside
211
- </a>
212
-
213
- <a href="/pages/examples/layout-sidebar-form-actionbar/"
214
- class="dropdown-link">
215
- Form layout with sidebar and actionbar
216
- </a>
217
-
218
- <a href="/pages/examples/layout-sidebar-form-contentactionbar-aside/"
219
- class="dropdown-link">
220
- Form layout: sidebar, content actionbar, aside
221
- </a>
222
-
223
- <a href="/pages/examples/layout-sidebar-form-contentactionbar/"
224
- class="dropdown-link">
225
- Form layout with sidebar and content actionbar
226
- </a>
227
-
228
- <a href="/pages/examples/layout-sidebar/"
229
- class="dropdown-link">
230
- Layout with sidebar navigation
231
- </a>
232
-
233
- <a href="/pages/examples/settings/"
234
- class="dropdown-link">
235
- Settings
236
- </a>
237
-
238
- <a href="/pages/examples/task-accepted/"
239
- class="dropdown-link">
240
- Task accepted
241
- </a>
242
-
243
- <a href="/pages/examples/task-preview/"
244
- class="dropdown-link">
245
- Task preview
246
- </a>
247
-
248
- <a href="/pages/examples/signin/"
249
- class="dropdown-link">
250
- Sign in
251
- </a>
252
-
253
- <a href="/pages/examples/signup-languages/"
254
- class="dropdown-link">
255
- Sign up - Add Language
256
- </a>
257
-
258
- <a href="/pages/examples/signup-preferences/"
259
- class="dropdown-link">
260
- Sign up - Add Preferences
261
- </a>
262
-
263
- </div>
264
- </details>
265
-
266
- <details class="header-dropdown">
267
- <summary class="navlink">E-Mail Templates</summary>
268
- <div class="dropdown-menu">
269
-
270
- <a href="/pages/email-templates/email-generic/"
271
- class="dropdown-link">
272
- Email Generic
273
- </a>
274
-
275
- </div>
276
- </details>
277
-
278
- </div>
279
-
280
-
281
- <!-- Mobile menu button-->
282
- <div class="mobile-links">
283
- <details>
284
- <summary class="mobile-menu-btn"><div class="navlink"><span class="sr-only">Open main menu</span><!-- Icon when menu is closed.--><span class="text-xl icon icon-menu" aria-hidden="true"></span></div></summary>
285
- <div class="mobile-menu sidebar">
286
-
287
-
288
- <a href="/buttons/"
289
-
290
- class="navlink
291
- ">
292
- Buttons
293
- </a>
294
-
295
- <a href="/ci/"
296
-
297
- class="navlink
298
- ">
299
- CI
300
- </a>
301
-
302
- <a href="/colors/"
303
-
304
- class="navlink
305
- ">
306
- Colors
307
- </a>
308
-
309
- <a href="/components/"
310
-
311
- class="navlink
312
- ">
313
- Components
314
- </a>
315
-
316
- <a href="/forms/"
317
-
318
- class="navlink
319
- ">
320
- Forms
321
- </a>
322
-
323
- <a href="/icons/"
324
-
325
- class="navlink
326
- ">
327
- Icons
328
- </a>
329
-
330
- <a href="/layout/"
331
-
332
- class="navlink
333
- ">
334
- Layout
335
- </a>
336
-
337
- <a href="/navigation/"
338
-
339
- class="navlink
340
- ">
341
- Navigation
342
- </a>
343
-
344
- <a href="/typography/"
345
-
346
- class="navlink
347
- ">
348
- Typography
349
- </a>
350
-
351
-
352
- <details>
353
- <summary class="navlink-container"><div class="navlink">Examples</div></summary>
354
-
355
- <a href="/pages/examples/clientui-collaborators/"
356
- class="navlink">
357
- Client UI - Collaborators
358
- </a>
359
-
360
- <a href="/pages/examples/clientui-request-details/"
361
- class="navlink">
362
- Client UI - Request details
363
- </a>
364
-
365
- <a href="/pages/examples/clientui-request-form/"
366
- class="navlink">
367
- Client UI - Request form
368
- </a>
369
-
370
- <a href="/pages/examples/dashboard/"
371
- class="navlink">
372
- Dashboard
373
- </a>
374
-
375
- <a href="/pages/examples/layout-actionbar/"
376
- class="navlink">
377
- Layout with actionbar
378
- </a>
379
-
380
- <a href="/pages/examples/layout-basic/"
381
- class="navlink">
382
- Basic layout
383
- </a>
384
-
385
- <a href="/pages/examples/layout-infosidebar/"
386
- class="navlink">
387
- Layout with info sidebar
388
- </a>
389
-
390
- <a href="/pages/examples/layout-sidebar-actionbar/"
391
- class="navlink">
392
- Layout with sidebar and actionbar
393
- </a>
394
-
395
- <a href="/pages/examples/layout-sidebar-contentactionbar/"
396
- class="navlink">
397
- Layout with sidebar and content actionbar
398
- </a>
399
-
400
- <a href="/pages/examples/layout-sidebar-form-actionbar-aside/"
401
- class="navlink">
402
- Form layout: sidebar, actionbar, aside
403
- </a>
404
-
405
- <a href="/pages/examples/layout-sidebar-form-actionbar/"
406
- class="navlink">
407
- Form layout with sidebar and actionbar
408
- </a>
409
-
410
- <a href="/pages/examples/layout-sidebar-form-contentactionbar-aside/"
411
- class="navlink">
412
- Form layout: sidebar, content actionbar, aside
413
- </a>
414
-
415
- <a href="/pages/examples/layout-sidebar-form-contentactionbar/"
416
- class="navlink">
417
- Form layout with sidebar and content actionbar
418
- </a>
419
-
420
- <a href="/pages/examples/layout-sidebar/"
421
- class="navlink">
422
- Layout with sidebar navigation
423
- </a>
424
-
425
- <a href="/pages/examples/settings/"
426
- class="navlink">
427
- Settings
428
- </a>
429
-
430
- <a href="/pages/examples/task-accepted/"
431
- class="navlink">
432
- Task accepted
433
- </a>
434
-
435
- <a href="/pages/examples/task-preview/"
436
- class="navlink">
437
- Task preview
438
- </a>
439
-
440
- <a href="/pages/examples/signin/"
441
- class="navlink">
442
- Sign in
443
- </a>
444
-
445
- <a href="/pages/examples/signup-languages/"
446
- class="navlink">
447
- Sign up - Add Language
448
- </a>
449
-
450
- <a href="/pages/examples/signup-preferences/"
451
- class="navlink">
452
- Sign up - Add Preferences
453
- </a>
454
-
455
- </details>
456
-
457
- <details>
458
- <summary class="navlink-container"><div class="navlink">E-Mail</div></summary>
459
-
460
- <a href="/pages/email-templates/email-generic/"
461
- class="navlink">
462
- Email Generic
463
- </a>
464
-
465
- </details>
466
-
467
- </div>
468
- </details>
469
-
470
- </div>
471
- </header>
472
-
473
-
474
- <main class="main-content main-content-padding"><div class="centered-column"><div class="centered-column-content"><img class="mt-10 mb-5" src="/assets/images/logo-fortissimo/fortissimo-logo-horizontal-black.svg"/><p class="max-w-md mx-auto md:mt-5 md:max-w-3xl">The Translation Space Design System provides a set of tools to help designers and developers build products and services more easily. Our custom TailwindCSS config file, component classes, and HTML snippets offer a starting point for development.</p><div class="flex justify-center pt-10"><a href="https://badge.fury.io/js/translation-space-designsystem"><img src="https://badge.fury.io/js/translation-space-designsystem.svg" alt="npm version" height="18"/></a></div></div></div></main>
475
-
476
- </body>
477
- <script src="/static/app.bundled.js"></script>
478
- </html>
1
+ <!DOCTYPE html>
2
+ <html lang="en">
3
+ <head>
4
+ <!--
5
+ Maintained with the excellent knowledge from https://htmlhead.dev
6
+ These comments will be removed in production
7
+
8
+ ========================
9
+
10
+ The following 2 meta tags *must* come first in the <head>
11
+ to consistently ensure proper document rendering.
12
+ Any other head element should come *after* these tags.
13
+ -->
14
+ <meta charset="utf-8">
15
+ <meta name="viewport" content="width=device-width, initial-scale=1">
16
+
17
+ <!-- Set the base URL for all relative URLs within the document -->
18
+ <base href="/">
19
+
20
+ <!--
21
+ Short description of the document (limit to 150 characters)
22
+ This content *may* be used as a part of search engine results.
23
+ -->
24
+ <meta name="description" content="Tailwind based design system for Test IO">
25
+
26
+ <!-- Control the behavior of search engine crawling and indexing -->
27
+ <meta name="robots" content="index,follow"><!-- All Search Engines -->
28
+ <meta name="googlebot" content="index,follow"><!-- Google Specific -->
29
+
30
+ <!-- Tells Google not to show the sitelinks search box -->
31
+ <meta name="google" content="nositelinkssearchbox">
32
+ <!-- Tells Google not to provide a translation for this document -->
33
+ <meta name="google" content="notranslate">
34
+
35
+ <!-- Identify the software used to build the document, Eleventy ftw! -->
36
+ <meta name="generator" content="eleventy">
37
+
38
+ <!-- Disable automatic detection and formatting of possible phone numbers -->
39
+ <meta name="format-detection" content="telephone=no">
40
+
41
+ <!-- Helps prevent duplicate content issues -->
42
+ <link rel="canonical" href="https://test.io/">
43
+
44
+ <title>Test IO - TailWind - Test IO TailWind</title>
45
+
46
+ <!-- Links to information about the author(s) of the document -->
47
+ <link rel="author" href="humans.txt">
48
+
49
+ <link rel="apple-touch-icon" sizes="180x180" href="/apple-touch-icon.png">
50
+ <link rel="icon" type="image/png" sizes="32x32" href="/favicon-32x32.png">
51
+ <link rel="icon" type="image/png" sizes="16x16" href="/favicon-16x16.png">
52
+ <link rel="manifest" href="/site.webmanifest">
53
+ <link rel="mask-icon" href="/safari-pinned-tab.svg" color="#5bbad5">
54
+ <meta name="msapplication-TileColor" content="#000000">
55
+ <meta name="theme-color" content="#ffffff">
56
+
57
+ <!-- Facebook Open Graph meta -->
58
+ <meta property="og:url" content="https://test.io/">
59
+ <meta property="og:type" content="website">
60
+ <meta property="og:title" content="Test IO - TailWind">
61
+
62
+ <meta property="og:description" content="Tailwind based design system for Test IO" />
63
+ <meta property="og:site_name" content="Test IO TailWind">
64
+ <meta property="og:locale" content="en_US">
65
+ <meta property="article:author" content="test IO">
66
+
67
+ <!-- Twitter Open Graph meta -->
68
+ <meta name="twitter:card" content="summary_large_image">
69
+ <meta name="twitter:site" content="">
70
+ <meta name="twitter:creator" content="">
71
+
72
+ <!-- disallow Twitter from using your site's info for personalization purposes -->
73
+ <meta name="twitter:dnt" content="on">
74
+
75
+
76
+ <link rel="stylesheet" href="/static/app.compiled.css" id="testio-tailwind" title="Test IO TailWind">
77
+ <script src="https://cdnjs.cloudflare.com/ajax/libs/js-beautify/1.13.0/beautify-html.js"></script>
78
+ <script>
79
+ window.onload = () => {
80
+ const previews = document.getElementsByClassName("html-preview");
81
+ for (i = 0; i < previews.length; i++) {
82
+ previews[i].innerText = html_beautify(previews[i].textContent)
83
+ }
84
+ }
85
+ </script>
86
+
87
+ </head>
88
+
89
+ <body class="app-body">
90
+ <header class="header manager">
91
+ <div class="navlinks logo-wrapper">
92
+ <a class="navlink header-logo" href="/"></a>
93
+ </div>
94
+ <div class="navlinks">
95
+
96
+ <a href="/ci/"
97
+
98
+ class="navlink
99
+ ">
100
+ CI
101
+ </a>
102
+
103
+ <a href="/colors/"
104
+
105
+ class="navlink
106
+ ">
107
+ Colors
108
+ </a>
109
+
110
+ <a href="/buttons/"
111
+
112
+ class="navlink
113
+ ">
114
+ Buttons
115
+ </a>
116
+
117
+ <a href="/components/"
118
+
119
+ class="navlink
120
+ ">
121
+ Components
122
+ </a>
123
+
124
+ <a href="/forms/"
125
+
126
+ class="navlink
127
+ ">
128
+ Forms
129
+ </a>
130
+
131
+ <a href="/charts/"
132
+
133
+ class="navlink
134
+ ">
135
+ Charts
136
+ </a>
137
+
138
+ <a href="/icons/"
139
+
140
+ class="navlink
141
+ ">
142
+ Icons
143
+ </a>
144
+
145
+ <a href="/layout/"
146
+
147
+ class="navlink
148
+ ">
149
+ Layout
150
+ </a>
151
+
152
+ <a href="/navigation/"
153
+
154
+ class="navlink
155
+ ">
156
+ Navigation
157
+ </a>
158
+
159
+ <a href="/typography/"
160
+
161
+ class="navlink
162
+ ">
163
+ Typography
164
+ </a>
165
+
166
+ <details class="header-dropdown">
167
+ <summary class="navlink">Examples</summary>
168
+ <div class="dropdown-menu">
169
+
170
+ <a href="/pages/examples/layout-actionbar/"
171
+ class="dropdown-link">
172
+ Layout with actionbar
173
+ </a>
174
+
175
+ <a href="/pages/examples/layout-basic/"
176
+ class="dropdown-link">
177
+ Layout basic
178
+ </a>
179
+
180
+ <a href="/pages/examples/layout-chat/"
181
+ class="dropdown-link">
182
+ Layout chat page
183
+ </a>
184
+
185
+ <a href="/pages/examples/layout-customer/"
186
+ class="dropdown-link">
187
+ Layout Customer UI
188
+ </a>
189
+
190
+ <a href="/pages/examples/layout-form-sidebar-actionbar-metasidebar/"
191
+ class="dropdown-link">
192
+ Form layout with sidebar, metasidebar and actionbar
193
+ </a>
194
+
195
+ <a href="/pages/examples/layout-metasidebar/"
196
+ class="dropdown-link">
197
+ Layout with metasidebar
198
+ </a>
199
+
200
+ <a href="/pages/examples/layout-sidebar/"
201
+ class="dropdown-link">
202
+ Layout with sidebar
203
+ </a>
204
+
205
+ <a href="/pages/examples/layout-sidebar-actionbar/"
206
+ class="dropdown-link">
207
+ Layout with sidebar and actionbar
208
+ </a>
209
+
210
+ <a href="/pages/examples/layout-sidebar-actionbar-metasidebar/"
211
+ class="dropdown-link">
212
+ Layout with sidebar, metasidebar and actionbar
213
+ </a>
214
+
215
+ <a href="/pages/examples/layout-manager/"
216
+ class="dropdown-link">
217
+ Layout Team Leader UI
218
+ </a>
219
+
220
+ <a href="/pages/examples/layout-tester/"
221
+ class="dropdown-link">
222
+ Layout Tester UI
223
+ </a>
224
+
225
+ <a href="/pages/examples/splitview/"
226
+ class="dropdown-link">
227
+ Splitview Layout
228
+ </a>
229
+
230
+ <a href="/pages/examples/splitview-testcases/"
231
+ class="dropdown-link">
232
+ Splitview Test Case Executions
233
+ </a>
234
+
235
+ </div>
236
+ </details>
237
+
238
+ </div>
239
+
240
+
241
+ <!-- Mobile menu button-->
242
+ <div class="mobile-links">
243
+ <details>
244
+ <summary class="mobile-menu-btn"><div class="navlink"><span class="sr-only">Open main menu</span><!-- Icon when menu is closed.--><span class="text-xl icon icon-menu" aria-hidden="true"></span></div></summary>
245
+ <div class="mobile-menu sidebar">
246
+
247
+
248
+ <a href="/ci/"
249
+
250
+ class="navlink
251
+ ">
252
+ CI
253
+ </a>
254
+
255
+ <a href="/colors/"
256
+
257
+ class="navlink
258
+ ">
259
+ Colors
260
+ </a>
261
+
262
+ <a href="/buttons/"
263
+
264
+ class="navlink
265
+ ">
266
+ Buttons
267
+ </a>
268
+
269
+ <a href="/components/"
270
+
271
+ class="navlink
272
+ ">
273
+ Components
274
+ </a>
275
+
276
+ <a href="/forms/"
277
+
278
+ class="navlink
279
+ ">
280
+ Forms
281
+ </a>
282
+
283
+ <a href="/charts/"
284
+
285
+ class="navlink
286
+ ">
287
+ Charts
288
+ </a>
289
+
290
+ <a href="/icons/"
291
+
292
+ class="navlink
293
+ ">
294
+ Icons
295
+ </a>
296
+
297
+ <a href="/layout/"
298
+
299
+ class="navlink
300
+ ">
301
+ Layout
302
+ </a>
303
+
304
+ <a href="/navigation/"
305
+
306
+ class="navlink
307
+ ">
308
+ Navigation
309
+ </a>
310
+
311
+ <a href="/typography/"
312
+
313
+ class="navlink
314
+ ">
315
+ Typography
316
+ </a>
317
+
318
+
319
+ <details>
320
+ <summary class="navlink-container"><div class="navlink">Examples</div></summary>
321
+
322
+ <a href="/pages/examples/layout-actionbar/"
323
+ class="navlink">
324
+ Layout with actionbar
325
+ </a>
326
+
327
+ <a href="/pages/examples/layout-basic/"
328
+ class="navlink">
329
+ Layout basic
330
+ </a>
331
+
332
+ <a href="/pages/examples/layout-chat/"
333
+ class="navlink">
334
+ Layout chat page
335
+ </a>
336
+
337
+ <a href="/pages/examples/layout-customer/"
338
+ class="navlink">
339
+ Layout Customer UI
340
+ </a>
341
+
342
+ <a href="/pages/examples/layout-form-sidebar-actionbar-metasidebar/"
343
+ class="navlink">
344
+ Form layout with sidebar, metasidebar and actionbar
345
+ </a>
346
+
347
+ <a href="/pages/examples/layout-metasidebar/"
348
+ class="navlink">
349
+ Layout with metasidebar
350
+ </a>
351
+
352
+ <a href="/pages/examples/layout-sidebar/"
353
+ class="navlink">
354
+ Layout with sidebar
355
+ </a>
356
+
357
+ <a href="/pages/examples/layout-sidebar-actionbar/"
358
+ class="navlink">
359
+ Layout with sidebar and actionbar
360
+ </a>
361
+
362
+ <a href="/pages/examples/layout-sidebar-actionbar-metasidebar/"
363
+ class="navlink">
364
+ Layout with sidebar, metasidebar and actionbar
365
+ </a>
366
+
367
+ <a href="/pages/examples/layout-manager/"
368
+ class="navlink">
369
+ Layout Team Leader UI
370
+ </a>
371
+
372
+ <a href="/pages/examples/layout-tester/"
373
+ class="navlink">
374
+ Layout Tester UI
375
+ </a>
376
+
377
+ <a href="/pages/examples/splitview/"
378
+ class="navlink">
379
+ Splitview Layout
380
+ </a>
381
+
382
+ <a href="/pages/examples/splitview-testcases/"
383
+ class="navlink">
384
+ Splitview Test Case Executions
385
+ </a>
386
+
387
+ </details>
388
+ </div>
389
+ </details>
390
+
391
+ </div>
392
+ </header>
393
+
394
+
395
+ <main class="main-content main-content-padding flex justify-start items-center flex-col"><div class="w-spacing-8xl flex flex-col justify-center items-center"><img class="w-spacing-3xl h-spacing-3xl mb-8 mt-5" src="/assets/images/logo-testio/testio_vertical_purpleteal_black.svg"/><p class="max-w-paragraph">This design system provides Test IO themed components based on TailWindCSS. It helps designers and developers build products and services more easily. Component classes, and HTML snippets offer a starting point for development.</p><a class="pt-6" href="https://badge.fury.io/js/testio-tailwind"><img src="https://badge.fury.io/js/testio-tailwind.svg" alt="npm version" height="20"/></a><p class="max-w-paragraph mt-3 mb-heading">To get started with using the styles provided by the design system, just download the current compiled CSS below and implement your components with the provided code. </p><a class="btn btn-block btn-primary max-w-paragraph" href="/static/app.compiled.css" target="_blank"><div class="icon icon-cloud-download mr-icon-spacing"></div>Download compiled CSS</a></div></main>
396
+
397
+ </body>
398
+ <script src="/static/app.bundled.js"></script>
399
+ </html>