yattho_view_components 0.0.1 → 0.1.1

Sign up to get free protection for your applications and to get access to all the features.
Files changed (447) hide show
  1. checksums.yaml +4 -4
  2. data/CHANGELOG.md +45 -0
  3. data/app/assets/javascripts/yattho_view_components.js +1 -1
  4. data/app/assets/javascripts/yattho_view_components.js.map +1 -1
  5. data/app/assets/styles/yattho_view_components.css +3 -5958
  6. data/app/assets/styles/yattho_view_components.css.map +1 -1
  7. data/app/components/yattho/alpha/action_list.css +1 -697
  8. data/app/components/yattho/alpha/action_list.css.json +1 -1
  9. data/app/components/yattho/alpha/action_list.css.map +1 -1
  10. data/app/components/yattho/alpha/auto_complete.css +1 -130
  11. data/app/components/yattho/alpha/auto_complete.css.json +1 -1
  12. data/app/components/yattho/alpha/auto_complete.css.map +1 -1
  13. data/app/components/yattho/alpha/banner.css +1 -131
  14. data/app/components/yattho/alpha/banner.css.json +1 -1
  15. data/app/components/yattho/alpha/banner.css.map +1 -1
  16. data/app/components/yattho/alpha/button_marketing.css +1 -211
  17. data/app/components/yattho/alpha/button_marketing.css.json +1 -1
  18. data/app/components/yattho/alpha/button_marketing.css.map +1 -1
  19. data/app/components/yattho/alpha/dialog.css +1 -613
  20. data/app/components/yattho/alpha/dialog.css.json +1 -1
  21. data/app/components/yattho/alpha/dialog.css.map +1 -1
  22. data/app/components/yattho/alpha/dropdown.css +1 -264
  23. data/app/components/yattho/alpha/dropdown.css.json +1 -1
  24. data/app/components/yattho/alpha/dropdown.css.map +1 -1
  25. data/app/components/yattho/alpha/layout.css +1 -398
  26. data/app/components/yattho/alpha/layout.css.json +1 -1
  27. data/app/components/yattho/alpha/layout.css.map +1 -1
  28. data/app/components/yattho/alpha/menu.css +1 -117
  29. data/app/components/yattho/alpha/menu.css.json +1 -1
  30. data/app/components/yattho/alpha/menu.css.map +1 -1
  31. data/app/components/yattho/alpha/modal_dialog.js +2 -0
  32. data/app/components/yattho/alpha/segmented_control.css +1 -164
  33. data/app/components/yattho/alpha/segmented_control.css.json +1 -1
  34. data/app/components/yattho/alpha/segmented_control.css.map +1 -1
  35. data/app/components/yattho/alpha/tab_nav.css +1 -106
  36. data/app/components/yattho/alpha/tab_nav.css.json +1 -1
  37. data/app/components/yattho/alpha/tab_nav.css.map +1 -1
  38. data/app/components/yattho/alpha/text_field.css +3 -836
  39. data/app/components/yattho/alpha/text_field.css.json +1 -1
  40. data/app/components/yattho/alpha/text_field.css.map +1 -1
  41. data/app/components/yattho/alpha/toggle_switch.css +1 -253
  42. data/app/components/yattho/alpha/toggle_switch.css.json +1 -1
  43. data/app/components/yattho/alpha/toggle_switch.css.map +1 -1
  44. data/app/components/yattho/alpha/underline_nav.css +1 -148
  45. data/app/components/yattho/alpha/underline_nav.css.json +1 -1
  46. data/app/components/yattho/alpha/underline_nav.css.map +1 -1
  47. data/app/components/yattho/beta/avatar.css +1 -74
  48. data/app/components/yattho/beta/avatar.css.json +1 -1
  49. data/app/components/yattho/beta/avatar.css.map +1 -1
  50. data/app/components/yattho/beta/avatar_stack.css +1 -138
  51. data/app/components/yattho/beta/avatar_stack.css.json +1 -1
  52. data/app/components/yattho/beta/avatar_stack.css.map +1 -1
  53. data/app/components/yattho/beta/blankslate.css +1 -90
  54. data/app/components/yattho/beta/blankslate.css.map +1 -1
  55. data/app/components/yattho/beta/border_box.css +1 -279
  56. data/app/components/yattho/beta/border_box.css.json +1 -1
  57. data/app/components/yattho/beta/border_box.css.map +1 -1
  58. data/app/components/yattho/beta/breadcrumbs.css +1 -27
  59. data/app/components/yattho/beta/breadcrumbs.css.json +1 -1
  60. data/app/components/yattho/beta/breadcrumbs.css.map +1 -1
  61. data/app/components/yattho/beta/button.css +1 -365
  62. data/app/components/yattho/beta/button.css.json +1 -1
  63. data/app/components/yattho/beta/button.css.map +1 -1
  64. data/app/components/yattho/beta/counter.css +1 -36
  65. data/app/components/yattho/beta/counter.css.map +1 -1
  66. data/app/components/yattho/beta/flash.css +1 -150
  67. data/app/components/yattho/beta/flash.css.json +1 -1
  68. data/app/components/yattho/beta/flash.css.map +1 -1
  69. data/app/components/yattho/beta/label.css +1 -105
  70. data/app/components/yattho/beta/label.css.json +1 -1
  71. data/app/components/yattho/beta/label.css.map +1 -1
  72. data/app/components/yattho/beta/link.css +1 -62
  73. data/app/components/yattho/beta/link.css.json +1 -1
  74. data/app/components/yattho/beta/link.css.map +1 -1
  75. data/app/components/yattho/beta/popover.css +1 -235
  76. data/app/components/yattho/beta/popover.css.json +1 -1
  77. data/app/components/yattho/beta/popover.css.map +1 -1
  78. data/app/components/yattho/beta/progress_bar.css +1 -26
  79. data/app/components/yattho/beta/progress_bar.css.json +1 -1
  80. data/app/components/yattho/beta/progress_bar.css.map +1 -1
  81. data/app/components/yattho/beta/state.css +1 -50
  82. data/app/components/yattho/beta/state.css.json +1 -1
  83. data/app/components/yattho/beta/state.css.map +1 -1
  84. data/app/components/yattho/beta/subhead.css +1 -54
  85. data/app/components/yattho/beta/subhead.css.json +1 -1
  86. data/app/components/yattho/beta/subhead.css.map +1 -1
  87. data/app/components/yattho/beta/timeline_item.css +1 -95
  88. data/app/components/yattho/beta/timeline_item.css.json +1 -1
  89. data/app/components/yattho/beta/timeline_item.css.map +1 -1
  90. data/app/components/yattho/beta/truncate.css +1 -37
  91. data/app/components/yattho/beta/truncate.css.json +1 -1
  92. data/app/components/yattho/beta/truncate.css.map +1 -1
  93. data/app/components/yattho/truncate.css +1 -30
  94. data/app/components/yattho/truncate.css.json +1 -1
  95. data/app/components/yattho/truncate.css.map +1 -1
  96. data/lib/yattho/view_components/version.rb +1 -1
  97. metadata +3 -353
  98. data/previews/docs/alpha_auto_complete_item_preview/default.html.erb +0 -10
  99. data/previews/docs/alpha_auto_complete_item_preview.rb +0 -7
  100. data/previews/docs/alpha_auto_complete_preview/default.html.erb +0 -1
  101. data/previews/docs/alpha_auto_complete_preview/with_clear_button.html.erb +0 -1
  102. data/previews/docs/alpha_auto_complete_preview/with_custom_classes_for_the_input.html.erb +0 -3
  103. data/previews/docs/alpha_auto_complete_preview/with_custom_classes_for_the_results.html.erb +0 -10
  104. data/previews/docs/alpha_auto_complete_preview/with_icon.html.erb +0 -1
  105. data/previews/docs/alpha_auto_complete_preview/with_icon_and_non_visible_label.html.erb +0 -1
  106. data/previews/docs/alpha_auto_complete_preview/with_inline_label.html.erb +0 -1
  107. data/previews/docs/alpha_auto_complete_preview/with_non_visible_label.html.erb +0 -1
  108. data/previews/docs/alpha_auto_complete_preview.rb +0 -21
  109. data/previews/docs/alpha_banner_preview/custom_icon.html.erb +0 -1
  110. data/previews/docs/alpha_banner_preview/dismissible.html.erb +0 -1
  111. data/previews/docs/alpha_banner_preview/full_width.html.erb +0 -1
  112. data/previews/docs/alpha_banner_preview/schemes.html.erb +0 -6
  113. data/previews/docs/alpha_banner_preview/with_action_button.html.erb +0 -4
  114. data/previews/docs/alpha_banner_preview/with_custom_action.html.erb +0 -6
  115. data/previews/docs/alpha_banner_preview.rb +0 -17
  116. data/previews/docs/alpha_button_marketing_preview/schemes.html.erb +0 -6
  117. data/previews/docs/alpha_button_marketing_preview/sizes.html.erb +0 -2
  118. data/previews/docs/alpha_button_marketing_preview.rb +0 -9
  119. data/previews/docs/alpha_dialog_preview/dialog_with_cancel_and_submit_buttons.html.erb +0 -13
  120. data/previews/docs/alpha_dialog_preview.rb +0 -7
  121. data/previews/docs/alpha_dropdown_preview/customizing_menu_items.html.erb +0 -11
  122. data/previews/docs/alpha_dropdown_preview/customizing_the_button.html.erb +0 -12
  123. data/previews/docs/alpha_dropdown_preview/default.html.erb +0 -11
  124. data/previews/docs/alpha_dropdown_preview/menu_as_list.html.erb +0 -13
  125. data/previews/docs/alpha_dropdown_preview/with_caret.html.erb +0 -12
  126. data/previews/docs/alpha_dropdown_preview/with_direction.html.erb +0 -12
  127. data/previews/docs/alpha_dropdown_preview/with_dividers.html.erb +0 -16
  128. data/previews/docs/alpha_dropdown_preview.rb +0 -19
  129. data/previews/docs/alpha_hellip_button_preview/default.html.erb +0 -1
  130. data/previews/docs/alpha_hellip_button_preview/inline.html.erb +0 -1
  131. data/previews/docs/alpha_hellip_button_preview/styling_the_button.html.erb +0 -1
  132. data/previews/docs/alpha_hellip_button_preview.rb +0 -11
  133. data/previews/docs/alpha_hidden_text_expander_preview/default.html.erb +0 -1
  134. data/previews/docs/alpha_hidden_text_expander_preview/inline.html.erb +0 -1
  135. data/previews/docs/alpha_hidden_text_expander_preview/styling_the_button.html.erb +0 -1
  136. data/previews/docs/alpha_hidden_text_expander_preview.rb +0 -11
  137. data/previews/docs/alpha_image_crop_preview/cropper_with_a_custom_loader.html.erb +0 -3
  138. data/previews/docs/alpha_image_crop_preview/simple_cropper.html.erb +0 -1
  139. data/previews/docs/alpha_image_crop_preview/square_cropper.html.erb +0 -1
  140. data/previews/docs/alpha_image_crop_preview.rb +0 -11
  141. data/previews/docs/alpha_image_preview/custom_size.html.erb +0 -2
  142. data/previews/docs/alpha_image_preview/default.html.erb +0 -2
  143. data/previews/docs/alpha_image_preview/helper.html.erb +0 -2
  144. data/previews/docs/alpha_image_preview/lazy_loading.html.erb +0 -2
  145. data/previews/docs/alpha_image_preview.rb +0 -13
  146. data/previews/docs/alpha_layout_preview/changing_when_to_render_layout_as_columns.html.erb +0 -12
  147. data/previews/docs/alpha_layout_preview/default.html.erb +0 -5
  148. data/previews/docs/alpha_layout_preview/main_widths.html.erb +0 -16
  149. data/previews/docs/alpha_layout_preview/sidebar_placement.html.erb +0 -8
  150. data/previews/docs/alpha_layout_preview/sidebar_placement_as_row.html.erb +0 -12
  151. data/previews/docs/alpha_layout_preview/sidebar_widths.html.erb +0 -12
  152. data/previews/docs/alpha_layout_preview.rb +0 -17
  153. data/previews/docs/alpha_menu_preview/default.html.erb +0 -17
  154. data/previews/docs/alpha_menu_preview.rb +0 -7
  155. data/previews/docs/alpha_nav_list_preview/expandable_sub_items.html.erb +0 -24
  156. data/previews/docs/alpha_nav_list_preview/items_and_headings.html.erb +0 -12
  157. data/previews/docs/alpha_nav_list_preview/leading_and_trailing_visuals.html.erb +0 -17
  158. data/previews/docs/alpha_nav_list_preview/trailing_action.html.erb +0 -12
  159. data/previews/docs/alpha_nav_list_preview.rb +0 -13
  160. data/previews/docs/alpha_octicon_symbols_preview/symbol_dictionary.html.erb +0 -4
  161. data/previews/docs/alpha_octicon_symbols_preview.rb +0 -7
  162. data/previews/docs/alpha_segmented_control_preview/basic_usage.html.erb +0 -6
  163. data/previews/docs/alpha_segmented_control_preview/fill_width_of_parent.html.erb +0 -5
  164. data/previews/docs/alpha_segmented_control_preview/small.html.erb +0 -6
  165. data/previews/docs/alpha_segmented_control_preview/with_icons.html.erb +0 -5
  166. data/previews/docs/alpha_segmented_control_preview/with_icons_only.html.erb +0 -5
  167. data/previews/docs/alpha_segmented_control_preview.rb +0 -15
  168. data/previews/docs/alpha_tab_container_preview/default.html.erb +0 -16
  169. data/previews/docs/alpha_tab_container_preview.rb +0 -7
  170. data/previews/docs/alpha_tab_nav_preview/adding_extra_content_after_the_tabs.html.erb +0 -10
  171. data/previews/docs/alpha_tab_nav_preview/customizing_the_body.html.erb +0 -5
  172. data/previews/docs/alpha_tab_nav_preview/default_with_div.html.erb +0 -5
  173. data/previews/docs/alpha_tab_nav_preview/default_with_nav.html.erb +0 -5
  174. data/previews/docs/alpha_tab_nav_preview/with_extra_content.html.erb +0 -8
  175. data/previews/docs/alpha_tab_nav_preview/with_icons_and_counters.html.erb +0 -15
  176. data/previews/docs/alpha_tab_nav_preview.rb +0 -17
  177. data/previews/docs/alpha_tab_panels_preview/default.html.erb +0 -14
  178. data/previews/docs/alpha_tab_panels_preview.rb +0 -7
  179. data/previews/docs/alpha_text_field_preview/default.html.erb +0 -1
  180. data/previews/docs/alpha_text_field_preview/disabled.html.erb +0 -7
  181. data/previews/docs/alpha_text_field_preview/full_width.html.erb +0 -7
  182. data/previews/docs/alpha_text_field_preview/invalid.html.erb +0 -7
  183. data/previews/docs/alpha_text_field_preview/with_a_caption.html.erb +0 -7
  184. data/previews/docs/alpha_text_field_preview/with_a_clear_button.html.erb +0 -7
  185. data/previews/docs/alpha_text_field_preview/with_a_leading_visual.html.erb +0 -9
  186. data/previews/docs/alpha_text_field_preview/with_a_validation_message.html.erb +0 -7
  187. data/previews/docs/alpha_text_field_preview.rb +0 -21
  188. data/previews/docs/alpha_toggle_switch_preview/checked.html.erb +0 -1
  189. data/previews/docs/alpha_toggle_switch_preview/checked_and_disabled.html.erb +0 -1
  190. data/previews/docs/alpha_toggle_switch_preview/default.html.erb +0 -1
  191. data/previews/docs/alpha_toggle_switch_preview/disabled.html.erb +0 -1
  192. data/previews/docs/alpha_toggle_switch_preview/small.html.erb +0 -1
  193. data/previews/docs/alpha_toggle_switch_preview/with_status_label_positioned_at_the_end.html.erb +0 -1
  194. data/previews/docs/alpha_toggle_switch_preview.rb +0 -17
  195. data/previews/docs/alpha_tooltip_preview/as_a_label_for_an_iconbutton.html.erb +0 -1
  196. data/previews/docs/alpha_tooltip_preview/as_a_supplementary_description_for_a_button.html.erb +0 -4
  197. data/previews/docs/alpha_tooltip_preview/as_a_supplementary_description_for_an_iconbutton.html.erb +0 -1
  198. data/previews/docs/alpha_tooltip_preview/directly_using_tooltip.html.erb +0 -4
  199. data/previews/docs/alpha_tooltip_preview/with_direction.html.erb +0 -32
  200. data/previews/docs/alpha_tooltip_preview.rb +0 -15
  201. data/previews/docs/alpha_underline_nav_preview/align_right.html.erb +0 -11
  202. data/previews/docs/alpha_underline_nav_preview/customizing_the_body.html.erb +0 -5
  203. data/previews/docs/alpha_underline_nav_preview/default_with_nav.html.erb +0 -7
  204. data/previews/docs/alpha_underline_nav_preview/with_div.html.erb +0 -7
  205. data/previews/docs/alpha_underline_nav_preview/with_icons_and_counters.html.erb +0 -18
  206. data/previews/docs/alpha_underline_nav_preview.rb +0 -15
  207. data/previews/docs/alpha_underline_panels_preview/default.html.erb +0 -17
  208. data/previews/docs/alpha_underline_panels_preview.rb +0 -7
  209. data/previews/docs/beta_auto_complete_item_preview/default.html.erb +0 -6
  210. data/previews/docs/beta_auto_complete_item_preview.rb +0 -7
  211. data/previews/docs/beta_auto_complete_preview/full_width_field.html.erb +0 -3
  212. data/previews/docs/beta_auto_complete_preview/inset_variant.html.erb +0 -3
  213. data/previews/docs/beta_auto_complete_preview/leading_visual.html.erb +0 -3
  214. data/previews/docs/beta_auto_complete_preview/monospace_variant.html.erb +0 -3
  215. data/previews/docs/beta_auto_complete_preview/trailing_action.html.erb +0 -1
  216. data/previews/docs/beta_auto_complete_preview/visually_hidden_label.html.erb +0 -3
  217. data/previews/docs/beta_auto_complete_preview/with_custom_classes_for_the_input.html.erb +0 -3
  218. data/previews/docs/beta_auto_complete_preview/with_custom_classes_for_the_results.html.erb +0 -3
  219. data/previews/docs/beta_auto_complete_preview.rb +0 -21
  220. data/previews/docs/beta_avatar_preview/default.html.erb +0 -1
  221. data/previews/docs/beta_avatar_preview/link.html.erb +0 -1
  222. data/previews/docs/beta_avatar_preview/square.html.erb +0 -1
  223. data/previews/docs/beta_avatar_preview/with_size.html.erb +0 -7
  224. data/previews/docs/beta_avatar_preview.rb +0 -13
  225. data/previews/docs/beta_avatar_stack_preview/align_right.html.erb +0 -5
  226. data/previews/docs/beta_avatar_stack_preview/default.html.erb +0 -5
  227. data/previews/docs/beta_avatar_stack_preview/with_tooltip.html.erb +0 -5
  228. data/previews/docs/beta_avatar_stack_preview.rb +0 -11
  229. data/previews/docs/beta_base_button_preview/block.html.erb +0 -2
  230. data/previews/docs/beta_base_button_preview.rb +0 -7
  231. data/previews/docs/beta_blankslate_preview/basic.html.erb +0 -4
  232. data/previews/docs/beta_blankslate_preview/custom_content.html.erb +0 -6
  233. data/previews/docs/beta_blankslate_preview/icon.html.erb +0 -5
  234. data/previews/docs/beta_blankslate_preview/loading.html.erb +0 -5
  235. data/previews/docs/beta_blankslate_preview/primary_action.html.erb +0 -6
  236. data/previews/docs/beta_blankslate_preview/primary_and_secondary_actions.html.erb +0 -7
  237. data/previews/docs/beta_blankslate_preview/secondary_action.html.erb +0 -6
  238. data/previews/docs/beta_blankslate_preview/using_an_image.html.erb +0 -5
  239. data/previews/docs/beta_blankslate_preview/variations.html.erb +0 -8
  240. data/previews/docs/beta_blankslate_preview/with_border.html.erb +0 -5
  241. data/previews/docs/beta_blankslate_preview.rb +0 -25
  242. data/previews/docs/beta_border_box_header_preview/default.html.erb +0 -4
  243. data/previews/docs/beta_border_box_header_preview/with_title.html.erb +0 -3
  244. data/previews/docs/beta_border_box_header_preview.rb +0 -9
  245. data/previews/docs/beta_border_box_preview/header_with_title_body_rows_and_footer.html.erb +0 -21
  246. data/previews/docs/beta_border_box_preview/padding_density.html.erb +0 -14
  247. data/previews/docs/beta_border_box_preview/row_colors.html.erb +0 -14
  248. data/previews/docs/beta_border_box_preview.rb +0 -11
  249. data/previews/docs/beta_breadcrumbs_preview/basic.html.erb +0 -5
  250. data/previews/docs/beta_breadcrumbs_preview.rb +0 -7
  251. data/previews/docs/beta_button_group_preview/default.html.erb +0 -8
  252. data/previews/docs/beta_button_group_preview/sizes.html.erb +0 -7
  253. data/previews/docs/beta_button_group_preview.rb +0 -9
  254. data/previews/docs/beta_button_preview/full_width.html.erb +0 -2
  255. data/previews/docs/beta_button_preview/schemes.html.erb +0 -4
  256. data/previews/docs/beta_button_preview/sizes.html.erb +0 -2
  257. data/previews/docs/beta_button_preview/with_leading_and_trailing_visuals.html.erb +0 -5
  258. data/previews/docs/beta_button_preview/with_leading_visual.html.erb +0 -4
  259. data/previews/docs/beta_button_preview/with_tooltip.html.erb +0 -4
  260. data/previews/docs/beta_button_preview/with_trailing_visual.html.erb +0 -4
  261. data/previews/docs/beta_button_preview.rb +0 -19
  262. data/previews/docs/beta_clipboard_copy_preview/copying_from_an_element.html.erb +0 -2
  263. data/previews/docs/beta_clipboard_copy_preview/default.html.erb +0 -1
  264. data/previews/docs/beta_clipboard_copy_preview/with_text_instead_of_icons.html.erb +0 -3
  265. data/previews/docs/beta_clipboard_copy_preview.rb +0 -11
  266. data/previews/docs/beta_close_button_preview/default.html.erb +0 -1
  267. data/previews/docs/beta_close_button_preview.rb +0 -7
  268. data/previews/docs/beta_counter_preview/default.html.erb +0 -1
  269. data/previews/docs/beta_counter_preview/schemes.html.erb +0 -2
  270. data/previews/docs/beta_counter_preview.rb +0 -9
  271. data/previews/docs/beta_details_preview/default.html.erb +0 -9
  272. data/previews/docs/beta_details_preview.rb +0 -7
  273. data/previews/docs/beta_flash_preview/dismissible.html.erb +0 -1
  274. data/previews/docs/beta_flash_preview/full_width.html.erb +0 -1
  275. data/previews/docs/beta_flash_preview/icon.html.erb +0 -1
  276. data/previews/docs/beta_flash_preview/schemes.html.erb +0 -4
  277. data/previews/docs/beta_flash_preview/with_actions.html.erb +0 -6
  278. data/previews/docs/beta_flash_preview.rb +0 -15
  279. data/previews/docs/beta_heading_preview/default.html.erb +0 -6
  280. data/previews/docs/beta_heading_preview.rb +0 -7
  281. data/previews/docs/beta_icon_button_preview/custom_tooltip_direction.html.erb +0 -2
  282. data/previews/docs/beta_icon_button_preview/default.html.erb +0 -2
  283. data/previews/docs/beta_icon_button_preview/schemes.html.erb +0 -3
  284. data/previews/docs/beta_icon_button_preview/with_an_aria_description.html.erb +0 -1
  285. data/previews/docs/beta_icon_button_preview.rb +0 -13
  286. data/previews/docs/beta_label_preview/inline.html.erb +0 -2
  287. data/previews/docs/beta_label_preview/schemes.html.erb +0 -10
  288. data/previews/docs/beta_label_preview/sizes.html.erb +0 -2
  289. data/previews/docs/beta_label_preview.rb +0 -11
  290. data/previews/docs/beta_link_preview/default.html.erb +0 -1
  291. data/previews/docs/beta_link_preview/muted.html.erb +0 -1
  292. data/previews/docs/beta_link_preview/schemes.html.erb +0 -2
  293. data/previews/docs/beta_link_preview/with_tooltip.html.erb +0 -4
  294. data/previews/docs/beta_link_preview/without_underline.html.erb +0 -1
  295. data/previews/docs/beta_link_preview.rb +0 -15
  296. data/previews/docs/beta_markdown_preview/default.html.erb +0 -260
  297. data/previews/docs/beta_markdown_preview.rb +0 -7
  298. data/previews/docs/beta_octicon_preview/default.html.erb +0 -2
  299. data/previews/docs/beta_octicon_preview/helper.html.erb +0 -1
  300. data/previews/docs/beta_octicon_preview/medium.html.erb +0 -1
  301. data/previews/docs/beta_octicon_preview.rb +0 -11
  302. data/previews/docs/beta_popover_preview/caret_position.html.erb +0 -8
  303. data/previews/docs/beta_popover_preview/default.html.erb +0 -8
  304. data/previews/docs/beta_popover_preview/large.html.erb +0 -8
  305. data/previews/docs/beta_popover_preview/with_multiple_elements_in_the_body.html.erb +0 -11
  306. data/previews/docs/beta_popover_preview.rb +0 -13
  307. data/previews/docs/beta_progress_bar_preview/default.html.erb +0 -3
  308. data/previews/docs/beta_progress_bar_preview/large.html.erb +0 -3
  309. data/previews/docs/beta_progress_bar_preview/multiple_items.html.erb +0 -5
  310. data/previews/docs/beta_progress_bar_preview/small.html.erb +0 -3
  311. data/previews/docs/beta_progress_bar_preview.rb +0 -13
  312. data/previews/docs/beta_relative_time_preview/default.html.erb +0 -1
  313. data/previews/docs/beta_relative_time_preview/elapsed_time.html.erb +0 -1
  314. data/previews/docs/beta_relative_time_preview/past_time.html.erb +0 -1
  315. data/previews/docs/beta_relative_time_preview.rb +0 -11
  316. data/previews/docs/beta_spinner_preview/default.html.erb +0 -1
  317. data/previews/docs/beta_spinner_preview/large.html.erb +0 -1
  318. data/previews/docs/beta_spinner_preview/small.html.erb +0 -1
  319. data/previews/docs/beta_spinner_preview.rb +0 -11
  320. data/previews/docs/beta_state_preview/default.html.erb +0 -1
  321. data/previews/docs/beta_state_preview/schemes.html.erb +0 -4
  322. data/previews/docs/beta_state_preview/sizes.html.erb +0 -2
  323. data/previews/docs/beta_state_preview.rb +0 -11
  324. data/previews/docs/beta_subhead_preview/default.html.erb +0 -8
  325. data/previews/docs/beta_subhead_preview/with_actions.html.erb +0 -15
  326. data/previews/docs/beta_subhead_preview/with_dangerous_heading.html.erb +0 -8
  327. data/previews/docs/beta_subhead_preview/with_long_description.html.erb +0 -6
  328. data/previews/docs/beta_subhead_preview/without_border.html.erb +0 -8
  329. data/previews/docs/beta_subhead_preview.rb +0 -15
  330. data/previews/docs/beta_text_preview/default.html.erb +0 -2
  331. data/previews/docs/beta_text_preview.rb +0 -7
  332. data/previews/docs/beta_timeline_item_preview/default.html.erb +0 -7
  333. data/previews/docs/beta_timeline_item_preview.rb +0 -7
  334. data/previews/docs/beta_truncate_preview/advanced_multiple_items.html.erb +0 -9
  335. data/previews/docs/beta_truncate_preview/default.html.erb +0 -1
  336. data/previews/docs/beta_truncate_preview/expand_on_hover_or_focus.html.erb +0 -6
  337. data/previews/docs/beta_truncate_preview/max_widths.html.erb +0 -5
  338. data/previews/docs/beta_truncate_preview/max_widths_on_new_lines.html.erb +0 -11
  339. data/previews/docs/beta_truncate_preview/multiple_items.html.erb +0 -6
  340. data/previews/docs/beta_truncate_preview.rb +0 -17
  341. data/previews/docs/blankslate_component_preview/action_button.html.erb +0 -8
  342. data/previews/docs/blankslate_component_preview/basic.html.erb +0 -4
  343. data/previews/docs/blankslate_component_preview/custom_content.html.erb +0 -5
  344. data/previews/docs/blankslate_component_preview/icon.html.erb +0 -5
  345. data/previews/docs/blankslate_component_preview/link.html.erb +0 -7
  346. data/previews/docs/blankslate_component_preview/loading.html.erb +0 -6
  347. data/previews/docs/blankslate_component_preview/variations.html.erb +0 -8
  348. data/previews/docs/blankslate_component_preview.rb +0 -19
  349. data/previews/docs/box_preview/color_and_padding.html.erb +0 -1
  350. data/previews/docs/box_preview/default.html.erb +0 -1
  351. data/previews/docs/box_preview.rb +0 -9
  352. data/previews/docs/button_component_preview/block.html.erb +0 -2
  353. data/previews/docs/button_component_preview/schemes.html.erb +0 -6
  354. data/previews/docs/button_component_preview/sizes.html.erb +0 -2
  355. data/previews/docs/button_component_preview/with_dropdown_caret.html.erb +0 -3
  356. data/previews/docs/button_component_preview/with_leading_and_trailing_visuals.html.erb +0 -5
  357. data/previews/docs/button_component_preview/with_leading_visual.html.erb +0 -4
  358. data/previews/docs/button_component_preview/with_tooltip.html.erb +0 -4
  359. data/previews/docs/button_component_preview/with_trailing_visual.html.erb +0 -4
  360. data/previews/docs/button_component_preview.rb +0 -21
  361. data/previews/docs/dropdown_preview/customizing_menu_items.html.erb +0 -11
  362. data/previews/docs/dropdown_preview/customizing_the_button.html.erb +0 -12
  363. data/previews/docs/dropdown_preview/default.html.erb +0 -11
  364. data/previews/docs/dropdown_preview/menu_as_list.html.erb +0 -13
  365. data/previews/docs/dropdown_preview/with_caret.html.erb +0 -12
  366. data/previews/docs/dropdown_preview/with_direction.html.erb +0 -12
  367. data/previews/docs/dropdown_preview/with_dividers.html.erb +0 -16
  368. data/previews/docs/dropdown_preview.rb +0 -19
  369. data/previews/docs/hellip_button_preview/default.html.erb +0 -1
  370. data/previews/docs/hellip_button_preview/inline.html.erb +0 -1
  371. data/previews/docs/hellip_button_preview/styling_the_button.html.erb +0 -1
  372. data/previews/docs/hellip_button_preview.rb +0 -11
  373. data/previews/docs/icon_button_preview/custom_tooltip_direction.html.erb +0 -2
  374. data/previews/docs/icon_button_preview/default.html.erb +0 -2
  375. data/previews/docs/icon_button_preview/in_a_borderbox.html.erb +0 -7
  376. data/previews/docs/icon_button_preview/schemes.html.erb +0 -3
  377. data/previews/docs/icon_button_preview/with_an_aria_description.html.erb +0 -1
  378. data/previews/docs/icon_button_preview.rb +0 -15
  379. data/previews/docs/label_component_preview/inline.html.erb +0 -2
  380. data/previews/docs/label_component_preview/schemes.html.erb +0 -10
  381. data/previews/docs/label_component_preview/sizes.html.erb +0 -2
  382. data/previews/docs/label_component_preview.rb +0 -11
  383. data/previews/docs/layout_component_preview/default.html.erb +0 -4
  384. data/previews/docs/layout_component_preview/left_sidebar.html.erb +0 -4
  385. data/previews/docs/layout_component_preview.rb +0 -9
  386. data/previews/docs/link_component_preview/default.html.erb +0 -1
  387. data/previews/docs/link_component_preview/muted.html.erb +0 -1
  388. data/previews/docs/link_component_preview/schemes.html.erb +0 -2
  389. data/previews/docs/link_component_preview/with_tooltip.html.erb +0 -4
  390. data/previews/docs/link_component_preview/without_underline.html.erb +0 -1
  391. data/previews/docs/link_component_preview.rb +0 -15
  392. data/previews/docs/local_time_preview/all_the_options.html.erb +0 -1
  393. data/previews/docs/local_time_preview/default.html.erb +0 -1
  394. data/previews/docs/local_time_preview/with_initial_content.html.erb +0 -4
  395. data/previews/docs/local_time_preview.rb +0 -11
  396. data/previews/docs/markdown_preview/default.html.erb +0 -260
  397. data/previews/docs/markdown_preview.rb +0 -7
  398. data/previews/docs/menu_component_preview/default.html.erb +0 -17
  399. data/previews/docs/menu_component_preview.rb +0 -7
  400. data/previews/docs/navigation_tab_component_preview/default.html.erb +0 -6
  401. data/previews/docs/navigation_tab_component_preview/inside_a_list.html.erb +0 -3
  402. data/previews/docs/navigation_tab_component_preview/with_custom_html.html.erb +0 -5
  403. data/previews/docs/navigation_tab_component_preview/with_icons_and_counters.html.erb +0 -13
  404. data/previews/docs/navigation_tab_component_preview.rb +0 -13
  405. data/previews/docs/octicon_component_preview/default.html.erb +0 -2
  406. data/previews/docs/octicon_component_preview/helper.html.erb +0 -1
  407. data/previews/docs/octicon_component_preview/medium.html.erb +0 -1
  408. data/previews/docs/octicon_component_preview.rb +0 -11
  409. data/previews/docs/octicon_symbols_component_preview/symbol_dictionary.html.erb +0 -4
  410. data/previews/docs/octicon_symbols_component_preview.rb +0 -7
  411. data/previews/docs/popover_component_preview/caret_position.html.erb +0 -8
  412. data/previews/docs/popover_component_preview/default.html.erb +0 -8
  413. data/previews/docs/popover_component_preview/large.html.erb +0 -8
  414. data/previews/docs/popover_component_preview/with_multiple_elements_in_the_body.html.erb +0 -11
  415. data/previews/docs/popover_component_preview.rb +0 -13
  416. data/previews/docs/spinner_component_preview/default.html.erb +0 -1
  417. data/previews/docs/spinner_component_preview/large.html.erb +0 -1
  418. data/previews/docs/spinner_component_preview/small.html.erb +0 -1
  419. data/previews/docs/spinner_component_preview.rb +0 -11
  420. data/previews/docs/state_component_preview/default.html.erb +0 -1
  421. data/previews/docs/state_component_preview/schemes.html.erb +0 -4
  422. data/previews/docs/state_component_preview/sizes.html.erb +0 -2
  423. data/previews/docs/state_component_preview.rb +0 -11
  424. data/previews/docs/subhead_component_preview/default.html.erb +0 -8
  425. data/previews/docs/subhead_component_preview/with_actions.html.erb +0 -15
  426. data/previews/docs/subhead_component_preview/with_dangerous_heading.html.erb +0 -8
  427. data/previews/docs/subhead_component_preview/with_long_description.html.erb +0 -6
  428. data/previews/docs/subhead_component_preview/without_border.html.erb +0 -8
  429. data/previews/docs/subhead_component_preview.rb +0 -15
  430. data/previews/docs/tab_container_component_preview/default.html.erb +0 -16
  431. data/previews/docs/tab_container_component_preview.rb +0 -7
  432. data/previews/docs/time_ago_component_preview/default.html.erb +0 -1
  433. data/previews/docs/time_ago_component_preview.rb +0 -7
  434. data/previews/docs/timeline_item_component_preview/default.html.erb +0 -7
  435. data/previews/docs/timeline_item_component_preview.rb +0 -7
  436. data/previews/docs/tooltip_preview/default.html.erb +0 -3
  437. data/previews/docs/tooltip_preview/with_a_direction.html.erb +0 -3
  438. data/previews/docs/tooltip_preview/with_an_alignment.html.erb +0 -3
  439. data/previews/docs/tooltip_preview/without_a_delay.html.erb +0 -3
  440. data/previews/docs/tooltip_preview/wrapping_another_component.html.erb +0 -5
  441. data/previews/docs/tooltip_preview.rb +0 -15
  442. data/previews/docs/truncate_preview/custom_size.html.erb +0 -1
  443. data/previews/docs/truncate_preview/default.html.erb +0 -3
  444. data/previews/docs/truncate_preview/expandable.html.erb +0 -1
  445. data/previews/docs/truncate_preview/inline.html.erb +0 -1
  446. data/previews/docs/truncate_preview/with_html_content.html.erb +0 -3
  447. data/previews/docs/truncate_preview.rb +0 -15
data/app/components/yattho/alpha/segmented_control.css CHANGED
@@ -1,164 +1 @@
1
- /* SegmentedControl */
2
-
3
- .SegmentedControl {
4
- display: inline-flex;
5
- list-style: none;
6
- background-color: var(--color-segmented-control-bg);
7
- border-radius: var(--yattho-borderRadius-medium, 6px);
8
- box-shadow: var(--yattho-borderInset-thin, inset 0 0 0 max(1px, 0.0625rem)) var(--color-border-default);
9
- }
10
-
11
- .SegmentedControl-item {
12
- position: relative;
13
- display: inline-flex;
14
- border: var(--yattho-borderWidth-thin, max(1px, 0.0625rem)) solid transparent;
15
- border-radius: var(--yattho-borderRadius-medium, 6px);
16
- padding: var(--yattho-control-xsmall-paddingInline-condensed, 4px);
17
-
18
- /* Selected ---------------------------------------- */
19
- }
20
-
21
- .SegmentedControl-item.SegmentedControl-item--selected {
22
- background-color: var(--color-btn-bg);
23
- border-color: var(--color-segmented-control-button-selected-border);
24
- }
25
-
26
- .SegmentedControl-item.SegmentedControl-item--selected .Button {
27
- font-weight: var(--base-text-weight-semibold, 600);
28
- }
29
-
30
- .SegmentedControl-item.SegmentedControl-item--selected .Button:hover {
31
- background-color: transparent;
32
- }
33
-
34
- .SegmentedControl-item.SegmentedControl-item--selected::before {
35
- border-color: transparent;
36
- }
37
-
38
- .SegmentedControl-item.SegmentedControl-item--selected + .SegmentedControl-item::before {
39
- border-color: transparent;
40
- }
41
-
42
- /* renders a visibly hidden "copy" of the text in bold, reserving box space for when text becomes bold on selected */
43
-
44
- .SegmentedControl-item .Button-label[data-content]::before {
45
- display: block;
46
- height: 0;
47
- font-weight: var(--base-text-weight-semibold, 600);
48
- visibility: hidden;
49
- content: attr(data-content);
50
- }
51
-
52
- /* Separator lines */
53
-
54
- .SegmentedControl-item::before {
55
- position: absolute;
56
- inset: 0 0 0 -1px;
57
- margin-top: var(--yattho-control-medium-paddingBlock, 6px);
58
- margin-bottom: var(--yattho-control-medium-paddingBlock, 6px);
59
- content: '';
60
- border-left: var(--yattho-borderWidth-thin, max(1px, 0.0625rem)) solid var(--color-border-default);
61
- }
62
-
63
- /* Button ----------------------------------------- */
64
-
65
- .SegmentedControl-item .Button {
66
- border: 0;
67
- font-weight: var(--base-text-weight-normal, 400);
68
- transition: none;
69
- color: var(--color-btn-text);
70
- }
71
-
72
- .SegmentedControl-item .Button:focus-visible {
73
- outline-offset: calc(var(--yattho-control-xsmall-paddingInline-condensed, 4px) - var(--yattho-borderWidth-thin, 1px));
74
- border-radius: calc(var(--yattho-borderRadius-medium, 6px) - 5px);
75
- }
76
-
77
- .SegmentedControl-item .Button--small {
78
- height: calc(var(--yattho-control-small-size, 28px) - var(--yattho-control-xsmall-paddingInline-condensed, 4px) * 2 - var(--yattho-borderWidth-thin, 1px) * 2);
79
- padding: 0 calc(var(--yattho-control-small-paddingInline-condensed, 8px) - var(--yattho-control-xsmall-paddingInline-condensed, 4px));
80
- }
81
-
82
- .SegmentedControl-item .Button--small.Button--iconOnly {
83
- width: calc(var(--yattho-control-medium-size, 32px) - var(--yattho-control-xsmall-paddingInline-condensed, 4px) * 2 - var(--yattho-borderWidth-thin, 1px) * 2);
84
- }
85
-
86
- .SegmentedControl-item .Button--small.Button--iconOnly::before {
87
- position: absolute;
88
- top: 50%;
89
- left: 50%;
90
- width: 100%;
91
- height: 100%;
92
- min-height: var(--yattho-control-medium-size, 32px);
93
- content: "";
94
- transform: translateX(-50%) translateY(-50%);
95
- min-width: var(--yattho-control-medium-size, 32px);
96
- }
97
-
98
- .SegmentedControl-item .Button--medium {
99
- height: calc(var(--yattho-control-medium-size, 32px) - var(--yattho-control-xsmall-paddingInline-condensed, 4px) * 2 - var(--yattho-borderWidth-thin, 1px) * 2);
100
- padding: 0 calc(var(--yattho-control-medium-paddingInline-normal, 12px) - var(--yattho-control-xsmall-paddingInline-condensed, 4px));
101
- }
102
-
103
- .SegmentedControl-item .Button--medium.Button--iconOnly {
104
- width: calc(var(--yattho-control-medium-size, 32px) - var(--yattho-control-xsmall-paddingInline-condensed, 4px) * 2 - var(--yattho-borderWidth-thin, 1px) * 2);
105
- }
106
-
107
- .SegmentedControl-item .Button--medium.Button--iconOnly::before {
108
- position: absolute;
109
- top: 50%;
110
- left: 50%;
111
- width: 100%;
112
- height: 100%;
113
- min-height: var(--yattho-control-medium-size, 32px);
114
- content: "";
115
- transform: translateX(-50%) translateY(-50%);
116
- min-width: var(--yattho-control-medium-size, 32px);
117
- }
118
-
119
- .SegmentedControl-item .Button--large {
120
- height: calc(var(--yattho-control-large-size, 40px) - var(--yattho-control-xsmall-paddingInline-condensed, 4px) * 2 - var(--yattho-borderWidth-thin, 1px) * 2);
121
- padding: 0 calc(var(--yattho-control-large-paddingInline-spacious, 16px) - var(--yattho-control-xsmall-paddingInline-condensed, 4px));
122
- }
123
-
124
- .SegmentedControl-item .Button--large.Button--iconOnly {
125
- width: calc(var(--yattho-control-large-size, 40px) - var(--yattho-control-xsmall-paddingInline-condensed, 4px) * 2 - var(--yattho-borderWidth-thin, 1px) * 2);
126
- }
127
-
128
- .SegmentedControl-item .Button--large.Button--iconOnly::before {
129
- position: absolute;
130
- top: 50%;
131
- left: 50%;
132
- width: 100%;
133
- height: 100%;
134
- min-height: var(--yattho-control-large-size, 40px);
135
- content: "";
136
- transform: translateX(-50%) translateY(-50%);
137
- min-width: var(--yattho-control-large-size, 40px);
138
- }
139
-
140
- .SegmentedControl-item .Button--iconOnly {
141
- padding: initial;
142
- }
143
-
144
- .SegmentedControl-item .Button--invisible.Button--invisible-noVisuals .Button-label {
145
- color: var(--color-btn-text);
146
- }
147
-
148
- /* fullWidth */
149
-
150
- .SegmentedControl--fullWidth {
151
- display: flex;
152
- }
153
-
154
- .SegmentedControl--fullWidth .SegmentedControl-item {
155
- flex: 1;
156
- justify-content: center;
157
- }
158
-
159
- /* is .Button-withTooltip used anywhere? can't find use of it */
160
-
161
- .SegmentedControl--fullWidth .Button--iconOnly,
162
- .SegmentedControl--fullWidth .Button-withTooltip {
163
- width: 100%;
164
- }
1
+ .SegmentedControl{background-color:var(--color-segmented-control-bg);border-radius:var(--yattho-borderRadius-medium,6px);box-shadow:var(--yattho-borderInset-thin,inset 0 0 0 max(1px,.0625rem)) var(--color-border-default);display:inline-flex;list-style:none}.SegmentedControl-item{border:var(--yattho-borderWidth-thin,max(1px,.0625rem)) solid #0000;border-radius:var(--yattho-borderRadius-medium,6px);display:inline-flex;padding:var(--yattho-control-xsmall-paddingInline-condensed,4px);position:relative}.SegmentedControl-item.SegmentedControl-item--selected{background-color:var(--color-btn-bg);border-color:var(--color-segmented-control-button-selected-border)}.SegmentedControl-item.SegmentedControl-item--selected .Button{font-weight:var(--base-text-weight-semibold,600)}.SegmentedControl-item.SegmentedControl-item--selected .Button:hover{background-color:initial}.SegmentedControl-item.SegmentedControl-item--selected+.SegmentedControl-item:before,.SegmentedControl-item.SegmentedControl-item--selected:before{border-color:#0000}.SegmentedControl-item .Button-label[data-content]:before{content:attr(data-content);display:block;font-weight:var(--base-text-weight-semibold,600);height:0;visibility:hidden}.SegmentedControl-item:before{border-left:var(--yattho-borderWidth-thin,max(1px,.0625rem)) solid var(--color-border-default);content:"";inset:0 0 0 -1px;margin-bottom:var(--yattho-control-medium-paddingBlock,6px);margin-top:var(--yattho-control-medium-paddingBlock,6px);position:absolute}.SegmentedControl-item .Button{border:0;color:var(--color-btn-text);font-weight:var(--base-text-weight-normal,400);transition:none}.SegmentedControl-item .Button:focus-visible{border-radius:calc(var(--yattho-borderRadius-medium, 6px) - 5px);outline-offset:calc(var(--yattho-control-xsmall-paddingInline-condensed, 4px) - var(--yattho-borderWidth-thin, 1px))}.SegmentedControl-item .Button--small{height:calc(var(--yattho-control-small-size, 28px) - var(--yattho-control-xsmall-paddingInline-condensed, 4px)*2 - var(--yattho-borderWidth-thin, 1px)*2);padding:0 calc(var(--yattho-control-small-paddingInline-condensed, 8px) - var(--yattho-control-xsmall-paddingInline-condensed, 4px))}.SegmentedControl-item .Button--small.Button--iconOnly{width:calc(var(--yattho-control-medium-size, 32px) - var(--yattho-control-xsmall-paddingInline-condensed, 4px)*2 - var(--yattho-borderWidth-thin, 1px)*2)}.SegmentedControl-item .Button--small.Button--iconOnly:before{content:"";height:100%;left:50%;min-height:var(--yattho-control-medium-size,32px);min-width:var(--yattho-control-medium-size,32px);position:absolute;top:50%;transform:translateX(-50%) translateY(-50%);width:100%}.SegmentedControl-item .Button--medium{height:calc(var(--yattho-control-medium-size, 32px) - var(--yattho-control-xsmall-paddingInline-condensed, 4px)*2 - var(--yattho-borderWidth-thin, 1px)*2);padding:0 calc(var(--yattho-control-medium-paddingInline-normal, 12px) - var(--yattho-control-xsmall-paddingInline-condensed, 4px))}.SegmentedControl-item .Button--medium.Button--iconOnly{width:calc(var(--yattho-control-medium-size, 32px) - var(--yattho-control-xsmall-paddingInline-condensed, 4px)*2 - var(--yattho-borderWidth-thin, 1px)*2)}.SegmentedControl-item .Button--medium.Button--iconOnly:before{content:"";height:100%;left:50%;min-height:var(--yattho-control-medium-size,32px);min-width:var(--yattho-control-medium-size,32px);position:absolute;top:50%;transform:translateX(-50%) translateY(-50%);width:100%}.SegmentedControl-item .Button--large{height:calc(var(--yattho-control-large-size, 40px) - var(--yattho-control-xsmall-paddingInline-condensed, 4px)*2 - var(--yattho-borderWidth-thin, 1px)*2);padding:0 calc(var(--yattho-control-large-paddingInline-spacious, 16px) - var(--yattho-control-xsmall-paddingInline-condensed, 4px))}.SegmentedControl-item .Button--large.Button--iconOnly{width:calc(var(--yattho-control-large-size, 40px) - var(--yattho-control-xsmall-paddingInline-condensed, 4px)*2 - var(--yattho-borderWidth-thin, 1px)*2)}.SegmentedControl-item .Button--large.Button--iconOnly:before{content:"";height:100%;left:50%;min-height:var(--yattho-control-large-size,40px);min-width:var(--yattho-control-large-size,40px);position:absolute;top:50%;transform:translateX(-50%) translateY(-50%);width:100%}.SegmentedControl-item .Button--iconOnly{padding:initial}.SegmentedControl-item .Button--invisible.Button--invisible-noVisuals .Button-label{color:var(--color-btn-text)}.SegmentedControl--fullWidth{display:flex}.SegmentedControl--fullWidth .SegmentedControl-item{flex:1;justify-content:center}.SegmentedControl--fullWidth .Button--iconOnly,.SegmentedControl--fullWidth .Button-withTooltip{width:100%}
data/app/components/yattho/alpha/segmented_control.css.json CHANGED
@@ -1 +1 @@
1
- {"name":"alpha/segmented_control","selectors":[".SegmentedControl",".SegmentedControl-item",".SegmentedControl-item.SegmentedControl-item--selected",".SegmentedControl-item.SegmentedControl-item--selected .Button",".SegmentedControl-item.SegmentedControl-item--selected .Button:hover",".SegmentedControl-item.SegmentedControl-item--selected::before",".SegmentedControl-item.SegmentedControl-item--selected + .SegmentedControl-item::before",".SegmentedControl-item .Button-label[data-content]::before",".SegmentedControl-item::before",".SegmentedControl-item .Button",".SegmentedControl-item .Button:focus-visible",".SegmentedControl-item .Button--small",".SegmentedControl-item .Button--small.Button--iconOnly",".SegmentedControl-item .Button--small.Button--iconOnly::before",".SegmentedControl-item .Button--medium",".SegmentedControl-item .Button--medium.Button--iconOnly",".SegmentedControl-item .Button--medium.Button--iconOnly::before",".SegmentedControl-item .Button--large",".SegmentedControl-item .Button--large.Button--iconOnly",".SegmentedControl-item .Button--large.Button--iconOnly::before",".SegmentedControl-item .Button--iconOnly",".SegmentedControl-item .Button--invisible.Button--invisible-noVisuals .Button-label",".SegmentedControl--fullWidth",".SegmentedControl--fullWidth .SegmentedControl-item",".SegmentedControl--fullWidth .Button--iconOnly","\n .SegmentedControl--fullWidth .Button-withTooltip"]}
1
+ {"name":"alpha/segmented_control","selectors":[".SegmentedControl",".SegmentedControl-item",".SegmentedControl-item.SegmentedControl-item--selected",".SegmentedControl-item.SegmentedControl-item--selected .Button",".SegmentedControl-item.SegmentedControl-item--selected .Button:hover",".SegmentedControl-item.SegmentedControl-item--selected+.SegmentedControl-item:before",".SegmentedControl-item.SegmentedControl-item--selected:before",".SegmentedControl-item .Button-label[data-content]:before",".SegmentedControl-item:before",".SegmentedControl-item .Button",".SegmentedControl-item .Button:focus-visible",".SegmentedControl-item .Button--small",".SegmentedControl-item .Button--small.Button--iconOnly",".SegmentedControl-item .Button--small.Button--iconOnly:before",".SegmentedControl-item .Button--medium",".SegmentedControl-item .Button--medium.Button--iconOnly",".SegmentedControl-item .Button--medium.Button--iconOnly:before",".SegmentedControl-item .Button--large",".SegmentedControl-item .Button--large.Button--iconOnly",".SegmentedControl-item .Button--large.Button--iconOnly:before",".SegmentedControl-item .Button--iconOnly",".SegmentedControl-item .Button--invisible.Button--invisible-noVisuals .Button-label",".SegmentedControl--fullWidth",".SegmentedControl--fullWidth .SegmentedControl-item",".SegmentedControl--fullWidth .Button--iconOnly",".SegmentedControl--fullWidth .Button-withTooltip"]}
data/app/components/yattho/alpha/segmented_control.css.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"sources":["segmented_control.pcss","<no source>"],"names":[],"mappings":"AAAA,qBAAqB;;AAErB;EACE,oBAAoB;EACpB,gBAAgB;EAChB,mDAAmD;EACnD,qDAAqD;EACrD,uGAAuG;AACzG;;AAEA;EACE,kBAAkB;EAClB,oBAAoB;EACpB,6EAA6E;EAC7E,qDAAqD;EACrD,kEAAkE;;EAElE,sDAAsD;AAoGxD;;AAnGE;IACE,qCAAqC;IACrC,mEAAmE;EAiBrE;;AAfE;MACE,kDAAkD;IAKpD;;AAHE;QACE,6BAA6B;MAC/B;;AAGF;MACE,yBAAyB;IAC3B;;AAEA;MACE,yBAAyB;IAC3B;;AAGF,oHAAoH;;AACpH;IACE,cAAc;IACd,SAAS;IACT,kDAAkD;IAClD,kBAAkB;IAClB,2BAA2B;EAC7B;;AAEA,oBAAoB;;AACpB;IACE,kBAAkB;IAClB,iBAAiB;IACjB,0DAA0D;IAC1D,6DAA6D;IAC7D,WAAW;IACX,kGAAkG;EACpG;;AAEA,qDAAqD;;AACrD;IACE,SAAS;IACT,gDAAgD;IAChD,gBAAgB;IAChB,4BAA4B;EAM9B;;AAJE;MACE,qHAAqH;MACrH,iEAAiE;IACnE;;AAGF;IACE,8JAA8J;IAC9J,qIAAqI;EASvI;;AAPE;MACE,8JAA8J;IAKhK;;AAFI;EC/ER,mBAAA;EAAA,SAAA;EAAA,UAAA;EAAA,YAAA;EAAA,aAAA;EAAA,oDAAA;EAAA,YAAA;EAAA,6CAAA;EAAA;AD+E8G;;AAK5G;IACE,+JAA+J;IAC/J,oIAAoI;EAStI;;AAPE;MACE,8JAA8J;IAKhK;;AAFI;EC5FR,mBAAA;EAAA,SAAA;EAAA,UAAA;EAAA,YAAA;EAAA,aAAA;EAAA,oDAAA;EAAA,YAAA;EAAA,6CAAA;EAAA;AD4F8G;;AAK5G;IACE,8JAA8J;IAC9J,qIAAqI;EASvI;;AAPE;MACE,6JAA6J;IAK/J;;AAFI;ECzGR,mBAAA;EAAA,SAAA;EAAA,UAAA;EAAA,YAAA;EAAA,aAAA;EAAA,mDAAA;EAAA,YAAA;EAAA,6CAAA;EAAA;ADyG4G;;AAK1G;IACE,gBAAgB;EAClB;;AAEA;IACE,4BAA4B;EAC9B;;AAGF,cAAc;;AACd;EACE,aAAa;AAYf;;AAVE;IACE,OAAO;IACP,uBAAuB;EACzB;;AAEA,+DAA+D;;AAC/D;;IAEE,WAAW;EACb","file":"segmented_control.css","sourcesContent":["/* SegmentedControl */\n\n.SegmentedControl {\n display: inline-flex;\n list-style: none;\n background-color: var(--color-segmented-control-bg);\n border-radius: var(--yattho-borderRadius-medium, 6px);\n box-shadow: var(--yattho-borderInset-thin, inset 0 0 0 max(1px, 0.0625rem)) var(--color-border-default);\n}\n\n.SegmentedControl-item {\n position: relative;\n display: inline-flex;\n border: var(--yattho-borderWidth-thin, max(1px, 0.0625rem)) solid transparent;\n border-radius: var(--yattho-borderRadius-medium, 6px);\n padding: var(--yattho-control-xsmall-paddingInline-condensed, 4px);\n\n /* Selected ---------------------------------------- */\n &.SegmentedControl-item--selected {\n background-color: var(--color-btn-bg);\n border-color: var(--color-segmented-control-button-selected-border);\n\n & .Button {\n font-weight: var(--base-text-weight-semibold, 600);\n\n &:hover {\n background-color: transparent;\n }\n }\n\n &::before {\n border-color: transparent;\n }\n\n & + .SegmentedControl-item::before {\n border-color: transparent;\n }\n }\n\n /* renders a visibly hidden \"copy\" of the text in bold, reserving box space for when text becomes bold on selected */\n & .Button-label[data-content]::before {\n display: block;\n height: 0;\n font-weight: var(--base-text-weight-semibold, 600);\n visibility: hidden;\n content: attr(data-content);\n }\n\n /* Separator lines */\n &::before {\n position: absolute;\n inset: 0 0 0 -1px;\n margin-top: var(--yattho-control-medium-paddingBlock, 6px);\n margin-bottom: var(--yattho-control-medium-paddingBlock, 6px);\n content: '';\n border-left: var(--yattho-borderWidth-thin, max(1px, 0.0625rem)) solid var(--color-border-default);\n }\n\n /* Button ----------------------------------------- */\n & .Button {\n border: 0;\n font-weight: var(--base-text-weight-normal, 400);\n transition: none;\n color: var(--color-btn-text);\n\n &:focus-visible {\n outline-offset: calc(var(--yattho-control-xsmall-paddingInline-condensed, 4px) - var(--yattho-borderWidth-thin, 1px));\n border-radius: calc(var(--yattho-borderRadius-medium, 6px) - 5px);\n }\n }\n\n & .Button--small {\n height: calc(var(--yattho-control-small-size, 28px) - var(--yattho-control-xsmall-paddingInline-condensed, 4px) * 2 - var(--yattho-borderWidth-thin, 1px) * 2);\n padding: 0 calc(var(--yattho-control-small-paddingInline-condensed, 8px) - var(--yattho-control-xsmall-paddingInline-condensed, 4px));\n\n &.Button--iconOnly {\n width: calc(var(--yattho-control-medium-size, 32px) - var(--yattho-control-xsmall-paddingInline-condensed, 4px) * 2 - var(--yattho-borderWidth-thin, 1px) * 2);\n\n &::before {\n @mixin minTouchTarget var(--yattho-control-medium-size, 32px), var(--yattho-control-medium-size, 32px);\n }\n }\n }\n\n & .Button--medium {\n height: calc(var(--yattho-control-medium-size, 32px) - var(--yattho-control-xsmall-paddingInline-condensed, 4px) * 2 - var(--yattho-borderWidth-thin, 1px) * 2);\n padding: 0 calc(var(--yattho-control-medium-paddingInline-normal, 12px) - var(--yattho-control-xsmall-paddingInline-condensed, 4px));\n\n &.Button--iconOnly {\n width: calc(var(--yattho-control-medium-size, 32px) - var(--yattho-control-xsmall-paddingInline-condensed, 4px) * 2 - var(--yattho-borderWidth-thin, 1px) * 2);\n\n &::before {\n @mixin minTouchTarget var(--yattho-control-medium-size, 32px), var(--yattho-control-medium-size, 32px);\n }\n }\n }\n\n & .Button--large {\n height: calc(var(--yattho-control-large-size, 40px) - var(--yattho-control-xsmall-paddingInline-condensed, 4px) * 2 - var(--yattho-borderWidth-thin, 1px) * 2);\n padding: 0 calc(var(--yattho-control-large-paddingInline-spacious, 16px) - var(--yattho-control-xsmall-paddingInline-condensed, 4px));\n\n &.Button--iconOnly {\n width: calc(var(--yattho-control-large-size, 40px) - var(--yattho-control-xsmall-paddingInline-condensed, 4px) * 2 - var(--yattho-borderWidth-thin, 1px) * 2);\n\n &::before {\n @mixin minTouchTarget var(--yattho-control-large-size, 40px), var(--yattho-control-large-size, 40px);\n }\n }\n }\n\n & .Button--iconOnly {\n padding: initial;\n }\n\n & .Button--invisible.Button--invisible-noVisuals .Button-label {\n color: var(--color-btn-text);\n }\n}\n\n/* fullWidth */\n.SegmentedControl--fullWidth {\n display: flex;\n\n & .SegmentedControl-item {\n flex: 1;\n justify-content: center;\n }\n\n /* is .Button-withTooltip used anywhere? can't find use of it */\n & .Button--iconOnly,\n & .Button-withTooltip {\n width: 100%;\n }\n}",null]}
1
+ {"version":3,"sources":["segmented_control.pcss","<no source>"],"names":[],"mappings":"AAEA,kBAGE,kDAAmD,CACnD,mDAAqD,CACrD,mGAAuG,CAJvG,mBAAoB,CACpB,eAIF,CAEA,uBAGE,mEAA6E,CAC7E,mDAAqD,CAFrD,mBAAoB,CAGpB,gEAAkE,CAJlE,iBA0GF,CAnGE,uDACE,oCAAqC,CACrC,kEAiBF,CAfE,+DACE,gDAKF,CAHE,qEACE,wBACF,CAOF,mJACE,kBACF,CAIF,0DAKE,0BAA2B,CAJ3B,aAAc,CAEd,gDAAkD,CADlD,QAAS,CAET,iBAEF,CAGA,8BAME,8FAAkG,CADlG,UAAW,CAHX,gBAAiB,CAEjB,2DAA6D,CAD7D,wDAA0D,CAF1D,iBAMF,CAGA,+BACE,QAAS,CAGT,2BAA4B,CAF5B,8CAAgD,CAChD,eAOF,CAJE,6CAEE,gEAAiE,CADjE,oHAEF,CAGF,sCACE,yJAA8J,CAC9J,oIASF,CAPE,uDACE,yJAKF,CAFI,8DC/ER,WAAA,YAAA,SAAA,kDAAA,iDAAA,kBAAA,QAAA,4CAAA,UD+E8G,CAK5G,uCACE,0JAA+J,CAC/J,mIASF,CAPE,wDACE,yJAKF,CAFI,+DC5FR,WAAA,YAAA,SAAA,kDAAA,iDAAA,kBAAA,QAAA,4CAAA,UD4F8G,CAK5G,sCACE,yJAA8J,CAC9J,oIASF,CAPE,uDACE,wJAKF,CAFI,8DCzGR,WAAA,YAAA,SAAA,iDAAA,gDAAA,kBAAA,QAAA,4CAAA,UDyG4G,CAK1G,yCACE,eACF,CAEA,oFACE,2BACF,CAIF,6BACE,YAYF,CAVE,oDACE,MAAO,CACP,sBACF,CAGA,gGAEE,UACF","file":"segmented_control.css","sourcesContent":["/* SegmentedControl */\n\n.SegmentedControl {\n display: inline-flex;\n list-style: none;\n background-color: var(--color-segmented-control-bg);\n border-radius: var(--yattho-borderRadius-medium, 6px);\n box-shadow: var(--yattho-borderInset-thin, inset 0 0 0 max(1px, 0.0625rem)) var(--color-border-default);\n}\n\n.SegmentedControl-item {\n position: relative;\n display: inline-flex;\n border: var(--yattho-borderWidth-thin, max(1px, 0.0625rem)) solid transparent;\n border-radius: var(--yattho-borderRadius-medium, 6px);\n padding: var(--yattho-control-xsmall-paddingInline-condensed, 4px);\n\n /* Selected ---------------------------------------- */\n &.SegmentedControl-item--selected {\n background-color: var(--color-btn-bg);\n border-color: var(--color-segmented-control-button-selected-border);\n\n & .Button {\n font-weight: var(--base-text-weight-semibold, 600);\n\n &:hover {\n background-color: transparent;\n }\n }\n\n &::before {\n border-color: transparent;\n }\n\n & + .SegmentedControl-item::before {\n border-color: transparent;\n }\n }\n\n /* renders a visibly hidden \"copy\" of the text in bold, reserving box space for when text becomes bold on selected */\n & .Button-label[data-content]::before {\n display: block;\n height: 0;\n font-weight: var(--base-text-weight-semibold, 600);\n visibility: hidden;\n content: attr(data-content);\n }\n\n /* Separator lines */\n &::before {\n position: absolute;\n inset: 0 0 0 -1px;\n margin-top: var(--yattho-control-medium-paddingBlock, 6px);\n margin-bottom: var(--yattho-control-medium-paddingBlock, 6px);\n content: '';\n border-left: var(--yattho-borderWidth-thin, max(1px, 0.0625rem)) solid var(--color-border-default);\n }\n\n /* Button ----------------------------------------- */\n & .Button {\n border: 0;\n font-weight: var(--base-text-weight-normal, 400);\n transition: none;\n color: var(--color-btn-text);\n\n &:focus-visible {\n outline-offset: calc(var(--yattho-control-xsmall-paddingInline-condensed, 4px) - var(--yattho-borderWidth-thin, 1px));\n border-radius: calc(var(--yattho-borderRadius-medium, 6px) - 5px);\n }\n }\n\n & .Button--small {\n height: calc(var(--yattho-control-small-size, 28px) - var(--yattho-control-xsmall-paddingInline-condensed, 4px) * 2 - var(--yattho-borderWidth-thin, 1px) * 2);\n padding: 0 calc(var(--yattho-control-small-paddingInline-condensed, 8px) - var(--yattho-control-xsmall-paddingInline-condensed, 4px));\n\n &.Button--iconOnly {\n width: calc(var(--yattho-control-medium-size, 32px) - var(--yattho-control-xsmall-paddingInline-condensed, 4px) * 2 - var(--yattho-borderWidth-thin, 1px) * 2);\n\n &::before {\n @mixin minTouchTarget var(--yattho-control-medium-size, 32px), var(--yattho-control-medium-size, 32px);\n }\n }\n }\n\n & .Button--medium {\n height: calc(var(--yattho-control-medium-size, 32px) - var(--yattho-control-xsmall-paddingInline-condensed, 4px) * 2 - var(--yattho-borderWidth-thin, 1px) * 2);\n padding: 0 calc(var(--yattho-control-medium-paddingInline-normal, 12px) - var(--yattho-control-xsmall-paddingInline-condensed, 4px));\n\n &.Button--iconOnly {\n width: calc(var(--yattho-control-medium-size, 32px) - var(--yattho-control-xsmall-paddingInline-condensed, 4px) * 2 - var(--yattho-borderWidth-thin, 1px) * 2);\n\n &::before {\n @mixin minTouchTarget var(--yattho-control-medium-size, 32px), var(--yattho-control-medium-size, 32px);\n }\n }\n }\n\n & .Button--large {\n height: calc(var(--yattho-control-large-size, 40px) - var(--yattho-control-xsmall-paddingInline-condensed, 4px) * 2 - var(--yattho-borderWidth-thin, 1px) * 2);\n padding: 0 calc(var(--yattho-control-large-paddingInline-spacious, 16px) - var(--yattho-control-xsmall-paddingInline-condensed, 4px));\n\n &.Button--iconOnly {\n width: calc(var(--yattho-control-large-size, 40px) - var(--yattho-control-xsmall-paddingInline-condensed, 4px) * 2 - var(--yattho-borderWidth-thin, 1px) * 2);\n\n &::before {\n @mixin minTouchTarget var(--yattho-control-large-size, 40px), var(--yattho-control-large-size, 40px);\n }\n }\n }\n\n & .Button--iconOnly {\n padding: initial;\n }\n\n & .Button--invisible.Button--invisible-noVisuals .Button-label {\n color: var(--color-btn-text);\n }\n}\n\n/* fullWidth */\n.SegmentedControl--fullWidth {\n display: flex;\n\n & .SegmentedControl-item {\n flex: 1;\n justify-content: center;\n }\n\n /* is .Button-withTooltip used anywhere? can't find use of it */\n & .Button--iconOnly,\n & .Button-withTooltip {\n width: 100%;\n }\n}",null]}
data/app/components/yattho/alpha/tab_nav.css CHANGED
@@ -1,106 +1 @@
1
- /* tabnav */
2
-
3
- /* Outer wrapper */
4
-
5
- .tabnav {
6
- margin-top: 0;
7
- margin-bottom: var(--yattho-stack-gap-normal, 16px);
8
- border-bottom: var(--yattho-borderWidth-thin, 1px) solid var(--color-border-default);
9
- }
10
-
11
- .tabnav-tabs {
12
- display: flex;
13
- margin-bottom: calc(var(--yattho-borderWidth-thin, 1px) * -1);
14
- overflow: auto;
15
- }
16
-
17
- .tabnav-tab {
18
- display: inline-block;
19
- flex-shrink: 0;
20
- padding: var(--base-size-8, 8px) var(--yattho-control-medium-paddingInline-spacious, 16px);
21
- font-size: var(--yattho-text-body-size-medium, 14px);
22
- line-height: 23px;
23
- color: var(--color-fg-muted);
24
- text-decoration: none;
25
- background-color: transparent;
26
- border: var(--yattho-borderWidth-thin, 1px) solid transparent;
27
- border-bottom: 0;
28
- transition: color 0.2s cubic-bezier(0.3, 0, 0.5, 1);
29
- }
30
-
31
- .tabnav-tab.selected,
32
- .tabnav-tab[aria-selected='true'],
33
- .tabnav-tab[aria-current]:not([aria-current='false']) {
34
- color: var(--color-fg-default);
35
- background-color: var(--color-canvas-default); /* cover bottom border */
36
- border-color: var(--color-border-default);
37
- border-radius: var(--yattho-borderRadius-medium, 6px) var(--yattho-borderRadius-medium, 6px) 0 0;
38
- }
39
-
40
- .tabnav-tab.selected .octicon, .tabnav-tab[aria-selected='true'] .octicon, .tabnav-tab[aria-current]:not([aria-current='false']) .octicon {
41
- color: inherit;
42
- }
43
-
44
- .tabnav-tab:hover {
45
- color: var(--color-fg-default);
46
- text-decoration: none;
47
- transition-duration: 0.1s;
48
- }
49
-
50
- .tabnav-tab:focus,
51
- .tabnav-tab:focus-visible {
52
- border-radius: var(--yattho-borderRadius-medium, 6px) var(--yattho-borderRadius-medium, 6px) 0 0 !important;
53
- }
54
-
55
- .tabnav-tab:focus,
56
- .tabnav-tab:focus-visible {
57
- outline-offset: -6px;
58
- }
59
-
60
- .tabnav-tab:active {
61
- color: var(--color-fg-muted);
62
- }
63
-
64
- .tabnav-tab .octicon {
65
- margin-right: var(--yattho-control-small-gap, 4px);
66
- color: var(--color-fg-muted);
67
- }
68
-
69
- .tabnav-tab .Counter {
70
- margin-left: var(--yattho-control-small-gap, 4px);
71
- color: inherit;
72
- }
73
-
74
- /* Tabnav extras
75
- **
76
- ** Tabnav extras are non-tab elements that sit in the tabnav. Usually they're
77
- ** inline text or links. */
78
-
79
- .tabnav-extra {
80
- display: inline-block;
81
- padding-top: 10px;
82
- margin-left: 10px;
83
- font-size: var(--yattho-text-body-size-small, 12px);
84
- color: var(--color-fg-muted);
85
- }
86
-
87
- .tabnav-extra > .octicon {
88
- margin-right: 2px;
89
- }
90
-
91
- /* When tabnav-extra are anchors
92
- ** stylelint-disable-next-line selector-no-qualifying-type */
93
-
94
- a.tabnav-extra:hover {
95
- color: var(--color-accent-fg);
96
- text-decoration: none;
97
- }
98
-
99
- /* Tabnav buttons
100
- **
101
- ** For when there are multiple buttons, space them out appropriately. Requires
102
- ** the buttons to be floated or inline-block. */
103
-
104
- .tabnav-btn {
105
- margin-left: var(--yattho-controlStack-medium-gap-condensed, 8px);
106
- }
1
+ .tabnav{border-bottom:var(--yattho-borderWidth-thin,1px) solid var(--color-border-default);margin-bottom:var(--yattho-stack-gap-normal,16px);margin-top:0}.tabnav-tabs{display:flex;margin-bottom:calc(var(--yattho-borderWidth-thin, 1px)*-1);overflow:auto}.tabnav-tab{background-color:initial;border:var(--yattho-borderWidth-thin,1px) solid #0000;border-bottom:0;color:var(--color-fg-muted);display:inline-block;flex-shrink:0;font-size:var(--yattho-text-body-size-medium,14px);line-height:23px;padding:var(--base-size-8,8px) var(--yattho-control-medium-paddingInline-spacious,16px);text-decoration:none;transition:color .2s cubic-bezier(.3,0,.5,1)}.tabnav-tab.selected,.tabnav-tab[aria-current]:not([aria-current=false]),.tabnav-tab[aria-selected=true]{background-color:var(--color-canvas-default);border-color:var(--color-border-default);border-radius:var(--yattho-borderRadius-medium,6px) var(--yattho-borderRadius-medium,6px) 0 0;color:var(--color-fg-default)}.tabnav-tab.selected .octicon,.tabnav-tab[aria-current]:not([aria-current=false]) .octicon,.tabnav-tab[aria-selected=true] .octicon{color:inherit}.tabnav-tab:hover{color:var(--color-fg-default);text-decoration:none;transition-duration:.1s}.tabnav-tab:focus,.tabnav-tab:focus-visible{border-radius:var(--yattho-borderRadius-medium,6px) var(--yattho-borderRadius-medium,6px) 0 0!important}.tabnav-tab:focus,.tabnav-tab:focus-visible{outline-offset:-6px}.tabnav-tab .octicon,.tabnav-tab:active{color:var(--color-fg-muted)}.tabnav-tab .octicon{margin-right:var(--yattho-control-small-gap,4px)}.tabnav-tab .Counter{color:inherit;margin-left:var(--yattho-control-small-gap,4px)}.tabnav-extra{color:var(--color-fg-muted);display:inline-block;font-size:var(--yattho-text-body-size-small,12px);margin-left:10px;padding-top:10px}.tabnav-extra>.octicon{margin-right:2px}a.tabnav-extra:hover{color:var(--color-accent-fg);text-decoration:none}.tabnav-btn{margin-left:var(--yattho-controlStack-medium-gap-condensed,8px)}
data/app/components/yattho/alpha/tab_nav.css.json CHANGED
@@ -1 +1 @@
1
- {"name":"alpha/tab_nav","selectors":[".tabnav",".tabnav-tabs",".tabnav-tab",".tabnav-tab.selected","\n .tabnav-tab[aria-selected='true']","\n .tabnav-tab[aria-current]:not([aria-current='false'])",".tabnav-tab.selected .octicon"," .tabnav-tab[aria-selected='true'] .octicon"," .tabnav-tab[aria-current]:not([aria-current='false']) .octicon",".tabnav-tab:hover",".tabnav-tab:focus","\n .tabnav-tab:focus-visible",".tabnav-tab:active",".tabnav-tab .octicon",".tabnav-tab .Counter",".tabnav-extra",".tabnav-extra > .octicon","a.tabnav-extra:hover",".tabnav-btn"]}
1
+ {"name":"alpha/tab_nav","selectors":[".tabnav",".tabnav-tabs",".tabnav-tab",".tabnav-tab.selected",".tabnav-tab[aria-current]:not([aria-current=false])",".tabnav-tab[aria-selected=true]",".tabnav-tab.selected .octicon",".tabnav-tab[aria-current]:not([aria-current=false]) .octicon",".tabnav-tab[aria-selected=true] .octicon",".tabnav-tab:hover",".tabnav-tab:focus",".tabnav-tab:focus-visible",".tabnav-tab .octicon",".tabnav-tab:active",".tabnav-tab .Counter",".tabnav-extra",".tabnav-extra>.octicon","a.tabnav-extra:hover",".tabnav-btn"]}
data/app/components/yattho/alpha/tab_nav.css.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"sources":["tab_nav.pcss"],"names":[],"mappings":"AAAA,WAAW;;AAEX,kBAAkB;;AAClB;EACE,aAAa;EACb,mDAAmD;EACnD,oFAAoF;AACtF;;AAEA;EACE,aAAa;EACb,6DAA6D;EAC7D,cAAc;AAChB;;AAEA;EACE,qBAAqB;EACrB,cAAc;EACd,0FAA0F;EAC1F,oDAAoD;EACpD,iBAAiB;EACjB,4BAA4B;EAC5B,qBAAqB;EACrB,6BAA6B;EAC7B,6DAA6D;EAC7D,gBAAgB;EAChB,mDAAmD;AAwCrD;;AAtCE;;;IAGE,8BAA8B;IAC9B,6CAA6C,EAAE,wBAAwB;IACvE,yCAAyC;IACzC,gGAAgG;EAKlG;;AAHE;MACE,cAAc;IAChB;;AAGF;IACE,8BAA8B;IAC9B,qBAAqB;IACrB,yBAAyB;EAC3B;;AAEA;;IAEE,2GAA2G;EAE7G;;AAJA;;IAGE,oBAAoB;EACtB;;AAEA;IACE,4BAA4B;EAC9B;;AAEA;IACE,kDAAkD;IAClD,4BAA4B;EAC9B;;AAEA;IACE,iDAAiD;IACjD,cAAc;EAChB;;AAGF;;;0BAG0B;;AAE1B;EACE,qBAAqB;EACrB,iBAAiB;EACjB,iBAAiB;EACjB,mDAAmD;EACnD,4BAA4B;AAK9B;;AAHE;IACE,iBAAiB;EACnB;;AAGF;4DAC4D;;AAC5D;EACE,6BAA6B;EAC7B,qBAAqB;AACvB;;AAEA;;;+CAG+C;;AAE/C;EACE,iEAAiE;AACnE","file":"tab_nav.css","sourcesContent":["/* tabnav */\n\n/* Outer wrapper */\n.tabnav {\n margin-top: 0;\n margin-bottom: var(--yattho-stack-gap-normal, 16px);\n border-bottom: var(--yattho-borderWidth-thin, 1px) solid var(--color-border-default);\n}\n\n.tabnav-tabs {\n display: flex;\n margin-bottom: calc(var(--yattho-borderWidth-thin, 1px) * -1);\n overflow: auto;\n}\n\n.tabnav-tab {\n display: inline-block;\n flex-shrink: 0;\n padding: var(--base-size-8, 8px) var(--yattho-control-medium-paddingInline-spacious, 16px);\n font-size: var(--yattho-text-body-size-medium, 14px);\n line-height: 23px;\n color: var(--color-fg-muted);\n text-decoration: none;\n background-color: transparent;\n border: var(--yattho-borderWidth-thin, 1px) solid transparent;\n border-bottom: 0;\n transition: color 0.2s cubic-bezier(0.3, 0, 0.5, 1);\n\n &.selected,\n &[aria-selected='true'],\n &[aria-current]:not([aria-current='false']) {\n color: var(--color-fg-default);\n background-color: var(--color-canvas-default); /* cover bottom border */\n border-color: var(--color-border-default);\n border-radius: var(--yattho-borderRadius-medium, 6px) var(--yattho-borderRadius-medium, 6px) 0 0;\n\n & .octicon {\n color: inherit;\n }\n }\n\n &:hover {\n color: var(--color-fg-default);\n text-decoration: none;\n transition-duration: 0.1s;\n }\n\n &:focus,\n &:focus-visible {\n border-radius: var(--yattho-borderRadius-medium, 6px) var(--yattho-borderRadius-medium, 6px) 0 0 !important;\n outline-offset: -6px;\n }\n\n &:active {\n color: var(--color-fg-muted);\n }\n\n & .octicon {\n margin-right: var(--yattho-control-small-gap, 4px);\n color: var(--color-fg-muted);\n }\n\n & .Counter {\n margin-left: var(--yattho-control-small-gap, 4px);\n color: inherit;\n }\n}\n\n/* Tabnav extras\n**\n** Tabnav extras are non-tab elements that sit in the tabnav. Usually they're\n** inline text or links. */\n\n.tabnav-extra {\n display: inline-block;\n padding-top: 10px;\n margin-left: 10px;\n font-size: var(--yattho-text-body-size-small, 12px);\n color: var(--color-fg-muted);\n\n & > .octicon {\n margin-right: 2px;\n }\n}\n\n/* When tabnav-extra are anchors\n** stylelint-disable-next-line selector-no-qualifying-type */\na.tabnav-extra:hover {\n color: var(--color-accent-fg);\n text-decoration: none;\n}\n\n/* Tabnav buttons\n**\n** For when there are multiple buttons, space them out appropriately. Requires\n** the buttons to be floated or inline-block. */\n\n.tabnav-btn {\n margin-left: var(--yattho-controlStack-medium-gap-condensed, 8px);\n}"]}
1
+ {"version":3,"sources":["tab_nav.pcss"],"names":[],"mappings":"AAGA,QAGE,kFAAoF,CADpF,iDAAmD,CADnD,YAGF,CAEA,aACE,YAAa,CACb,0DAA6D,CAC7D,aACF,CAEA,YAQE,wBAA6B,CAE7B,qDAAgB,CAAhB,eAAgB,CAJhB,2BAA4B,CAL5B,oBAAqB,CACrB,aAAc,CAEd,kDAAoD,CACpD,gBAAiB,CAFjB,uFAA0F,CAI1F,oBAAqB,CAIrB,4CAwCF,CAtCE,yGAIE,4CAA6C,CAC7C,wCAAyC,CACzC,6FAAgG,CAHhG,6BAQF,CAHE,oIACE,aACF,CAGF,kBACE,6BAA8B,CAC9B,oBAAqB,CACrB,uBACF,CAEA,4CAEE,uGAEF,CAJA,4CAGE,mBACF,CAMA,wCAHE,2BAMF,CAHA,qBACE,gDAEF,CAEA,qBAEE,aAAc,CADd,+CAEF,CAQF,cAKE,2BAA4B,CAJ5B,oBAAqB,CAGrB,iDAAmD,CADnD,gBAAiB,CADjB,gBAQF,CAHE,uBACE,gBACF,CAKF,qBACE,4BAA6B,CAC7B,oBACF,CAOA,YACE,+DACF","file":"tab_nav.css","sourcesContent":["/* tabnav */\n\n/* Outer wrapper */\n.tabnav {\n margin-top: 0;\n margin-bottom: var(--yattho-stack-gap-normal, 16px);\n border-bottom: var(--yattho-borderWidth-thin, 1px) solid var(--color-border-default);\n}\n\n.tabnav-tabs {\n display: flex;\n margin-bottom: calc(var(--yattho-borderWidth-thin, 1px) * -1);\n overflow: auto;\n}\n\n.tabnav-tab {\n display: inline-block;\n flex-shrink: 0;\n padding: var(--base-size-8, 8px) var(--yattho-control-medium-paddingInline-spacious, 16px);\n font-size: var(--yattho-text-body-size-medium, 14px);\n line-height: 23px;\n color: var(--color-fg-muted);\n text-decoration: none;\n background-color: transparent;\n border: var(--yattho-borderWidth-thin, 1px) solid transparent;\n border-bottom: 0;\n transition: color 0.2s cubic-bezier(0.3, 0, 0.5, 1);\n\n &.selected,\n &[aria-selected='true'],\n &[aria-current]:not([aria-current='false']) {\n color: var(--color-fg-default);\n background-color: var(--color-canvas-default); /* cover bottom border */\n border-color: var(--color-border-default);\n border-radius: var(--yattho-borderRadius-medium, 6px) var(--yattho-borderRadius-medium, 6px) 0 0;\n\n & .octicon {\n color: inherit;\n }\n }\n\n &:hover {\n color: var(--color-fg-default);\n text-decoration: none;\n transition-duration: 0.1s;\n }\n\n &:focus,\n &:focus-visible {\n border-radius: var(--yattho-borderRadius-medium, 6px) var(--yattho-borderRadius-medium, 6px) 0 0 !important;\n outline-offset: -6px;\n }\n\n &:active {\n color: var(--color-fg-muted);\n }\n\n & .octicon {\n margin-right: var(--yattho-control-small-gap, 4px);\n color: var(--color-fg-muted);\n }\n\n & .Counter {\n margin-left: var(--yattho-control-small-gap, 4px);\n color: inherit;\n }\n}\n\n/* Tabnav extras\n**\n** Tabnav extras are non-tab elements that sit in the tabnav. Usually they're\n** inline text or links. */\n\n.tabnav-extra {\n display: inline-block;\n padding-top: 10px;\n margin-left: 10px;\n font-size: var(--yattho-text-body-size-small, 12px);\n color: var(--color-fg-muted);\n\n & > .octicon {\n margin-right: 2px;\n }\n}\n\n/* When tabnav-extra are anchors\n** stylelint-disable-next-line selector-no-qualifying-type */\na.tabnav-extra:hover {\n color: var(--color-accent-fg);\n text-decoration: none;\n}\n\n/* Tabnav buttons\n**\n** For when there are multiple buttons, space them out appropriately. Requires\n** the buttons to be floated or inline-block. */\n\n.tabnav-btn {\n margin-left: var(--yattho-controlStack-medium-gap-condensed, 8px);\n}"]}