primer_view_components 0.1.9 → 0.2.0

Sign up to get free protection for your applications and to get access to all the features.
Files changed (177) hide show
  1. checksums.yaml +4 -4
  2. data/CHANGELOG.md +51 -0
  3. data/README.md +1 -1
  4. data/app/assets/javascripts/primer_view_components.js +1 -1
  5. data/app/assets/javascripts/primer_view_components.js.map +1 -1
  6. data/app/assets/styles/primer_view_components.css +1 -3
  7. data/app/assets/styles/primer_view_components.css.map +1 -1
  8. data/app/components/primer/alpha/action_list/item.rb +2 -2
  9. data/app/components/primer/alpha/action_list.css +1 -1
  10. data/app/components/primer/alpha/action_list.css.json +16 -16
  11. data/app/components/primer/alpha/action_list.css.map +1 -1
  12. data/app/components/primer/alpha/action_list.pcss +145 -145
  13. data/app/components/primer/alpha/action_list.rb +30 -15
  14. data/app/components/primer/alpha/action_menu/action_menu_element.d.ts +2 -1
  15. data/app/components/primer/alpha/action_menu/action_menu_element.js +44 -34
  16. data/app/components/primer/alpha/action_menu/action_menu_element.ts +32 -30
  17. data/app/components/primer/alpha/action_menu/list.rb +6 -1
  18. data/app/components/primer/alpha/auto_complete.css +1 -1
  19. data/app/components/primer/alpha/auto_complete.css.map +1 -1
  20. data/app/components/primer/alpha/auto_complete.pcss +3 -3
  21. data/app/components/primer/alpha/banner.css +1 -1
  22. data/app/components/primer/alpha/banner.css.map +1 -1
  23. data/app/components/primer/alpha/banner.pcss +11 -11
  24. data/app/components/primer/alpha/button_marketing.css.map +1 -1
  25. data/app/components/primer/alpha/button_marketing.pcss +5 -12
  26. data/app/components/primer/alpha/button_marketing.rb +3 -0
  27. data/app/components/primer/alpha/dialog.css +1 -1
  28. data/app/components/primer/alpha/dialog.css.map +1 -1
  29. data/app/components/primer/alpha/dialog.pcss +36 -36
  30. data/app/components/primer/alpha/dropdown.css +1 -1
  31. data/app/components/primer/alpha/dropdown.css.map +1 -1
  32. data/app/components/primer/alpha/dropdown.pcss +12 -12
  33. data/app/components/primer/alpha/form_control.html.erb +1 -1
  34. data/app/components/primer/alpha/hellip_button.rb +3 -1
  35. data/app/components/primer/alpha/layout.css +1 -1
  36. data/app/components/primer/alpha/layout.css.map +1 -1
  37. data/app/components/primer/alpha/layout.pcss +4 -4
  38. data/app/components/primer/alpha/menu.css +1 -1
  39. data/app/components/primer/alpha/menu.css.map +1 -1
  40. data/app/components/primer/alpha/menu.pcss +21 -21
  41. data/app/components/primer/alpha/modal_dialog.js +11 -4
  42. data/app/components/primer/alpha/modal_dialog.ts +11 -4
  43. data/app/components/primer/alpha/nav_list/item.rb +2 -0
  44. data/app/components/primer/alpha/nav_list.js +6 -0
  45. data/app/components/primer/alpha/nav_list.rb +55 -36
  46. data/app/components/primer/alpha/nav_list.ts +8 -0
  47. data/app/components/primer/alpha/octicon_symbols.html.erb +1 -1
  48. data/app/components/primer/alpha/overlay.css +1 -1
  49. data/app/components/primer/alpha/overlay.css.json +1 -2
  50. data/app/components/primer/alpha/overlay.css.map +1 -1
  51. data/app/components/primer/alpha/overlay.pcss +14 -4
  52. data/app/components/primer/alpha/segmented_control.css +1 -1
  53. data/app/components/primer/alpha/segmented_control.css.map +1 -1
  54. data/app/components/primer/alpha/segmented_control.pcss +24 -33
  55. data/app/components/primer/alpha/tab_nav.css +1 -1
  56. data/app/components/primer/alpha/tab_nav.css.map +1 -1
  57. data/app/components/primer/alpha/tab_nav.pcss +12 -12
  58. data/app/components/primer/alpha/text_field.css +1 -3
  59. data/app/components/primer/alpha/text_field.css.json +1 -0
  60. data/app/components/primer/alpha/text_field.css.map +1 -1
  61. data/app/components/primer/alpha/text_field.pcss +87 -83
  62. data/app/components/primer/alpha/toggle_switch.css +1 -1
  63. data/app/components/primer/alpha/toggle_switch.css.map +1 -1
  64. data/app/components/primer/alpha/toggle_switch.pcss +12 -12
  65. data/app/components/primer/alpha/underline_nav.css +1 -1
  66. data/app/components/primer/alpha/underline_nav.css.map +1 -1
  67. data/app/components/primer/alpha/underline_nav.pcss +11 -11
  68. data/app/components/primer/beta/avatar.css +1 -1
  69. data/app/components/primer/beta/avatar.css.map +1 -1
  70. data/app/components/primer/beta/avatar.pcss +18 -18
  71. data/app/components/primer/beta/avatar_stack.css +1 -1
  72. data/app/components/primer/beta/avatar_stack.css.map +1 -1
  73. data/app/components/primer/beta/avatar_stack.pcss +5 -5
  74. data/app/components/primer/beta/base_button.rb +11 -0
  75. data/app/components/primer/beta/blankslate.css +1 -1
  76. data/app/components/primer/beta/blankslate.css.map +1 -1
  77. data/app/components/primer/beta/blankslate.pcss +16 -16
  78. data/app/components/primer/beta/border_box.css +1 -1
  79. data/app/components/primer/beta/border_box.css.json +1 -1
  80. data/app/components/primer/beta/border_box.css.map +1 -1
  81. data/app/components/primer/beta/border_box.pcss +40 -42
  82. data/app/components/primer/beta/button.css +1 -1
  83. data/app/components/primer/beta/button.css.json +4 -0
  84. data/app/components/primer/beta/button.css.map +1 -1
  85. data/app/components/primer/beta/button.pcss +39 -24
  86. data/app/components/primer/beta/button.rb +3 -0
  87. data/app/components/primer/beta/button_group.css +1 -0
  88. data/app/components/primer/beta/button_group.css.json +14 -0
  89. data/app/components/primer/beta/button_group.css.map +1 -0
  90. data/app/components/primer/beta/button_group.pcss +27 -0
  91. data/app/components/primer/beta/button_group.rb +19 -19
  92. data/app/components/primer/beta/close_button.rb +3 -1
  93. data/app/components/primer/beta/counter.css +1 -1
  94. data/app/components/primer/beta/counter.css.map +1 -1
  95. data/app/components/primer/beta/counter.pcss +5 -5
  96. data/app/components/primer/beta/details.html.erb +6 -2
  97. data/app/components/primer/beta/details.rb +18 -10
  98. data/app/components/primer/beta/flash.css +1 -1
  99. data/app/components/primer/beta/flash.css.map +1 -1
  100. data/app/components/primer/beta/flash.pcss +12 -12
  101. data/app/components/primer/beta/icon_button.rb +7 -3
  102. data/app/components/primer/beta/label.css +1 -1
  103. data/app/components/primer/beta/label.css.map +1 -1
  104. data/app/components/primer/beta/label.pcss +3 -3
  105. data/app/components/primer/beta/popover.css +1 -1
  106. data/app/components/primer/beta/popover.css.map +1 -1
  107. data/app/components/primer/beta/popover.pcss +4 -4
  108. data/app/components/primer/beta/state.css +1 -1
  109. data/app/components/primer/beta/state.css.map +1 -1
  110. data/app/components/primer/beta/state.pcss +7 -7
  111. data/app/components/primer/beta/subhead.css +1 -1
  112. data/app/components/primer/beta/subhead.css.map +1 -1
  113. data/app/components/primer/beta/subhead.pcss +9 -9
  114. data/app/components/primer/beta/timeline_item.css +1 -1
  115. data/app/components/primer/beta/timeline_item.css.map +1 -1
  116. data/app/components/primer/beta/timeline_item.pcss +18 -18
  117. data/app/components/primer/beta/truncate.css +1 -1
  118. data/app/components/primer/beta/truncate.css.map +1 -1
  119. data/app/components/primer/beta/truncate.pcss +1 -1
  120. data/app/components/primer/focus_group.js +1 -10
  121. data/app/components/primer/focus_group.ts +1 -10
  122. data/app/components/primer/primer.d.ts +1 -0
  123. data/app/components/primer/primer.js +1 -0
  124. data/app/components/primer/primer.pcss +1 -0
  125. data/app/components/primer/primer.ts +1 -0
  126. data/lib/postcss_mixins/activeIndicatorLine.pcss +4 -4
  127. data/lib/primer/accessibility.rb +74 -0
  128. data/lib/primer/forms/form_control.html.erb +1 -1
  129. data/lib/primer/static/generate_previews.rb +15 -8
  130. data/lib/primer/view_components/linters/deprecated_components_counter.rb +37 -13
  131. data/lib/primer/view_components/version.rb +2 -2
  132. data/lib/primer/yard/lookbook_pages_backend.rb +3 -3
  133. data/previews/pages/forms/03_caption_templates.md.erb +1 -1
  134. data/previews/pages/forms/04_after_content.md.erb +1 -1
  135. data/previews/pages/forms/06_miscellaneous_inputs.md.erb +1 -1
  136. data/previews/pages/forms/07_toggle_switch_forms.md.erb +1 -1
  137. data/previews/primer/alpha/action_menu_preview/two_menus.html.erb +13 -0
  138. data/previews/primer/alpha/action_menu_preview/with_actions.html.erb +21 -0
  139. data/previews/primer/alpha/action_menu_preview.rb +5 -13
  140. data/previews/primer/alpha/button_marketing_preview.rb +3 -2
  141. data/previews/primer/alpha/dialog_preview.rb +4 -3
  142. data/previews/primer/alpha/hellip_button_preview.rb +3 -2
  143. data/previews/primer/alpha/nav_list_preview.rb +1 -1
  144. data/previews/primer/beta/base_button_preview.rb +9 -2
  145. data/previews/primer/beta/button_group_preview/action_menus.html.erb +8 -0
  146. data/previews/primer/beta/button_group_preview.rb +49 -11
  147. data/previews/primer/beta/button_preview/trailing_counter.html.erb +1 -1
  148. data/previews/primer/beta/button_preview.rb +5 -2
  149. data/previews/primer/beta/close_button_preview.rb +3 -2
  150. data/previews/primer/beta/details_preview.rb +11 -8
  151. data/previews/primer/forms_preview.rb +44 -0
  152. data/static/arguments.json +4 -4
  153. data/static/classes.json +378 -372
  154. data/static/constants.json +0 -1
  155. data/static/info_arch.json +5150 -1368
  156. data/static/previews.json +5197 -1433
  157. metadata +37 -29
  158. data/previews/primer/forms/forms_preview.rb +0 -48
  159. /data/previews/primer/{forms/forms_preview → forms_preview}/after_content_form.html.erb +0 -0
  160. /data/previews/primer/{forms/forms_preview → forms_preview}/array_check_box_group_form.html.erb +0 -0
  161. /data/previews/primer/{forms/forms_preview → forms_preview}/caption_template_form.html.erb +0 -0
  162. /data/previews/primer/{forms/forms_preview → forms_preview}/check_box_group_form.html.erb +0 -0
  163. /data/previews/primer/{forms/forms_preview → forms_preview}/check_box_with_nested_form.html.erb +0 -0
  164. /data/previews/primer/{forms/forms_preview → forms_preview}/composed_form.html.erb +0 -0
  165. /data/previews/primer/{forms/forms_preview → forms_preview}/example_toggle_switch_form.html.erb +0 -0
  166. /data/previews/primer/{forms/forms_preview → forms_preview}/horizontal_form.html.erb +0 -0
  167. /data/previews/primer/{forms/forms_preview → forms_preview}/immediate_validation_form.html.erb +0 -0
  168. /data/previews/primer/{forms/forms_preview → forms_preview}/invalid_form.html.erb +0 -0
  169. /data/previews/primer/{forms/forms_preview → forms_preview}/multi_input_form.html.erb +0 -0
  170. /data/previews/primer/{forms/forms_preview → forms_preview}/multi_text_field_form.html.erb +0 -0
  171. /data/previews/primer/{forms/forms_preview → forms_preview}/name_with_question_mark_form.html.erb +0 -0
  172. /data/previews/primer/{forms/forms_preview → forms_preview}/radio_button_group_form.html.erb +0 -0
  173. /data/previews/primer/{forms/forms_preview → forms_preview}/radio_button_with_nested_form.html.erb +0 -0
  174. /data/previews/primer/{forms/forms_preview → forms_preview}/select_form.html.erb +0 -0
  175. /data/previews/primer/{forms/forms_preview → forms_preview}/single_text_field_form.html.erb +0 -0
  176. /data/previews/primer/{forms/forms_preview → forms_preview}/submit_button_form.html.erb +0 -0
  177. /data/previews/primer/{forms/forms_preview → forms_preview}/text_field_and_checkbox_form.html.erb +0 -0
@@ -1 +1 @@
1
- .Overlay--hidden{display:none!important}.Overlay--visibilityHidden{height:0;opacity:0;overflow:hidden;visibility:hidden}.Overlay{background-color:var(--color-canvas-overlay);border-radius:var(--borderRadius-large,12px);box-shadow:var(--color-overlay-shadow);display:flex;flex-direction:column;max-height:min(calc(100vh - 2rem),var(--overlay-height));min-width:192px;opacity:1;white-space:normal;width:min(var(--overlay-width),100vw - 2rem)}.Overlay.Overlay--size-auto{max-height:calc(100vh - 2rem);max-width:calc(100vw - 2rem);min-width:192px}.Overlay.Overlay--size-full{height:100vh;width:100vw}.Overlay.Overlay--size-xsmall{--overlay-width:192px;max-height:calc(100vh - 2rem)}.Overlay.Overlay--size-small{--overlay-height:256px;--overlay-width:320px}.Overlay.Overlay--size-small-portrait{--overlay-height:432px;--overlay-width:320px}.Overlay.Overlay--size-medium{--overlay-height:320px;--overlay-width:480px}.Overlay.Overlay--size-medium-portrait{--overlay-height:600px;--overlay-width:480px}.Overlay.Overlay--size-large{--overlay-height:432px;--overlay-width:640px}.Overlay.Overlay--size-xlarge{--overlay-height:600px;--overlay-width:960px}.Overlay.Overlay--height-auto{height:auto}.Overlay.Overlay--height-xsmall{height:min(192px,100vh - 2rem)}.Overlay.Overlay--height-small{height:min(256px,100vh - 2rem)}.Overlay.Overlay--height-medium{height:min(320px,100vh - 2rem)}.Overlay.Overlay--height-large{height:min(432px,100vh - 2rem)}.Overlay.Overlay--height-xlarge{height:min(600px,100vh - 2rem)}.Overlay.Overlay--width-auto{width:auto}.Overlay.Overlay--width-small{width:min(256px,100vw - 2rem)}.Overlay.Overlay--width-medium{width:min(320px,100vw - 2rem)}.Overlay.Overlay--width-large{width:min(480px,100vw - 2rem)}.Overlay.Overlay--width-xlarge{width:min(640px,100vw - 2rem)}.Overlay.Overlay--width-xxlarge{width:min(960px,100vw - 2rem)}@media screen and (prefers-reduced-motion:no-preference){.Overlay.Overlay--motion-scaleFade{animation:Overlay--motion-scaleFade .2s cubic-bezier(.33,1,.68,1) 0s 1 normal none running}}@keyframes Overlay--motion-scaleFade{0%{opacity:0;transform:scale(.5)}to{opacity:1;transform:scale(1)}}.Overlay-form{flex-grow:1;overflow:auto}.Overlay-form,.Overlay-header{display:flex;flex-direction:column}.Overlay-header{z-index:1}.Overlay-header.Overlay-header--divided{box-shadow:inset 0 calc(var(--borderWidth-thin, 1px)*-1) var(--color-border-default);padding-bottom:var(--stack-padding-condensed,8px)}.Overlay-header.Overlay-header--divided+.Overlay-body{padding-top:var(--stack-padding-normal,16px)}.Overlay-header.Overlay-header--large .Overlay-headerContentWrap .Overlay-titleWrap{gap:var(--stack-gap-condensed,8px)}.Overlay-header.Overlay-header--large .Overlay-headerContentWrap .Overlay-titleWrap .Overlay-title{font-size:var(--text-title-size-medium,20px)}.Overlay-header.Overlay-header--large .Overlay-headerContentWrap .Overlay-titleWrap .Overlay-description{font-size:var(--text-body-size-medium,14px)}.Overlay-header .Overlay-headerContentWrap{align-items:flex-start;display:flex;gap:var(--stack-gap-condensed,8px);padding:var(--stack-gap-condensed,8px) var(--stack-gap-condensed,8px) 0 var(--stack-gap-condensed,8px)}.Overlay-header .Overlay-headerContentWrap .Overlay-actionWrap{display:flex;flex-direction:row;gap:var(--stack-gap-condensed,8px)}.Overlay-header .Overlay-headerContentWrap .Overlay-titleWrap{display:flex;flex-direction:column;flex-grow:1;gap:var(--control-small-gap,4px);padding:calc(var(--stack-gap-condensed, 8px)*.75) 0 calc(var(--stack-gap-condensed, 8px)*.75) var(--stack-gap-condensed,8px)}.Overlay-header .Overlay-headerContentWrap .Overlay-titleWrap .Overlay-title{font-size:var(--text-body-size-medium,14px);font-weight:var(--base-text-weight-semibold,600);margin:0}.Overlay-header .Overlay-headerContentWrap .Overlay-titleWrap .Overlay-description{color:var(--color-fg-muted);font-size:var(--text-body-size-small,12px);font-weight:var(--base-text-weight-normal,400);margin:0}.Overlay-body{flex-grow:1;font-size:var(--text-body-size-medium,14px);overflow-y:auto;padding:var(--stack-padding-normal,16px);padding-top:0;scrollbar-width:thin}.Overlay-body.Overlay-body--paddingCondensed{padding:var(--stack-padding-condensed,8px);padding-top:0}.Overlay-body.Overlay-body--paddingNone{padding:0}.Overlay-footer{display:flex;flex-direction:row;flex-shrink:0;flex-wrap:wrap;padding:0 var(--stack-padding-normal,16px) var(--stack-padding-normal,16px) var(--stack-padding-normal,16px);z-index:1}.Overlay-footer.Overlay-footer--divided{box-shadow:inset 0 var(--borderWidth-thin,1px) var(--color-border-default);padding-top:var(--stack-padding-normal,16px)}.Overlay-footer.Overlay-footer--alignStart{gap:var(--stack-gap-condensed,8px);justify-content:flex-start}.Overlay-footer.Overlay-footer--alignCenter{gap:var(--stack-gap-condensed,8px);justify-content:center}.Overlay-footer.Overlay-footer--alignEnd{gap:var(--stack-gap-condensed,8px);justify-content:flex-end}.Overlay-closeButton{align-self:flex-start;background-color:initial;border:var(--borderWidth-thin,1px) solid #0000;border-radius:var(--borderRadius-medium,6px);color:var(--color-fg-muted);cursor:pointer;display:grid;flex-shrink:0;height:var(--base-size-32,32px);padding:0;place-content:center;position:relative;transition:.2s cubic-bezier(.3,0,.5,1);transition-property:color,background-color,border-color;-webkit-user-select:none;user-select:none;width:var(--base-size-32,32px)}.Overlay-closeButton:focus,.Overlay-closeButton:hover{background-color:var(--color-btn-hover-bg);border:var(--borderWidth-thin,1px) solid var(--color-btn-hover-bg)}.Overlay-closeButton.close-button{border:var(--borderWidth-thin,1px) solid #0000}.Overlay-backdrop--center{align-items:center;background-color:var(--color-neutral-muted);bottom:0;display:flex;justify-content:center;left:0;position:fixed;right:0;top:0;z-index:999}.Overlay-backdrop--anchor{background-color:initial;position:absolute;z-index:999}.Overlay-backdrop--side{background-color:var(--color-neutral-muted);bottom:0;display:flex;left:0;position:fixed;right:0;top:0;z-index:999}.Overlay-backdrop--side,.Overlay-backdrop--side.Overlay-backdrop--placement-left{align-items:center;justify-content:left}.Overlay-backdrop--side.Overlay-backdrop--placement-left>.Overlay{border-radius:var(--borderRadius-large,12px);border-bottom-left-radius:0;border-top-left-radius:0;height:100vh;max-height:unset}@media screen and (prefers-reduced-motion:no-preference){.Overlay-backdrop--side.Overlay-backdrop--placement-left>.Overlay{animation:Overlay--motion-slideInRight .25s cubic-bezier(.33,1,.68,1) 0s 1 normal none running}}.Overlay-backdrop--side.Overlay-backdrop--placement-right{align-items:center;justify-content:right}.Overlay-backdrop--side.Overlay-backdrop--placement-right>.Overlay{border-radius:var(--borderRadius-large,12px);border-bottom-right-radius:0;border-top-right-radius:0;height:100vh;max-height:unset}@media screen and (prefers-reduced-motion:no-preference){.Overlay-backdrop--side.Overlay-backdrop--placement-right>.Overlay{animation:Overlay--motion-slideInLeft .25s cubic-bezier(.33,1,.68,1) 0s 1 normal none running}}.Overlay-backdrop--side.Overlay-backdrop--placement-bottom{align-items:end;justify-content:center}.Overlay-backdrop--side.Overlay-backdrop--placement-bottom>.Overlay{border-radius:var(--borderRadius-large,12px);border-bottom-left-radius:0;border-bottom-right-radius:0;height:auto;max-height:calc(100vh - 2rem);width:100vw}@media screen and (prefers-reduced-motion:no-preference){.Overlay-backdrop--side.Overlay-backdrop--placement-bottom>.Overlay{animation:Overlay--motion-slideUp .25s cubic-bezier(.33,1,.68,1) 0s 1 normal none running}}.Overlay-backdrop--side.Overlay-backdrop--placement-top{align-items:start;justify-content:center}.Overlay-backdrop--side.Overlay-backdrop--placement-top>.Overlay{border-radius:var(--borderRadius-large,12px);border-top-left-radius:0;border-top-right-radius:0}@media screen and (prefers-reduced-motion:no-preference){.Overlay-backdrop--side.Overlay-backdrop--placement-top>.Overlay{animation:Overlay--motion-slideDown .25s cubic-bezier(.33,1,.68,1) 0s 1 normal none running}}.Overlay-backdrop--full{background-color:var(--color-neutral-muted);bottom:0;display:flex;left:0;position:fixed;right:0;top:0;z-index:999}.Overlay-backdrop--full .Overlay{border-radius:unset!important;flex-grow:1;height:100%;max-height:100vh;max-width:100vw;width:100%}@media (max-width:767px){.Overlay-backdrop--center-whenNarrow{align-items:center;background-color:var(--color-neutral-muted);bottom:0;display:flex;justify-content:center;left:0;position:fixed;right:0;top:0;z-index:999}.Overlay-backdrop--anchor-whenNarrow{background-color:initial;position:absolute;z-index:999}.Overlay-backdrop--side-whenNarrow{background-color:var(--color-neutral-muted);bottom:0;display:flex;left:0;position:fixed;right:0;top:0;z-index:999}.Overlay-backdrop--side-whenNarrow,.Overlay-backdrop--side-whenNarrow.Overlay-backdrop--placement-left-whenNarrow{align-items:center;justify-content:left}.Overlay-backdrop--side-whenNarrow.Overlay-backdrop--placement-left-whenNarrow>.Overlay-whenNarrow{border-radius:var(--borderRadius-large,12px);border-bottom-left-radius:0;border-top-left-radius:0;height:100vh;max-height:unset}@media screen and (prefers-reduced-motion:no-preference){.Overlay-backdrop--side-whenNarrow.Overlay-backdrop--placement-left-whenNarrow>.Overlay-whenNarrow{animation:Overlay--motion-slideInRight .25s cubic-bezier(.33,1,.68,1) 0s 1 normal none running}}.Overlay-backdrop--side-whenNarrow.Overlay-backdrop--placement-right-whenNarrow{align-items:center;justify-content:right}.Overlay-backdrop--side-whenNarrow.Overlay-backdrop--placement-right-whenNarrow>.Overlay-whenNarrow{border-radius:var(--borderRadius-large,12px);border-bottom-right-radius:0;border-top-right-radius:0;height:100vh;max-height:unset}@media screen and (prefers-reduced-motion:no-preference){.Overlay-backdrop--side-whenNarrow.Overlay-backdrop--placement-right-whenNarrow>.Overlay-whenNarrow{animation:Overlay--motion-slideInLeft .25s cubic-bezier(.33,1,.68,1) 0s 1 normal none running}}.Overlay-backdrop--side-whenNarrow.Overlay-backdrop--placement-bottom-whenNarrow{align-items:end;justify-content:center}.Overlay-backdrop--side-whenNarrow.Overlay-backdrop--placement-bottom-whenNarrow>.Overlay-whenNarrow{border-radius:var(--borderRadius-large,12px);border-bottom-left-radius:0;border-bottom-right-radius:0;height:auto;max-height:calc(100vh - 2rem);width:100vw}@media screen and (prefers-reduced-motion:no-preference){.Overlay-backdrop--side-whenNarrow.Overlay-backdrop--placement-bottom-whenNarrow>.Overlay-whenNarrow{animation:Overlay--motion-slideUp .25s cubic-bezier(.33,1,.68,1) 0s 1 normal none running}}.Overlay-backdrop--side-whenNarrow.Overlay-backdrop--placement-top-whenNarrow{align-items:start;justify-content:center}.Overlay-backdrop--side-whenNarrow.Overlay-backdrop--placement-top-whenNarrow>.Overlay-whenNarrow{border-radius:var(--borderRadius-large,12px);border-top-left-radius:0;border-top-right-radius:0}@media screen and (prefers-reduced-motion:no-preference){.Overlay-backdrop--side-whenNarrow.Overlay-backdrop--placement-top-whenNarrow>.Overlay-whenNarrow{animation:Overlay--motion-slideDown .25s cubic-bezier(.33,1,.68,1) 0s 1 normal none running}}.Overlay-backdrop--full-whenNarrow{background-color:var(--color-neutral-muted);bottom:0;display:flex;left:0;position:fixed;right:0;top:0;z-index:999}.Overlay-backdrop--full-whenNarrow .Overlay{border-radius:unset!important;flex-grow:1;height:100%;max-height:100vh;max-width:100vw;width:100%}}@keyframes Overlay--motion-slideDown{0%{transform:translateY(-100%)}}@keyframes Overlay--motion-slideUp{0%{transform:translateY(100%)}}@keyframes Overlay--motion-slideInRight{0%{transform:translateX(-100%)}}@keyframes Overlay--motion-slideInLeft{0%{transform:translateX(100%)}}
1
+ .Overlay--hidden{display:none!important}.Overlay--visibilityHidden{height:0;opacity:0;overflow:hidden;visibility:hidden}.Overlay{background-color:var(--color-canvas-overlay);border-radius:var(--borderRadius-large,12px);box-shadow:var(--color-overlay-shadow);display:flex;flex-direction:column;max-height:min(calc(100vh - 2rem),var(--overlay-height));min-width:192px;opacity:1;white-space:normal;width:min(var(--overlay-width),100vw - 2rem)}.Overlay.Overlay--size-auto{max-height:calc(100vh - 2rem);max-width:calc(100vw - 2rem);min-width:192px}.Overlay.Overlay--size-full{height:100vh;width:100vw}.Overlay.Overlay--size-xsmall{--overlay-width:192px;max-height:calc(100vh - 2rem)}.Overlay.Overlay--size-small{--overlay-height:256px;--overlay-width:320px}.Overlay.Overlay--size-small-portrait{--overlay-height:432px;--overlay-width:320px}.Overlay.Overlay--size-medium{--overlay-height:320px;--overlay-width:480px}.Overlay.Overlay--size-medium-portrait{--overlay-height:600px;--overlay-width:480px}.Overlay.Overlay--size-large{--overlay-height:432px;--overlay-width:640px}.Overlay.Overlay--size-xlarge{--overlay-height:600px;--overlay-width:960px}.Overlay.Overlay--height-auto{height:auto}.Overlay.Overlay--height-xsmall{height:min(192px,100vh - 2rem)}.Overlay.Overlay--height-small{height:min(256px,100vh - 2rem)}.Overlay.Overlay--height-medium{height:min(320px,100vh - 2rem)}.Overlay.Overlay--height-large{height:min(432px,100vh - 2rem)}.Overlay.Overlay--height-xlarge{height:min(600px,100vh - 2rem)}.Overlay.Overlay--width-auto{width:auto}.Overlay.Overlay--width-small{width:min(256px,100vw - 2rem)}.Overlay.Overlay--width-medium{width:min(320px,100vw - 2rem)}.Overlay.Overlay--width-large{width:min(480px,100vw - 2rem)}.Overlay.Overlay--width-xlarge{width:min(640px,100vw - 2rem)}.Overlay.Overlay--width-xxlarge{width:min(960px,100vw - 2rem)}@media screen and (prefers-reduced-motion:no-preference){.Overlay.Overlay--motion-scaleFade{animation:Overlay--motion-scaleFade .2s cubic-bezier(.33,1,.68,1) 0s 1 normal none running}}@keyframes Overlay--motion-scaleFade{0%{opacity:0;transform:scale(.5)}to{opacity:1;transform:scale(1)}}.Overlay-form{flex-grow:1;overflow:auto}.Overlay-form,.Overlay-header{display:flex;flex-direction:column}.Overlay-header{z-index:1}.Overlay-header.Overlay-header--divided{box-shadow:inset 0 calc(var(--borderWidth-thin,max(1px, .0625rem))*-1) var(--color-border-default);padding-bottom:var(--stack-padding-condensed,.5rem)}.Overlay-header.Overlay-header--divided+.Overlay-body{padding-top:var(--stack-padding-normal,1rem)}.Overlay-header.Overlay-header--large .Overlay-headerContentWrap .Overlay-titleWrap{gap:var(--stack-gap-condensed,.5rem)}.Overlay-header.Overlay-header--large .Overlay-headerContentWrap .Overlay-titleWrap .Overlay-title{font-size:var(--text-title-size-medium,1.25rem)}.Overlay-header.Overlay-header--large .Overlay-headerContentWrap .Overlay-titleWrap .Overlay-description{font-size:var(--text-body-size-medium,.875rem)}.Overlay-header .Overlay-headerContentWrap{align-items:flex-start;display:flex;gap:var(--stack-gap-condensed,.5rem);padding:var(--stack-gap-condensed,.5rem) var(--stack-gap-condensed,.5rem) 0 var(--stack-gap-condensed,.5rem)}.Overlay-header .Overlay-headerContentWrap .Overlay-actionWrap{display:flex;flex-direction:row;gap:var(--stack-gap-condensed,.5rem)}.Overlay-header .Overlay-headerContentWrap .Overlay-titleWrap{display:flex;flex-direction:column;flex-grow:1;gap:var(--control-small-gap,.25rem);padding:calc(var(--stack-gap-condensed,.5rem)*.75) 0 calc(var(--stack-gap-condensed,.5rem)*.75) var(--stack-gap-condensed,.5rem)}.Overlay-header .Overlay-headerContentWrap .Overlay-titleWrap .Overlay-title{font-size:var(--text-body-size-medium,.875rem);font-weight:var(--base-text-weight-semibold,600);margin:0}.Overlay-header .Overlay-headerContentWrap .Overlay-titleWrap .Overlay-description{color:var(--color-fg-muted);font-size:var(--text-body-size-small,.75rem);font-weight:var(--base-text-weight-normal,400);margin:0}.Overlay-body{flex-grow:1;font-size:var(--text-body-size-medium,.875rem);overflow-y:auto;padding:var(--stack-padding-normal,1rem);padding-top:0;scrollbar-width:thin}.Overlay-body.Overlay-body--paddingCondensed{padding:var(--stack-padding-condensed,.5rem);padding-top:0}.Overlay-body.Overlay-body--paddingNone{padding:0}.Overlay-footer{display:flex;flex-direction:row;flex-shrink:0;flex-wrap:wrap;padding:0 var(--stack-padding-normal,1rem) var(--stack-padding-normal,1rem) var(--stack-padding-normal,1rem);z-index:1}.Overlay-footer.Overlay-footer--divided{box-shadow:inset 0 var(--borderWidth-thin,max(1px,.0625rem)) var(--color-border-default);padding-top:var(--stack-padding-normal,1rem)}.Overlay-footer.Overlay-footer--alignStart{gap:var(--stack-gap-condensed,.5rem);justify-content:flex-start}.Overlay-footer.Overlay-footer--alignCenter{gap:var(--stack-gap-condensed,.5rem);justify-content:center}.Overlay-footer.Overlay-footer--alignEnd{gap:var(--stack-gap-condensed,.5rem);justify-content:flex-end}.Overlay-closeButton{align-self:flex-start;background-color:initial;border:var(--borderWidth-thin,max(1px,.0625rem)) solid #0000;border-radius:var(--borderRadius-medium,6px);color:var(--color-fg-muted);cursor:pointer;display:grid;flex-shrink:0;height:var(--base-size-32,2rem);padding:0;place-content:center;position:relative;transition:.2s cubic-bezier(.3,0,.5,1);transition-property:color,background-color,border-color;-webkit-user-select:none;user-select:none;width:var(--base-size-32,2rem)}.Overlay-closeButton:focus,.Overlay-closeButton:hover{background-color:var(--color-btn-hover-bg);border:var(--borderWidth-thin,max(1px,.0625rem)) solid var(--color-btn-hover-bg)}.Overlay-closeButton.close-button{border:var(--borderWidth-thin,max(1px,.0625rem)) solid #0000}.Overlay-backdrop--center{align-items:center;background-color:var(--color-neutral-muted);bottom:0;display:flex;justify-content:center;left:0;position:fixed;right:0;top:0;z-index:999}.Overlay-backdrop--anchor{background-color:initial;position:absolute;z-index:999}.Overlay-backdrop--side{background-color:var(--color-neutral-muted);bottom:0;display:flex;left:0;position:fixed;right:0;top:0;z-index:999}.Overlay-backdrop--side,.Overlay-backdrop--side.Overlay-backdrop--placement-left{align-items:center;justify-content:left}.Overlay-backdrop--side.Overlay-backdrop--placement-left>.Overlay{border-radius:var(--borderRadius-large,12px);border-bottom-left-radius:0;border-top-left-radius:0;height:100vh;max-height:unset}@media screen and (prefers-reduced-motion:no-preference){.Overlay-backdrop--side.Overlay-backdrop--placement-left>.Overlay{animation:Overlay--motion-slideInRight .25s cubic-bezier(.33,1,.68,1) 0s 1 normal none running}}.Overlay-backdrop--side.Overlay-backdrop--placement-right{align-items:center;justify-content:right}.Overlay-backdrop--side.Overlay-backdrop--placement-right>.Overlay{border-radius:var(--borderRadius-large,12px);border-bottom-right-radius:0;border-top-right-radius:0;height:100vh;max-height:unset}@media screen and (prefers-reduced-motion:no-preference){.Overlay-backdrop--side.Overlay-backdrop--placement-right>.Overlay{animation:Overlay--motion-slideInLeft .25s cubic-bezier(.33,1,.68,1) 0s 1 normal none running}}.Overlay-backdrop--side.Overlay-backdrop--placement-bottom{align-items:end;justify-content:center}.Overlay-backdrop--side.Overlay-backdrop--placement-bottom>.Overlay{border-radius:var(--borderRadius-large,12px);border-bottom-left-radius:0;border-bottom-right-radius:0;height:auto;max-height:calc(100vh - 2rem);width:100vw}@media screen and (prefers-reduced-motion:no-preference){.Overlay-backdrop--side.Overlay-backdrop--placement-bottom>.Overlay{animation:Overlay--motion-slideUp .25s cubic-bezier(.33,1,.68,1) 0s 1 normal none running}}.Overlay-backdrop--side.Overlay-backdrop--placement-top{align-items:start;justify-content:center}.Overlay-backdrop--side.Overlay-backdrop--placement-top>.Overlay{border-radius:var(--borderRadius-large,12px);border-top-left-radius:0;border-top-right-radius:0}@media screen and (prefers-reduced-motion:no-preference){.Overlay-backdrop--side.Overlay-backdrop--placement-top>.Overlay{animation:Overlay--motion-slideDown .25s cubic-bezier(.33,1,.68,1) 0s 1 normal none running}}.Overlay-backdrop--full{background-color:var(--color-neutral-muted);bottom:0;display:flex;left:0;position:fixed;right:0;top:0;z-index:999}.Overlay-backdrop--full .Overlay{border-radius:unset!important;flex-grow:1;height:100%;max-height:100vh;max-width:100vw;width:100%}@media (max-width:767px){.Overlay-backdrop--center-whenNarrow{align-items:center;background-color:var(--color-neutral-muted);bottom:0;display:flex;justify-content:center;left:0;position:fixed;right:0;top:0;z-index:999}.Overlay-backdrop--anchor-whenNarrow{background-color:initial;position:absolute;z-index:999}.Overlay-backdrop--side-whenNarrow{background-color:var(--color-neutral-muted);bottom:0;display:flex;left:0;position:fixed;right:0;top:0;z-index:999}.Overlay-backdrop--side-whenNarrow,.Overlay-backdrop--side-whenNarrow.Overlay-backdrop--placement-left-whenNarrow{align-items:center;justify-content:left}.Overlay-backdrop--side-whenNarrow.Overlay-backdrop--placement-left-whenNarrow>.Overlay-whenNarrow{border-radius:var(--borderRadius-large,12px);border-bottom-left-radius:0;border-top-left-radius:0;height:100vh;max-height:unset}@media screen and (prefers-reduced-motion:no-preference){.Overlay-backdrop--side-whenNarrow.Overlay-backdrop--placement-left-whenNarrow>.Overlay-whenNarrow{animation:Overlay--motion-slideInRight .25s cubic-bezier(.33,1,.68,1) 0s 1 normal none running}}.Overlay-backdrop--side-whenNarrow.Overlay-backdrop--placement-right-whenNarrow{align-items:center;justify-content:right}.Overlay-backdrop--side-whenNarrow.Overlay-backdrop--placement-right-whenNarrow>.Overlay-whenNarrow{border-radius:var(--borderRadius-large,12px);border-bottom-right-radius:0;border-top-right-radius:0;height:100vh;max-height:unset}@media screen and (prefers-reduced-motion:no-preference){.Overlay-backdrop--side-whenNarrow.Overlay-backdrop--placement-right-whenNarrow>.Overlay-whenNarrow{animation:Overlay--motion-slideInLeft .25s cubic-bezier(.33,1,.68,1) 0s 1 normal none running}}.Overlay-backdrop--side-whenNarrow.Overlay-backdrop--placement-bottom-whenNarrow{align-items:end;justify-content:center}.Overlay-backdrop--side-whenNarrow.Overlay-backdrop--placement-bottom-whenNarrow>.Overlay-whenNarrow{border-radius:var(--borderRadius-large,12px);border-bottom-left-radius:0;border-bottom-right-radius:0;height:auto;max-height:calc(100vh - 2rem);width:100vw}@media screen and (prefers-reduced-motion:no-preference){.Overlay-backdrop--side-whenNarrow.Overlay-backdrop--placement-bottom-whenNarrow>.Overlay-whenNarrow{animation:Overlay--motion-slideUp .25s cubic-bezier(.33,1,.68,1) 0s 1 normal none running}}.Overlay-backdrop--side-whenNarrow.Overlay-backdrop--placement-top-whenNarrow{align-items:start;justify-content:center}.Overlay-backdrop--side-whenNarrow.Overlay-backdrop--placement-top-whenNarrow>.Overlay-whenNarrow{border-radius:var(--borderRadius-large,12px);border-top-left-radius:0;border-top-right-radius:0}@media screen and (prefers-reduced-motion:no-preference){.Overlay-backdrop--side-whenNarrow.Overlay-backdrop--placement-top-whenNarrow>.Overlay-whenNarrow{animation:Overlay--motion-slideDown .25s cubic-bezier(.33,1,.68,1) 0s 1 normal none running}}.Overlay-backdrop--full-whenNarrow{background-color:var(--color-neutral-muted);bottom:0;display:flex;left:0;position:fixed;right:0;top:0;z-index:999}.Overlay-backdrop--full-whenNarrow .Overlay{border-radius:unset!important;flex-grow:1;height:100%;max-height:100vh;max-width:100vw;width:100%}}@keyframes Overlay--motion-slideDown{0%{transform:translateY(-100%)}}@keyframes Overlay--motion-slideUp{0%{transform:translateY(100%)}}@keyframes Overlay--motion-slideInRight{0%{transform:translateX(-100%)}}@keyframes Overlay--motion-slideInLeft{0%{transform:translateX(100%)}}
@@ -1 +1 @@
1
- {"version":3,"sources":["dialog.pcss"],"names":[],"mappings":"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","file":"dialog.css","sourcesContent":["/* Overlay */\n\n.Overlay--hidden {\n display: none !important;\n}\n\n.Overlay--visibilityHidden {\n height: 0;\n overflow: hidden;\n visibility: hidden;\n opacity: 0;\n}\n\n.Overlay {\n display: flex;\n width: min(var(--overlay-width), 100vw - 2rem);\n min-width: 192px;\n max-height: min(calc(100vh - 2rem), var(--overlay-height));\n white-space: normal;\n flex-direction: column;\n background-color: var(--color-canvas-overlay);\n border-radius: var(--borderRadius-large, 12px);\n box-shadow: var(--color-overlay-shadow);\n opacity: 1;\n\n &.Overlay--size-auto {\n min-width: 192px;\n max-width: calc(100vw - 2rem);\n max-height: calc(100vh - 2rem);\n }\n\n &.Overlay--size-full {\n width: 100vw;\n height: 100vh;\n }\n\n &.Overlay--size-xsmall {\n --overlay-width: 192px;\n\n max-height: calc(100vh - 2rem);\n }\n\n &.Overlay--size-small {\n --overlay-height: 256px;\n --overlay-width: 320px;\n }\n\n &.Overlay--size-small-portrait {\n --overlay-height: 432px;\n --overlay-width: 320px;\n }\n\n &.Overlay--size-medium {\n --overlay-height: 320px;\n --overlay-width: 480px;\n }\n\n &.Overlay--size-medium-portrait {\n --overlay-height: 600px;\n --overlay-width: 480px;\n }\n\n &.Overlay--size-large {\n --overlay-height: 432px;\n --overlay-width: 640px;\n }\n\n &.Overlay--size-xlarge {\n --overlay-height: 600px;\n --overlay-width: 960px;\n }\n\n &.Overlay--height-auto {\n height: auto;\n }\n\n /* start deprecate in favor of Alpha::Dialog */\n &.Overlay--height-xsmall {\n height: min(192px, 100vh - 2rem);\n }\n\n &.Overlay--height-small {\n height: min(256px, 100vh - 2rem);\n }\n\n &.Overlay--height-medium {\n height: min(320px, 100vh - 2rem);\n }\n\n &.Overlay--height-large {\n height: min(432px, 100vh - 2rem);\n }\n\n &.Overlay--height-xlarge {\n height: min(600px, 100vh - 2rem);\n }\n\n &.Overlay--width-auto {\n width: auto;\n }\n\n &.Overlay--width-small {\n width: min(256px, 100vw - 2rem);\n }\n\n &.Overlay--width-medium {\n width: min(320px, 100vw - 2rem);\n }\n\n &.Overlay--width-large {\n width: min(480px, 100vw - 2rem);\n }\n\n &.Overlay--width-xlarge {\n width: min(640px, 100vw - 2rem);\n }\n\n &.Overlay--width-xxlarge {\n width: min(960px, 100vw - 2rem);\n }\n\n /* end deprecate */\n\n &.Overlay--motion-scaleFade {\n @media screen and (prefers-reduced-motion: no-preference) {\n animation: 200ms cubic-bezier(0.33, 1, 0.68, 1) 0s 1 normal none running Overlay--motion-scaleFade;\n }\n }\n}\n\n@keyframes Overlay--motion-scaleFade {\n 0% {\n opacity: 0;\n transform: scale(0.5);\n }\n\n 100% {\n opacity: 1;\n transform: scale(1);\n }\n}\n\n/* for <form> element that wraps entire contents of overlay */\n.Overlay-form {\n display: flex;\n overflow: auto;\n flex-direction: column;\n flex-grow: 1;\n}\n\n.Overlay-header {\n z-index: 1;\n display: flex;\n flex-direction: column;\n\n &.Overlay-header--divided {\n padding-bottom: var(--stack-padding-condensed, 8px);\n box-shadow: inset 0 calc(var(--borderWidth-thin, 1px) * -1) var(--color-border-default);\n\n & + .Overlay-body {\n padding-top: var(--stack-padding-normal, 16px);\n }\n }\n\n &.Overlay-header--large {\n & .Overlay-headerContentWrap {\n & .Overlay-titleWrap {\n gap: var(--stack-gap-condensed, 8px);\n\n & .Overlay-title {\n font-size: var(--text-title-size-medium, 20px);\n }\n\n & .Overlay-description {\n font-size: var(--text-body-size-medium, 14px);\n }\n }\n }\n }\n\n & .Overlay-headerContentWrap {\n display: flex;\n align-items: flex-start;\n gap: var(--stack-gap-condensed, 8px);\n padding: var(--stack-gap-condensed, 8px) var(--stack-gap-condensed, 8px) 0 var(--stack-gap-condensed, 8px);\n\n & .Overlay-actionWrap {\n display: flex;\n flex-direction: row;\n gap: var(--stack-gap-condensed, 8px);\n }\n\n & .Overlay-titleWrap {\n display: flex;\n padding: calc(var(--stack-gap-condensed, 8px) * 0.75) 0 calc(var(--stack-gap-condensed, 8px) * 0.75)\n var(--stack-gap-condensed, 8px);\n flex-direction: column;\n flex-grow: 1;\n gap: var(--control-small-gap, 4px);\n\n & .Overlay-title {\n margin: 0;\n font-size: var(--text-body-size-medium, 14px);\n font-weight: var(--base-text-weight-semibold, 600);\n }\n\n & .Overlay-description {\n margin: 0;\n font-size: var(--text-body-size-small, 12px);\n font-weight: var(--base-text-weight-normal, 400);\n color: var(--color-fg-muted);\n }\n }\n }\n}\n\n/* generic body content slot */\n.Overlay-body {\n padding: var(--stack-padding-normal, 16px);\n padding-top: 0;\n overflow-y: auto;\n scrollbar-width: thin;\n font-size: var(--text-body-size-medium, 14px);\n flex-grow: 1;\n\n &.Overlay-body--paddingCondensed {\n padding: var(--stack-padding-condensed, 8px);\n padding-top: 0;\n }\n\n &.Overlay-body--paddingNone {\n padding: 0;\n }\n}\n\n/* generic footer slot */\n.Overlay-footer {\n z-index: 1;\n display: flex;\n padding: 0 var(--stack-padding-normal, 16px) var(--stack-padding-normal, 16px) var(--stack-padding-normal, 16px);\n flex-direction: row;\n flex-shrink: 0;\n flex-wrap: wrap;\n\n &.Overlay-footer--divided {\n padding-top: var(--stack-padding-normal, 16px);\n box-shadow: inset 0 var(--borderWidth-thin, 1px) var(--color-border-default);\n }\n\n &.Overlay-footer--alignStart {\n justify-content: flex-start;\n gap: var(--stack-gap-condensed, 8px);\n }\n\n &.Overlay-footer--alignCenter {\n justify-content: center;\n gap: var(--stack-gap-condensed, 8px);\n }\n\n &.Overlay-footer--alignEnd {\n justify-content: flex-end;\n gap: var(--stack-gap-condensed, 8px);\n }\n}\n\n/* TODO: replace with refactored IconButton */\n.Overlay-closeButton {\n position: relative;\n display: grid;\n width: var(--base-size-32, 32px);\n height: var(--base-size-32, 32px);\n padding: 0;\n color: var(--color-fg-muted);\n cursor: pointer;\n user-select: none;\n background-color: transparent;\n border: var(--borderWidth-thin, 1px) solid transparent;\n border-radius: var(--borderRadius-medium, 6px);\n transition: 0.2s cubic-bezier(0.3, 0, 0.5, 1);\n transition-property: color, background-color, border-color;\n place-content: center;\n align-self: flex-start;\n flex-shrink: 0;\n\n &:hover,\n &:focus {\n background-color: var(--color-btn-hover-bg);\n border: var(--borderWidth-thin, 1px) solid var(--color-btn-hover-bg);\n }\n\n /* Override .close-button's `border: 0` that triggers a border-color transition on hover */\n &.close-button {\n border: var(--borderWidth-thin, 1px) solid transparent;\n }\n}\n\n@define-mixin Overlay-backdrop {\n position: fixed;\n top: 0;\n right: 0;\n bottom: 0;\n left: 0;\n z-index: 999;\n display: flex;\n background-color: var(--color-neutral-muted);\n}\n\n@define-mixin Overlay-backdrop--transparent {\n position: absolute;\n z-index: 999;\n background-color: transparent;\n}\n\n/* variants must be mixins so we can extend within a media query (@extend is not supported inside media queries) */\n\n/* border-radius repeats within placement options to ensure the original radius is reset when two classes co-exist */\n\n/* center */\n@define-mixin Overlay-backdrop--center {\n @mixin Overlay-backdrop;\n\n align-items: center;\n justify-content: center;\n}\n\n/* anchor */\n@define-mixin Overlay-backdrop--anchor {\n @mixin Overlay-backdrop--transparent;\n}\n\n/* anchor side(s) */\n@define-mixin Overlay-backdrop--side $responsiveVariant {\n @mixin Overlay-backdrop;\n\n /* default left */\n align-items: center;\n justify-content: left;\n\n &.Overlay-backdrop--placement-left$(responsiveVariant) {\n align-items: center;\n justify-content: left;\n\n & > .Overlay$(responsiveVariant) {\n height: 100vh;\n max-height: unset;\n border-radius: var(--borderRadius-large, 12px);\n border-top-left-radius: 0;\n border-bottom-left-radius: 0;\n\n @media screen and (prefers-reduced-motion: no-preference) {\n animation: 250ms cubic-bezier(0.33, 1, 0.68, 1) 0s 1 normal none running Overlay--motion-slideInRight;\n }\n }\n }\n\n &.Overlay-backdrop--placement-right$(responsiveVariant) {\n align-items: center;\n justify-content: right;\n\n & > .Overlay$(responsiveVariant) {\n height: 100vh;\n max-height: unset;\n border-radius: var(--borderRadius-large, 12px);\n border-top-right-radius: 0;\n border-bottom-right-radius: 0;\n\n @media screen and (prefers-reduced-motion: no-preference) {\n animation: 250ms cubic-bezier(0.33, 1, 0.68, 1) 0s 1 normal none running Overlay--motion-slideInLeft;\n }\n }\n }\n\n &.Overlay-backdrop--placement-bottom$(responsiveVariant) {\n align-items: end;\n justify-content: center;\n\n & > .Overlay$(responsiveVariant) {\n width: 100vw;\n height: auto;\n max-height: calc(100vh - 2rem);\n border-radius: var(--borderRadius-large, 12px);\n border-bottom-right-radius: 0;\n border-bottom-left-radius: 0;\n\n @media screen and (prefers-reduced-motion: no-preference) {\n animation: 250ms cubic-bezier(0.33, 1, 0.68, 1) 0s 1 normal none running Overlay--motion-slideUp;\n }\n }\n }\n\n &.Overlay-backdrop--placement-top$(responsiveVariant) {\n align-items: start;\n justify-content: center;\n\n & > .Overlay$(responsiveVariant) {\n border-radius: var(--borderRadius-large, 12px);\n border-top-left-radius: 0;\n border-top-right-radius: 0;\n\n @media screen and (prefers-reduced-motion: no-preference) {\n animation: 250ms cubic-bezier(0.33, 1, 0.68, 1) 0s 1 normal none running Overlay--motion-slideDown;\n }\n }\n }\n}\n\n/* full width */\n@define-mixin Overlay-backdrop--full {\n @mixin Overlay-backdrop;\n\n & .Overlay {\n width: 100%;\n max-width: 100vw;\n height: 100%;\n max-height: 100vh;\n border-radius: unset !important;\n flex-grow: 1;\n }\n}\n\n/* Overlay variant classnames */\n.Overlay-backdrop--center {\n @mixin Overlay-backdrop--center;\n}\n\n.Overlay-backdrop--anchor {\n @mixin Overlay-backdrop--anchor;\n}\n\n.Overlay-backdrop--side {\n @mixin Overlay-backdrop--side;\n}\n\n.Overlay-backdrop--full {\n @mixin Overlay-backdrop--full;\n}\n\n/* responsive variants */\n\n/* --viewportRange-narrowLandscape */\n@media (max-width: 767px) {\n .Overlay-backdrop--center-whenNarrow {\n @mixin Overlay-backdrop--center;\n }\n\n .Overlay-backdrop--anchor-whenNarrow {\n @mixin Overlay-backdrop--anchor;\n }\n\n .Overlay-backdrop--side-whenNarrow {\n @mixin Overlay-backdrop--side -whenNarrow;\n }\n\n .Overlay-backdrop--full-whenNarrow {\n @mixin Overlay-backdrop--full;\n }\n}\n\n@keyframes Overlay--motion-slideDown {\n from {\n transform: translateY(-100%);\n }\n}\n\n@keyframes Overlay--motion-slideUp {\n from {\n transform: translateY(100%);\n }\n}\n\n@keyframes Overlay--motion-slideInRight {\n from {\n transform: translateX(-100%);\n }\n}\n\n@keyframes Overlay--motion-slideInLeft {\n from {\n transform: translateX(100%);\n }\n}\n"]}
1
+ {"version":3,"sources":["dialog.pcss"],"names":[],"mappings":"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","file":"dialog.css","sourcesContent":["/* Overlay */\n\n.Overlay--hidden {\n display: none !important;\n}\n\n.Overlay--visibilityHidden {\n height: 0;\n overflow: hidden;\n visibility: hidden;\n opacity: 0;\n}\n\n.Overlay {\n display: flex;\n width: min(var(--overlay-width), 100vw - 2rem);\n min-width: 192px;\n max-height: min(calc(100vh - 2rem), var(--overlay-height));\n white-space: normal;\n flex-direction: column;\n background-color: var(--color-canvas-overlay);\n border-radius: var(--borderRadius-large);\n box-shadow: var(--color-overlay-shadow);\n opacity: 1;\n\n &.Overlay--size-auto {\n min-width: 192px;\n max-width: calc(100vw - 2rem);\n max-height: calc(100vh - 2rem);\n }\n\n &.Overlay--size-full {\n width: 100vw;\n height: 100vh;\n }\n\n &.Overlay--size-xsmall {\n --overlay-width: 192px;\n\n max-height: calc(100vh - 2rem);\n }\n\n &.Overlay--size-small {\n --overlay-height: 256px;\n --overlay-width: 320px;\n }\n\n &.Overlay--size-small-portrait {\n --overlay-height: 432px;\n --overlay-width: 320px;\n }\n\n &.Overlay--size-medium {\n --overlay-height: 320px;\n --overlay-width: 480px;\n }\n\n &.Overlay--size-medium-portrait {\n --overlay-height: 600px;\n --overlay-width: 480px;\n }\n\n &.Overlay--size-large {\n --overlay-height: 432px;\n --overlay-width: 640px;\n }\n\n &.Overlay--size-xlarge {\n --overlay-height: 600px;\n --overlay-width: 960px;\n }\n\n &.Overlay--height-auto {\n height: auto;\n }\n\n /* start deprecate in favor of Alpha::Dialog */\n &.Overlay--height-xsmall {\n height: min(192px, 100vh - 2rem);\n }\n\n &.Overlay--height-small {\n height: min(256px, 100vh - 2rem);\n }\n\n &.Overlay--height-medium {\n height: min(320px, 100vh - 2rem);\n }\n\n &.Overlay--height-large {\n height: min(432px, 100vh - 2rem);\n }\n\n &.Overlay--height-xlarge {\n height: min(600px, 100vh - 2rem);\n }\n\n &.Overlay--width-auto {\n width: auto;\n }\n\n &.Overlay--width-small {\n width: min(256px, 100vw - 2rem);\n }\n\n &.Overlay--width-medium {\n width: min(320px, 100vw - 2rem);\n }\n\n &.Overlay--width-large {\n width: min(480px, 100vw - 2rem);\n }\n\n &.Overlay--width-xlarge {\n width: min(640px, 100vw - 2rem);\n }\n\n &.Overlay--width-xxlarge {\n width: min(960px, 100vw - 2rem);\n }\n\n /* end deprecate */\n\n &.Overlay--motion-scaleFade {\n @media screen and (prefers-reduced-motion: no-preference) {\n animation: 200ms cubic-bezier(0.33, 1, 0.68, 1) 0s 1 normal none running Overlay--motion-scaleFade;\n }\n }\n}\n\n@keyframes Overlay--motion-scaleFade {\n 0% {\n opacity: 0;\n transform: scale(0.5);\n }\n\n 100% {\n opacity: 1;\n transform: scale(1);\n }\n}\n\n/* for <form> element that wraps entire contents of overlay */\n.Overlay-form {\n display: flex;\n overflow: auto;\n flex-direction: column;\n flex-grow: 1;\n}\n\n.Overlay-header {\n z-index: 1;\n display: flex;\n flex-direction: column;\n\n &.Overlay-header--divided {\n padding-bottom: var(--stack-padding-condensed);\n box-shadow: inset 0 calc(var(--borderWidth-thin) * -1) var(--color-border-default);\n\n & + .Overlay-body {\n padding-top: var(--stack-padding-normal);\n }\n }\n\n &.Overlay-header--large {\n & .Overlay-headerContentWrap {\n & .Overlay-titleWrap {\n gap: var(--stack-gap-condensed);\n\n & .Overlay-title {\n font-size: var(--text-title-size-medium);\n }\n\n & .Overlay-description {\n font-size: var(--text-body-size-medium);\n }\n }\n }\n }\n\n & .Overlay-headerContentWrap {\n display: flex;\n align-items: flex-start;\n gap: var(--stack-gap-condensed);\n padding: var(--stack-gap-condensed) var(--stack-gap-condensed) 0 var(--stack-gap-condensed);\n\n & .Overlay-actionWrap {\n display: flex;\n flex-direction: row;\n gap: var(--stack-gap-condensed);\n }\n\n & .Overlay-titleWrap {\n display: flex;\n padding: calc(var(--stack-gap-condensed) * 0.75) 0 calc(var(--stack-gap-condensed) * 0.75)\n var(--stack-gap-condensed);\n flex-direction: column;\n flex-grow: 1;\n gap: var(--control-small-gap);\n\n & .Overlay-title {\n margin: 0;\n font-size: var(--text-body-size-medium);\n font-weight: var(--base-text-weight-semibold);\n }\n\n & .Overlay-description {\n margin: 0;\n font-size: var(--text-body-size-small);\n font-weight: var(--base-text-weight-normal);\n color: var(--color-fg-muted);\n }\n }\n }\n}\n\n/* generic body content slot */\n.Overlay-body {\n padding: var(--stack-padding-normal);\n padding-top: 0;\n overflow-y: auto;\n scrollbar-width: thin;\n font-size: var(--text-body-size-medium);\n flex-grow: 1;\n\n &.Overlay-body--paddingCondensed {\n padding: var(--stack-padding-condensed);\n padding-top: 0;\n }\n\n &.Overlay-body--paddingNone {\n padding: 0;\n }\n}\n\n/* generic footer slot */\n.Overlay-footer {\n z-index: 1;\n display: flex;\n padding: 0 var(--stack-padding-normal) var(--stack-padding-normal) var(--stack-padding-normal);\n flex-direction: row;\n flex-shrink: 0;\n flex-wrap: wrap;\n\n &.Overlay-footer--divided {\n padding-top: var(--stack-padding-normal);\n box-shadow: inset 0 var(--borderWidth-thin) var(--color-border-default);\n }\n\n &.Overlay-footer--alignStart {\n justify-content: flex-start;\n gap: var(--stack-gap-condensed);\n }\n\n &.Overlay-footer--alignCenter {\n justify-content: center;\n gap: var(--stack-gap-condensed);\n }\n\n &.Overlay-footer--alignEnd {\n justify-content: flex-end;\n gap: var(--stack-gap-condensed);\n }\n}\n\n/* TODO: replace with refactored IconButton */\n.Overlay-closeButton {\n position: relative;\n display: grid;\n width: var(--base-size-32);\n height: var(--base-size-32);\n padding: 0;\n color: var(--color-fg-muted);\n cursor: pointer;\n user-select: none;\n background-color: transparent;\n border: var(--borderWidth-thin) solid transparent;\n border-radius: var(--borderRadius-medium);\n transition: 0.2s cubic-bezier(0.3, 0, 0.5, 1);\n transition-property: color, background-color, border-color;\n place-content: center;\n align-self: flex-start;\n flex-shrink: 0;\n\n &:hover,\n &:focus {\n background-color: var(--color-btn-hover-bg);\n border: var(--borderWidth-thin) solid var(--color-btn-hover-bg);\n }\n\n /* Override .close-button's `border: 0` that triggers a border-color transition on hover */\n &.close-button {\n border: var(--borderWidth-thin) solid transparent;\n }\n}\n\n@define-mixin Overlay-backdrop {\n position: fixed;\n top: 0;\n right: 0;\n bottom: 0;\n left: 0;\n z-index: 999;\n display: flex;\n background-color: var(--color-neutral-muted);\n}\n\n@define-mixin Overlay-backdrop--transparent {\n position: absolute;\n z-index: 999;\n background-color: transparent;\n}\n\n/* variants must be mixins so we can extend within a media query (@extend is not supported inside media queries) */\n\n/* border-radius repeats within placement options to ensure the original radius is reset when two classes co-exist */\n\n/* center */\n@define-mixin Overlay-backdrop--center {\n @mixin Overlay-backdrop;\n\n align-items: center;\n justify-content: center;\n}\n\n/* anchor */\n@define-mixin Overlay-backdrop--anchor {\n @mixin Overlay-backdrop--transparent;\n}\n\n/* anchor side(s) */\n@define-mixin Overlay-backdrop--side $responsiveVariant {\n @mixin Overlay-backdrop;\n\n /* default left */\n align-items: center;\n justify-content: left;\n\n &.Overlay-backdrop--placement-left$(responsiveVariant) {\n align-items: center;\n justify-content: left;\n\n & > .Overlay$(responsiveVariant) {\n height: 100vh;\n max-height: unset;\n border-radius: var(--borderRadius-large);\n border-top-left-radius: 0;\n border-bottom-left-radius: 0;\n\n @media screen and (prefers-reduced-motion: no-preference) {\n animation: 250ms cubic-bezier(0.33, 1, 0.68, 1) 0s 1 normal none running Overlay--motion-slideInRight;\n }\n }\n }\n\n &.Overlay-backdrop--placement-right$(responsiveVariant) {\n align-items: center;\n justify-content: right;\n\n & > .Overlay$(responsiveVariant) {\n height: 100vh;\n max-height: unset;\n border-radius: var(--borderRadius-large);\n border-top-right-radius: 0;\n border-bottom-right-radius: 0;\n\n @media screen and (prefers-reduced-motion: no-preference) {\n animation: 250ms cubic-bezier(0.33, 1, 0.68, 1) 0s 1 normal none running Overlay--motion-slideInLeft;\n }\n }\n }\n\n &.Overlay-backdrop--placement-bottom$(responsiveVariant) {\n align-items: end;\n justify-content: center;\n\n & > .Overlay$(responsiveVariant) {\n width: 100vw;\n height: auto;\n max-height: calc(100vh - 2rem);\n border-radius: var(--borderRadius-large);\n border-bottom-right-radius: 0;\n border-bottom-left-radius: 0;\n\n @media screen and (prefers-reduced-motion: no-preference) {\n animation: 250ms cubic-bezier(0.33, 1, 0.68, 1) 0s 1 normal none running Overlay--motion-slideUp;\n }\n }\n }\n\n &.Overlay-backdrop--placement-top$(responsiveVariant) {\n align-items: start;\n justify-content: center;\n\n & > .Overlay$(responsiveVariant) {\n border-radius: var(--borderRadius-large);\n border-top-left-radius: 0;\n border-top-right-radius: 0;\n\n @media screen and (prefers-reduced-motion: no-preference) {\n animation: 250ms cubic-bezier(0.33, 1, 0.68, 1) 0s 1 normal none running Overlay--motion-slideDown;\n }\n }\n }\n}\n\n/* full width */\n@define-mixin Overlay-backdrop--full {\n @mixin Overlay-backdrop;\n\n & .Overlay {\n width: 100%;\n max-width: 100vw;\n height: 100%;\n max-height: 100vh;\n border-radius: unset !important;\n flex-grow: 1;\n }\n}\n\n/* Overlay variant classnames */\n.Overlay-backdrop--center {\n @mixin Overlay-backdrop--center;\n}\n\n.Overlay-backdrop--anchor {\n @mixin Overlay-backdrop--anchor;\n}\n\n.Overlay-backdrop--side {\n @mixin Overlay-backdrop--side;\n}\n\n.Overlay-backdrop--full {\n @mixin Overlay-backdrop--full;\n}\n\n/* responsive variants */\n\n/* --viewportRange-narrowLandscape */\n@media (max-width: 767px) {\n .Overlay-backdrop--center-whenNarrow {\n @mixin Overlay-backdrop--center;\n }\n\n .Overlay-backdrop--anchor-whenNarrow {\n @mixin Overlay-backdrop--anchor;\n }\n\n .Overlay-backdrop--side-whenNarrow {\n @mixin Overlay-backdrop--side -whenNarrow;\n }\n\n .Overlay-backdrop--full-whenNarrow {\n @mixin Overlay-backdrop--full;\n }\n}\n\n@keyframes Overlay--motion-slideDown {\n from {\n transform: translateY(-100%);\n }\n}\n\n@keyframes Overlay--motion-slideUp {\n from {\n transform: translateY(100%);\n }\n}\n\n@keyframes Overlay--motion-slideInRight {\n from {\n transform: translateX(-100%);\n }\n}\n\n@keyframes Overlay--motion-slideInLeft {\n from {\n transform: translateX(100%);\n }\n}\n"]}
@@ -19,7 +19,7 @@
19
19
  white-space: normal;
20
20
  flex-direction: column;
21
21
  background-color: var(--color-canvas-overlay);
22
- border-radius: var(--borderRadius-large, 12px);
22
+ border-radius: var(--borderRadius-large);
23
23
  box-shadow: var(--color-overlay-shadow);
24
24
  opacity: 1;
25
25
 
@@ -154,25 +154,25 @@
154
154
  flex-direction: column;
155
155
 
156
156
  &.Overlay-header--divided {
157
- padding-bottom: var(--stack-padding-condensed, 8px);
158
- box-shadow: inset 0 calc(var(--borderWidth-thin, 1px) * -1) var(--color-border-default);
157
+ padding-bottom: var(--stack-padding-condensed);
158
+ box-shadow: inset 0 calc(var(--borderWidth-thin) * -1) var(--color-border-default);
159
159
 
160
160
  & + .Overlay-body {
161
- padding-top: var(--stack-padding-normal, 16px);
161
+ padding-top: var(--stack-padding-normal);
162
162
  }
163
163
  }
164
164
 
165
165
  &.Overlay-header--large {
166
166
  & .Overlay-headerContentWrap {
167
167
  & .Overlay-titleWrap {
168
- gap: var(--stack-gap-condensed, 8px);
168
+ gap: var(--stack-gap-condensed);
169
169
 
170
170
  & .Overlay-title {
171
- font-size: var(--text-title-size-medium, 20px);
171
+ font-size: var(--text-title-size-medium);
172
172
  }
173
173
 
174
174
  & .Overlay-description {
175
- font-size: var(--text-body-size-medium, 14px);
175
+ font-size: var(--text-body-size-medium);
176
176
  }
177
177
  }
178
178
  }
@@ -181,33 +181,33 @@
181
181
  & .Overlay-headerContentWrap {
182
182
  display: flex;
183
183
  align-items: flex-start;
184
- gap: var(--stack-gap-condensed, 8px);
185
- padding: var(--stack-gap-condensed, 8px) var(--stack-gap-condensed, 8px) 0 var(--stack-gap-condensed, 8px);
184
+ gap: var(--stack-gap-condensed);
185
+ padding: var(--stack-gap-condensed) var(--stack-gap-condensed) 0 var(--stack-gap-condensed);
186
186
 
187
187
  & .Overlay-actionWrap {
188
188
  display: flex;
189
189
  flex-direction: row;
190
- gap: var(--stack-gap-condensed, 8px);
190
+ gap: var(--stack-gap-condensed);
191
191
  }
192
192
 
193
193
  & .Overlay-titleWrap {
194
194
  display: flex;
195
- padding: calc(var(--stack-gap-condensed, 8px) * 0.75) 0 calc(var(--stack-gap-condensed, 8px) * 0.75)
196
- var(--stack-gap-condensed, 8px);
195
+ padding: calc(var(--stack-gap-condensed) * 0.75) 0 calc(var(--stack-gap-condensed) * 0.75)
196
+ var(--stack-gap-condensed);
197
197
  flex-direction: column;
198
198
  flex-grow: 1;
199
- gap: var(--control-small-gap, 4px);
199
+ gap: var(--control-small-gap);
200
200
 
201
201
  & .Overlay-title {
202
202
  margin: 0;
203
- font-size: var(--text-body-size-medium, 14px);
204
- font-weight: var(--base-text-weight-semibold, 600);
203
+ font-size: var(--text-body-size-medium);
204
+ font-weight: var(--base-text-weight-semibold);
205
205
  }
206
206
 
207
207
  & .Overlay-description {
208
208
  margin: 0;
209
- font-size: var(--text-body-size-small, 12px);
210
- font-weight: var(--base-text-weight-normal, 400);
209
+ font-size: var(--text-body-size-small);
210
+ font-weight: var(--base-text-weight-normal);
211
211
  color: var(--color-fg-muted);
212
212
  }
213
213
  }
@@ -216,15 +216,15 @@
216
216
 
217
217
  /* generic body content slot */
218
218
  .Overlay-body {
219
- padding: var(--stack-padding-normal, 16px);
219
+ padding: var(--stack-padding-normal);
220
220
  padding-top: 0;
221
221
  overflow-y: auto;
222
222
  scrollbar-width: thin;
223
- font-size: var(--text-body-size-medium, 14px);
223
+ font-size: var(--text-body-size-medium);
224
224
  flex-grow: 1;
225
225
 
226
226
  &.Overlay-body--paddingCondensed {
227
- padding: var(--stack-padding-condensed, 8px);
227
+ padding: var(--stack-padding-condensed);
228
228
  padding-top: 0;
229
229
  }
230
230
 
@@ -237,29 +237,29 @@
237
237
  .Overlay-footer {
238
238
  z-index: 1;
239
239
  display: flex;
240
- padding: 0 var(--stack-padding-normal, 16px) var(--stack-padding-normal, 16px) var(--stack-padding-normal, 16px);
240
+ padding: 0 var(--stack-padding-normal) var(--stack-padding-normal) var(--stack-padding-normal);
241
241
  flex-direction: row;
242
242
  flex-shrink: 0;
243
243
  flex-wrap: wrap;
244
244
 
245
245
  &.Overlay-footer--divided {
246
- padding-top: var(--stack-padding-normal, 16px);
247
- box-shadow: inset 0 var(--borderWidth-thin, 1px) var(--color-border-default);
246
+ padding-top: var(--stack-padding-normal);
247
+ box-shadow: inset 0 var(--borderWidth-thin) var(--color-border-default);
248
248
  }
249
249
 
250
250
  &.Overlay-footer--alignStart {
251
251
  justify-content: flex-start;
252
- gap: var(--stack-gap-condensed, 8px);
252
+ gap: var(--stack-gap-condensed);
253
253
  }
254
254
 
255
255
  &.Overlay-footer--alignCenter {
256
256
  justify-content: center;
257
- gap: var(--stack-gap-condensed, 8px);
257
+ gap: var(--stack-gap-condensed);
258
258
  }
259
259
 
260
260
  &.Overlay-footer--alignEnd {
261
261
  justify-content: flex-end;
262
- gap: var(--stack-gap-condensed, 8px);
262
+ gap: var(--stack-gap-condensed);
263
263
  }
264
264
  }
265
265
 
@@ -267,15 +267,15 @@
267
267
  .Overlay-closeButton {
268
268
  position: relative;
269
269
  display: grid;
270
- width: var(--base-size-32, 32px);
271
- height: var(--base-size-32, 32px);
270
+ width: var(--base-size-32);
271
+ height: var(--base-size-32);
272
272
  padding: 0;
273
273
  color: var(--color-fg-muted);
274
274
  cursor: pointer;
275
275
  user-select: none;
276
276
  background-color: transparent;
277
- border: var(--borderWidth-thin, 1px) solid transparent;
278
- border-radius: var(--borderRadius-medium, 6px);
277
+ border: var(--borderWidth-thin) solid transparent;
278
+ border-radius: var(--borderRadius-medium);
279
279
  transition: 0.2s cubic-bezier(0.3, 0, 0.5, 1);
280
280
  transition-property: color, background-color, border-color;
281
281
  place-content: center;
@@ -285,12 +285,12 @@
285
285
  &:hover,
286
286
  &:focus {
287
287
  background-color: var(--color-btn-hover-bg);
288
- border: var(--borderWidth-thin, 1px) solid var(--color-btn-hover-bg);
288
+ border: var(--borderWidth-thin) solid var(--color-btn-hover-bg);
289
289
  }
290
290
 
291
291
  /* Override .close-button's `border: 0` that triggers a border-color transition on hover */
292
292
  &.close-button {
293
- border: var(--borderWidth-thin, 1px) solid transparent;
293
+ border: var(--borderWidth-thin) solid transparent;
294
294
  }
295
295
  }
296
296
 
@@ -343,7 +343,7 @@
343
343
  & > .Overlay$(responsiveVariant) {
344
344
  height: 100vh;
345
345
  max-height: unset;
346
- border-radius: var(--borderRadius-large, 12px);
346
+ border-radius: var(--borderRadius-large);
347
347
  border-top-left-radius: 0;
348
348
  border-bottom-left-radius: 0;
349
349
 
@@ -360,7 +360,7 @@
360
360
  & > .Overlay$(responsiveVariant) {
361
361
  height: 100vh;
362
362
  max-height: unset;
363
- border-radius: var(--borderRadius-large, 12px);
363
+ border-radius: var(--borderRadius-large);
364
364
  border-top-right-radius: 0;
365
365
  border-bottom-right-radius: 0;
366
366
 
@@ -378,7 +378,7 @@
378
378
  width: 100vw;
379
379
  height: auto;
380
380
  max-height: calc(100vh - 2rem);
381
- border-radius: var(--borderRadius-large, 12px);
381
+ border-radius: var(--borderRadius-large);
382
382
  border-bottom-right-radius: 0;
383
383
  border-bottom-left-radius: 0;
384
384
 
@@ -393,7 +393,7 @@
393
393
  justify-content: center;
394
394
 
395
395
  & > .Overlay$(responsiveVariant) {
396
- border-radius: var(--borderRadius-large, 12px);
396
+ border-radius: var(--borderRadius-large);
397
397
  border-top-left-radius: 0;
398
398
  border-top-right-radius: 0;
399
399
 
@@ -1 +1 @@
1
- .dropdown{position:relative}.dropdown-caret{border-bottom-color:#0000;border-left-color:#0000;border-right-color:#0000;border-style:solid;border-width:var(--borderWidth-thicker,4px) var(--borderWidth-thicker,4px) 0;content:"";display:inline-block;height:0;vertical-align:middle;width:0}.dropdown-menu{background-clip:padding-box;background-color:var(--color-canvas-overlay);border:var(--borderWidth-thin,1px) solid var(--color-border-default);border-radius:var(--borderRadius-medium,6px);box-shadow:var(--color-shadow-large);left:0;list-style:none;margin-top:2px;padding-bottom:var(--control-small-paddingBlock,4px);padding-top:var(--control-small-paddingBlock,4px);position:absolute;top:100%;width:160px;z-index:100}.dropdown-menu:after,.dropdown-menu:before{content:"";display:inline-block;position:absolute}.dropdown-menu:before{border:8px solid #0000;border-bottom:8px solid var(--color-border-default)}.dropdown-menu:after{border:7px solid #0000;border-bottom:7px solid var(--color-canvas-overlay)}.dropdown-menu>ul{list-style:none}.dropdown-menu-no-overflow{width:auto}.dropdown-menu-no-overflow .dropdown-item{overflow:visible;padding:var(--control-small-paddingBlock,4px) var(--control-medium-paddingInline-spacious,16px);text-overflow:inherit}.dropdown-item{color:var(--color-fg-default);display:block;overflow:hidden;padding:var(--control-small-paddingBlock,4px) var(--control-medium-paddingInline-condensed,8px) var(--control-small-paddingBlock,4px) var(--control-medium-paddingInline-spacious,16px);text-overflow:ellipsis;white-space:nowrap}.dropdown-item:hover{background-color:var(--color-accent-emphasis);color:var(--color-fg-on-emphasis);text-decoration:none}.dropdown-item:hover>.octicon{color:inherit;opacity:1}.dropdown-item:hover [class*=color-fg-],.dropdown-item:hover>.Label{color:inherit!important}.dropdown-item:hover>.Label{border-color:currentcolor}.dropdown-item.btn-link,.dropdown-signout{text-align:left;width:100%}.dropdown-signout{background:none;border:0}.dropdown-divider{border-top:var(--borderWidth-thin,1px) solid var(--color-border-default);display:block;height:0;margin:var(--stack-gap-condensed,8px) 0}.dropdown-header{color:var(--color-fg-muted);font-size:var(--text-body-size-small,12px);padding:var(--control-small-paddingBlock,4px) var(--control-medium-paddingInline-spacious,16px)}.dropdown-item[aria-checked=false] .octicon-check{display:none}.dropdown-menu-w{left:auto;margin-right:8px;margin-top:0;right:100%;top:0;width:auto}.dropdown-menu-w:before{border-color:#0000;border-left-color:var(--color-border-default);left:auto;right:-16px;top:10px}.dropdown-menu-w:after{border-color:#0000;border-left-color:var(--color-canvas-overlay);left:auto;right:-14px;top:11px}.dropdown-menu-e{left:100%;margin-left:8px;margin-top:0;top:0;width:auto}.dropdown-menu-e:before{border-color:#0000;border-right-color:var(--color-border-default);left:-16px;top:10px}.dropdown-menu-e:after{border-color:#0000;border-right-color:var(--color-canvas-overlay);left:-14px;top:11px}.dropdown-menu-ne{bottom:100%;left:0;margin-bottom:3px;top:auto}.dropdown-menu-ne:after,.dropdown-menu-ne:before{right:auto;top:auto}.dropdown-menu-ne:before{border-bottom:0;border-left:8px solid #0000;border-right:8px solid #0000;border-top:8px solid var(--color-border-default);bottom:-8px;left:9px}.dropdown-menu-ne:after{border-bottom:0;border-left:7px solid #0000;border-right:7px solid #0000;border-top:7px solid var(--color-canvas-overlay);bottom:-7px;left:10px}.dropdown-menu-s{left:auto;right:50%;transform:translateX(50%)}.dropdown-menu-s:before{right:50%;top:-16px;transform:translateX(50%)}.dropdown-menu-s:after{right:50%;top:-14px;transform:translateX(50%)}.dropdown-menu-sw{left:auto;right:0}.dropdown-menu-sw:before{left:auto;right:9px;top:-16px}.dropdown-menu-sw:after{left:auto;right:10px;top:-14px}.dropdown-menu-se:before{left:9px;top:-16px}.dropdown-menu-se:after{left:10px;top:-14px}
1
+ .dropdown{position:relative}.dropdown-caret{border-bottom-color:#0000;border-left-color:#0000;border-right-color:#0000;border-style:solid;border-width:var(--borderWidth-thicker,max(4px,.25rem)) var(--borderWidth-thicker,max(4px,.25rem)) 0;content:"";display:inline-block;height:0;vertical-align:middle;width:0}.dropdown-menu{background-clip:padding-box;background-color:var(--color-canvas-overlay);border:var(--borderWidth-thin,max(1px,.0625rem)) solid var(--color-border-default);border-radius:var(--borderRadius-medium,6px);box-shadow:var(--color-shadow-large);left:0;list-style:none;margin-top:2px;padding-bottom:var(--control-small-paddingBlock,.25rem);padding-top:var(--control-small-paddingBlock,.25rem);position:absolute;top:100%;width:160px;z-index:100}.dropdown-menu:after,.dropdown-menu:before{content:"";display:inline-block;position:absolute}.dropdown-menu:before{border:8px solid #0000;border-bottom:8px solid var(--color-border-default)}.dropdown-menu:after{border:7px solid #0000;border-bottom:7px solid var(--color-canvas-overlay)}.dropdown-menu>ul{list-style:none}.dropdown-menu-no-overflow{width:auto}.dropdown-menu-no-overflow .dropdown-item{overflow:visible;padding:var(--control-small-paddingBlock,.25rem) var(--control-medium-paddingInline-spacious,1rem);text-overflow:inherit}.dropdown-item{color:var(--color-fg-default);display:block;overflow:hidden;padding:var(--control-small-paddingBlock,.25rem) var(--control-medium-paddingInline-condensed,.5rem) var(--control-small-paddingBlock,.25rem) var(--control-medium-paddingInline-spacious,1rem);text-overflow:ellipsis;white-space:nowrap}.dropdown-item:hover{background-color:var(--color-accent-emphasis);color:var(--color-fg-on-emphasis);text-decoration:none}.dropdown-item:hover>.octicon{color:inherit;opacity:1}.dropdown-item:hover [class*=color-fg-],.dropdown-item:hover>.Label{color:inherit!important}.dropdown-item:hover>.Label{border-color:currentcolor}.dropdown-item.btn-link,.dropdown-signout{text-align:left;width:100%}.dropdown-signout{background:none;border:0}.dropdown-divider{border-top:var(--borderWidth-thin,max(1px,.0625rem)) solid var(--color-border-default);display:block;height:0;margin:var(--stack-gap-condensed,.5rem) 0}.dropdown-header{color:var(--color-fg-muted);font-size:var(--text-body-size-small,.75rem);padding:var(--control-small-paddingBlock,.25rem) var(--control-medium-paddingInline-spacious,1rem)}.dropdown-item[aria-checked=false] .octicon-check{display:none}.dropdown-menu-w{left:auto;margin-right:8px;margin-top:0;right:100%;top:0;width:auto}.dropdown-menu-w:before{border-color:#0000;border-left-color:var(--color-border-default);left:auto;right:-16px;top:10px}.dropdown-menu-w:after{border-color:#0000;border-left-color:var(--color-canvas-overlay);left:auto;right:-14px;top:11px}.dropdown-menu-e{left:100%;margin-left:8px;margin-top:0;top:0;width:auto}.dropdown-menu-e:before{border-color:#0000;border-right-color:var(--color-border-default);left:-16px;top:10px}.dropdown-menu-e:after{border-color:#0000;border-right-color:var(--color-canvas-overlay);left:-14px;top:11px}.dropdown-menu-ne{bottom:100%;left:0;margin-bottom:3px;top:auto}.dropdown-menu-ne:after,.dropdown-menu-ne:before{right:auto;top:auto}.dropdown-menu-ne:before{border-bottom:0;border-left:8px solid #0000;border-right:8px solid #0000;border-top:8px solid var(--color-border-default);bottom:-8px;left:9px}.dropdown-menu-ne:after{border-bottom:0;border-left:7px solid #0000;border-right:7px solid #0000;border-top:7px solid var(--color-canvas-overlay);bottom:-7px;left:10px}.dropdown-menu-s{left:auto;right:50%;transform:translateX(50%)}.dropdown-menu-s:before{right:50%;top:-16px;transform:translateX(50%)}.dropdown-menu-s:after{right:50%;top:-14px;transform:translateX(50%)}.dropdown-menu-sw{left:auto;right:0}.dropdown-menu-sw:before{left:auto;right:9px;top:-16px}.dropdown-menu-sw:after{left:auto;right:10px;top:-14px}.dropdown-menu-se:before{left:9px;top:-16px}.dropdown-menu-se:after{left:10px;top:-14px}
@@ -1 +1 @@
1
- {"version":3,"sources":["dropdown.pcss"],"names":[],"mappings":"AAEA,UACE,iBACF,CAEA,gBASE,yBAAgC,CAChC,uBAA8B,CAF9B,wBAA+B,CAF/B,kBAAmB,CACnB,4EAA+E,CAF/E,UAAW,CAJX,oBAAqB,CAErB,QAAS,CACT,qBAAsB,CAFtB,OASF,CAKA,eAWE,2BAA4B,CAD5B,4CAA6C,CAE7C,oEAAsE,CACtE,4CAA8C,CAC9C,oCAAqC,CAXrC,MAAO,CAMP,eAAgB,CADhB,cAAe,CADf,oDAAsD,CADtD,iDAAmD,CALnD,iBAAkB,CAClB,QAAS,CAGT,WAAY,CADZ,WAkCF,CAtBE,2CAIE,UAAW,CADX,oBAAqB,CADrB,iBAGF,CAGA,sBAEE,sBAAgD,CAAhD,mDACF,CAGA,qBAEE,sBAAgD,CAAhD,mDACF,CAEA,kBACE,eACF,CAGF,2BACE,UAOF,CALE,0CAEE,gBAAiB,CADjB,+FAAkG,CAElG,qBACF,CAIF,eAKE,6BAA8B,CAJ9B,aAAc,CAGd,eAAgB,CAFhB,uLAC2F,CAG3F,sBAAuB,CACvB,kBA0BF,CAxBE,qBAGE,6CAA8C,CAF9C,iCAAkC,CAClC,oBAgBF,CAbE,8BACE,aAAc,CACd,SACF,CAMA,oEACE,uBAEF,CAHA,4BAEE,yBACF,CASJ,0CAJI,eAAgB,CADhB,UAUJ,CALA,kBAGE,eAAgB,CAChB,QACF,CAEA,kBAIE,wEAA0E,CAH1E,aAAc,CACd,QAAS,CACT,uCAEF,CAEA,iBAGE,2BAA4B,CAD5B,0CAA4C,CAD5C,+FAGF,CAEA,kDACE,YACF,CAOA,iBAGE,SAAU,CAGV,gBAAiB,CADjB,YAAa,CAHb,UAAW,CADX,KAAM,CAGN,UAmBF,CAfE,wBAIE,kBAAyB,CACzB,6CAA8C,CAF9C,SAAU,CADV,WAAY,CADZ,QAKF,CAEA,uBAIE,kBAAyB,CACzB,6CAA8C,CAF9C,SAAU,CADV,WAAY,CADZ,QAKF,CAGF,iBAEE,SAAU,CAGV,eAAgB,CADhB,YAAa,CAHb,KAAM,CAEN,UAiBF,CAbE,wBAGE,kBAAyB,CACzB,8CAA+C,CAF/C,UAAW,CADX,QAIF,CAEA,uBAGE,kBAAyB,CACzB,8CAA+C,CAF/C,UAAW,CADX,QAIF,CAGF,kBAEE,WAAY,CACZ,MAAO,CACP,iBAAkB,CAHlB,QA4BF,CAvBE,iDAGE,UAAW,CADX,QAEF,CAEA,yBAKE,eAAgB,CAChB,2BAAkC,CAFlC,4BAAmC,CADnC,gDAAiD,CAFjD,WAAY,CACZ,QAKF,CAEA,wBAKE,eAAgB,CAChB,2BAAkC,CAFlC,4BAAmC,CADnC,gDAAiD,CAFjD,WAAY,CACZ,SAKF,CAGF,iBAEE,SAAU,CADV,SAAU,CAEV,yBAaF,CAXE,wBAEE,SAAU,CADV,SAAU,CAEV,yBACF,CAEA,uBAEE,SAAU,CADV,SAAU,CAEV,yBACF,CAGF,kBAEE,SAAU,CADV,OAcF,CAXE,yBAGE,SAAU,CADV,SAAU,CADV,SAGF,CAEA,wBAGE,SAAU,CADV,UAAW,CADX,SAGF,CAIA,yBAEE,QAAS,CADT,SAEF,CAEA,wBAEE,SAAU,CADV,SAEF","file":"dropdown.css","sourcesContent":["/* dropdown */\n\n.dropdown {\n position: relative;\n}\n\n.dropdown-caret {\n display: inline-block;\n width: 0;\n height: 0;\n vertical-align: middle;\n content: '';\n border-style: solid;\n border-width: var(--borderWidth-thicker, 4px) var(--borderWidth-thicker, 4px) 0;\n border-right-color: transparent;\n border-bottom-color: transparent;\n border-left-color: transparent;\n}\n\n/* Requires a positioning class (e.g., `.dropdown-menu-w`) to determine which\n** way the menu should render from the element triggering it. */\n\n.dropdown-menu {\n position: absolute;\n top: 100%;\n left: 0;\n z-index: 100;\n width: 160px;\n padding-top: var(--control-small-paddingBlock, 4px);\n padding-bottom: var(--control-small-paddingBlock, 4px);\n margin-top: 2px;\n list-style: none;\n background-color: var(--color-canvas-overlay);\n background-clip: padding-box;\n border: var(--borderWidth-thin, 1px) solid var(--color-border-default);\n border-radius: var(--borderRadius-medium, 6px);\n box-shadow: var(--color-shadow-large);\n\n &::before,\n &::after {\n position: absolute;\n display: inline-block;\n content: '';\n }\n\n /* caret border */\n &::before {\n border: 8px solid transparent;\n border-bottom-color: var(--color-border-default);\n }\n\n /* caret background (should match dropdown background) */\n &::after {\n border: 7px solid transparent;\n border-bottom-color: var(--color-canvas-overlay);\n }\n\n & > ul {\n list-style: none;\n }\n}\n\n.dropdown-menu-no-overflow {\n width: auto;\n\n & .dropdown-item {\n padding: var(--control-small-paddingBlock, 4px) var(--control-medium-paddingInline-spacious, 16px);\n overflow: visible;\n text-overflow: inherit;\n }\n}\n\n/* Dropdown items (can be links or buttons) */\n.dropdown-item {\n display: block;\n padding: var(--control-small-paddingBlock, 4px) var(--control-medium-paddingInline-condensed, 8px)\n var(--control-small-paddingBlock, 4px) var(--control-medium-paddingInline-spacious, 16px);\n overflow: hidden;\n color: var(--color-fg-default);\n text-overflow: ellipsis;\n white-space: nowrap;\n\n &:hover {\n color: var(--color-fg-on-emphasis);\n text-decoration: none;\n background-color: var(--color-accent-emphasis);\n\n & > .octicon {\n color: inherit;\n opacity: 1;\n }\n\n & [class*='color-fg-'] {\n color: inherit !important;\n }\n\n & > .Label {\n color: inherit !important;\n border-color: currentcolor;\n }\n }\n\n &.btn-link {\n width: 100%;\n text-align: left;\n }\n}\n\n.dropdown-signout {\n width: 100%;\n text-align: left;\n background: none;\n border: 0;\n}\n\n.dropdown-divider {\n display: block;\n height: 0;\n margin: var(--stack-gap-condensed, 8px) 0;\n border-top: var(--borderWidth-thin, 1px) solid var(--color-border-default);\n}\n\n.dropdown-header {\n padding: var(--control-small-paddingBlock, 4px) var(--control-medium-paddingInline-spacious, 16px);\n font-size: var(--text-body-size-small, 12px);\n color: var(--color-fg-muted);\n}\n\n.dropdown-item[aria-checked='false'] .octicon-check {\n display: none;\n}\n\n/* Directional classes\n**\n** Move the menu and the caret attached to it. Requires at least one of these on\n** the `.dropdown-menu` element. */\n\n.dropdown-menu-w {\n top: 0;\n right: 100%;\n left: auto;\n width: auto;\n margin-top: 0;\n margin-right: 8px;\n\n &::before {\n top: 10px;\n right: -16px;\n left: auto;\n border-color: transparent;\n border-left-color: var(--color-border-default);\n }\n\n &::after {\n top: 11px;\n right: -14px;\n left: auto;\n border-color: transparent;\n border-left-color: var(--color-canvas-overlay);\n }\n}\n\n.dropdown-menu-e {\n top: 0;\n left: 100%;\n width: auto;\n margin-top: 0;\n margin-left: 8px;\n\n &::before {\n top: 10px;\n left: -16px;\n border-color: transparent;\n border-right-color: var(--color-border-default);\n }\n\n &::after {\n top: 11px;\n left: -14px;\n border-color: transparent;\n border-right-color: var(--color-canvas-overlay);\n }\n}\n\n.dropdown-menu-ne {\n top: auto;\n bottom: 100%;\n left: 0;\n margin-bottom: 3px;\n\n &::before,\n &::after {\n top: auto;\n right: auto;\n }\n\n &::before {\n bottom: -8px;\n left: 9px;\n border-top: 8px solid var(--color-border-default);\n border-right: 8px solid transparent;\n border-bottom: 0;\n border-left: 8px solid transparent;\n }\n\n &::after {\n bottom: -7px;\n left: 10px;\n border-top: 7px solid var(--color-canvas-overlay);\n border-right: 7px solid transparent;\n border-bottom: 0;\n border-left: 7px solid transparent;\n }\n}\n\n.dropdown-menu-s {\n right: 50%;\n left: auto;\n transform: translateX(50%);\n\n &::before {\n top: -16px;\n right: 50%;\n transform: translateX(50%);\n }\n\n &::after {\n top: -14px;\n right: 50%;\n transform: translateX(50%);\n }\n}\n\n.dropdown-menu-sw {\n right: 0;\n left: auto;\n\n &::before {\n top: -16px;\n right: 9px;\n left: auto;\n }\n\n &::after {\n top: -14px;\n right: 10px;\n left: auto;\n }\n}\n\n.dropdown-menu-se {\n &::before {\n top: -16px;\n left: 9px;\n }\n\n &::after {\n top: -14px;\n left: 10px;\n }\n}\n"]}
1
+ {"version":3,"sources":["dropdown.pcss"],"names":[],"mappings":"AAEA,UACE,iBACF,CAEA,gBASE,yBAAgC,CAChC,uBAA8B,CAF9B,wBAA+B,CAF/B,kBAAmB,CACnB,oGAAqE,CAFrE,UAAW,CAJX,oBAAqB,CAErB,QAAS,CACT,qBAAsB,CAFtB,OASF,CAKA,eAWE,2BAA4B,CAD5B,4CAA6C,CAE7C,kFAAiE,CACjE,4CAAyC,CACzC,oCAAqC,CAXrC,MAAO,CAMP,eAAgB,CADhB,cAAe,CADf,uDAAiD,CADjD,oDAA8C,CAL9C,iBAAkB,CAClB,QAAS,CAGT,WAAY,CADZ,WAkCF,CAtBE,2CAIE,UAAW,CADX,oBAAqB,CADrB,iBAGF,CAGA,sBAEE,sBAAgD,CAAhD,mDACF,CAGA,qBAEE,sBAAgD,CAAhD,mDACF,CAEA,kBACE,eACF,CAGF,2BACE,UAOF,CALE,0CAEE,gBAAiB,CADjB,kGAAuF,CAEvF,qBACF,CAIF,eAKE,6BAA8B,CAJ9B,aAAc,CAGd,eAAgB,CAFhB,+LACgF,CAGhF,sBAAuB,CACvB,kBA0BF,CAxBE,qBAGE,6CAA8C,CAF9C,iCAAkC,CAClC,oBAgBF,CAbE,8BACE,aAAc,CACd,SACF,CAMA,oEACE,uBAEF,CAHA,4BAEE,yBACF,CASJ,0CAJI,eAAgB,CADhB,UAUJ,CALA,kBAGE,eAAgB,CAChB,QACF,CAEA,kBAIE,sFAAqE,CAHrE,aAAc,CACd,QAAS,CACT,yCAEF,CAEA,iBAGE,2BAA4B,CAD5B,4CAAsC,CADtC,kGAGF,CAEA,kDACE,YACF,CAOA,iBAGE,SAAU,CAGV,gBAAiB,CADjB,YAAa,CAHb,UAAW,CADX,KAAM,CAGN,UAmBF,CAfE,wBAIE,kBAAyB,CACzB,6CAA8C,CAF9C,SAAU,CADV,WAAY,CADZ,QAKF,CAEA,uBAIE,kBAAyB,CACzB,6CAA8C,CAF9C,SAAU,CADV,WAAY,CADZ,QAKF,CAGF,iBAEE,SAAU,CAGV,eAAgB,CADhB,YAAa,CAHb,KAAM,CAEN,UAiBF,CAbE,wBAGE,kBAAyB,CACzB,8CAA+C,CAF/C,UAAW,CADX,QAIF,CAEA,uBAGE,kBAAyB,CACzB,8CAA+C,CAF/C,UAAW,CADX,QAIF,CAGF,kBAEE,WAAY,CACZ,MAAO,CACP,iBAAkB,CAHlB,QA4BF,CAvBE,iDAGE,UAAW,CADX,QAEF,CAEA,yBAKE,eAAgB,CAChB,2BAAkC,CAFlC,4BAAmC,CADnC,gDAAiD,CAFjD,WAAY,CACZ,QAKF,CAEA,wBAKE,eAAgB,CAChB,2BAAkC,CAFlC,4BAAmC,CADnC,gDAAiD,CAFjD,WAAY,CACZ,SAKF,CAGF,iBAEE,SAAU,CADV,SAAU,CAEV,yBAaF,CAXE,wBAEE,SAAU,CADV,SAAU,CAEV,yBACF,CAEA,uBAEE,SAAU,CADV,SAAU,CAEV,yBACF,CAGF,kBAEE,SAAU,CADV,OAcF,CAXE,yBAGE,SAAU,CADV,SAAU,CADV,SAGF,CAEA,wBAGE,SAAU,CADV,UAAW,CADX,SAGF,CAIA,yBAEE,QAAS,CADT,SAEF,CAEA,wBAEE,SAAU,CADV,SAEF","file":"dropdown.css","sourcesContent":["/* dropdown */\n\n.dropdown {\n position: relative;\n}\n\n.dropdown-caret {\n display: inline-block;\n width: 0;\n height: 0;\n vertical-align: middle;\n content: '';\n border-style: solid;\n border-width: var(--borderWidth-thicker) var(--borderWidth-thicker) 0;\n border-right-color: transparent;\n border-bottom-color: transparent;\n border-left-color: transparent;\n}\n\n/* Requires a positioning class (e.g., `.dropdown-menu-w`) to determine which\n** way the menu should render from the element triggering it. */\n\n.dropdown-menu {\n position: absolute;\n top: 100%;\n left: 0;\n z-index: 100;\n width: 160px;\n padding-top: var(--control-small-paddingBlock);\n padding-bottom: var(--control-small-paddingBlock);\n margin-top: 2px;\n list-style: none;\n background-color: var(--color-canvas-overlay);\n background-clip: padding-box;\n border: var(--borderWidth-thin) solid var(--color-border-default);\n border-radius: var(--borderRadius-medium);\n box-shadow: var(--color-shadow-large);\n\n &::before,\n &::after {\n position: absolute;\n display: inline-block;\n content: '';\n }\n\n /* caret border */\n &::before {\n border: 8px solid transparent;\n border-bottom-color: var(--color-border-default);\n }\n\n /* caret background (should match dropdown background) */\n &::after {\n border: 7px solid transparent;\n border-bottom-color: var(--color-canvas-overlay);\n }\n\n & > ul {\n list-style: none;\n }\n}\n\n.dropdown-menu-no-overflow {\n width: auto;\n\n & .dropdown-item {\n padding: var(--control-small-paddingBlock) var(--control-medium-paddingInline-spacious);\n overflow: visible;\n text-overflow: inherit;\n }\n}\n\n/* Dropdown items (can be links or buttons) */\n.dropdown-item {\n display: block;\n padding: var(--control-small-paddingBlock) var(--control-medium-paddingInline-condensed)\n var(--control-small-paddingBlock) var(--control-medium-paddingInline-spacious);\n overflow: hidden;\n color: var(--color-fg-default);\n text-overflow: ellipsis;\n white-space: nowrap;\n\n &:hover {\n color: var(--color-fg-on-emphasis);\n text-decoration: none;\n background-color: var(--color-accent-emphasis);\n\n & > .octicon {\n color: inherit;\n opacity: 1;\n }\n\n & [class*='color-fg-'] {\n color: inherit !important;\n }\n\n & > .Label {\n color: inherit !important;\n border-color: currentcolor;\n }\n }\n\n &.btn-link {\n width: 100%;\n text-align: left;\n }\n}\n\n.dropdown-signout {\n width: 100%;\n text-align: left;\n background: none;\n border: 0;\n}\n\n.dropdown-divider {\n display: block;\n height: 0;\n margin: var(--stack-gap-condensed) 0;\n border-top: var(--borderWidth-thin) solid var(--color-border-default);\n}\n\n.dropdown-header {\n padding: var(--control-small-paddingBlock) var(--control-medium-paddingInline-spacious);\n font-size: var(--text-body-size-small);\n color: var(--color-fg-muted);\n}\n\n.dropdown-item[aria-checked='false'] .octicon-check {\n display: none;\n}\n\n/* Directional classes\n**\n** Move the menu and the caret attached to it. Requires at least one of these on\n** the `.dropdown-menu` element. */\n\n.dropdown-menu-w {\n top: 0;\n right: 100%;\n left: auto;\n width: auto;\n margin-top: 0;\n margin-right: 8px;\n\n &::before {\n top: 10px;\n right: -16px;\n left: auto;\n border-color: transparent;\n border-left-color: var(--color-border-default);\n }\n\n &::after {\n top: 11px;\n right: -14px;\n left: auto;\n border-color: transparent;\n border-left-color: var(--color-canvas-overlay);\n }\n}\n\n.dropdown-menu-e {\n top: 0;\n left: 100%;\n width: auto;\n margin-top: 0;\n margin-left: 8px;\n\n &::before {\n top: 10px;\n left: -16px;\n border-color: transparent;\n border-right-color: var(--color-border-default);\n }\n\n &::after {\n top: 11px;\n left: -14px;\n border-color: transparent;\n border-right-color: var(--color-canvas-overlay);\n }\n}\n\n.dropdown-menu-ne {\n top: auto;\n bottom: 100%;\n left: 0;\n margin-bottom: 3px;\n\n &::before,\n &::after {\n top: auto;\n right: auto;\n }\n\n &::before {\n bottom: -8px;\n left: 9px;\n border-top: 8px solid var(--color-border-default);\n border-right: 8px solid transparent;\n border-bottom: 0;\n border-left: 8px solid transparent;\n }\n\n &::after {\n bottom: -7px;\n left: 10px;\n border-top: 7px solid var(--color-canvas-overlay);\n border-right: 7px solid transparent;\n border-bottom: 0;\n border-left: 7px solid transparent;\n }\n}\n\n.dropdown-menu-s {\n right: 50%;\n left: auto;\n transform: translateX(50%);\n\n &::before {\n top: -16px;\n right: 50%;\n transform: translateX(50%);\n }\n\n &::after {\n top: -14px;\n right: 50%;\n transform: translateX(50%);\n }\n}\n\n.dropdown-menu-sw {\n right: 0;\n left: auto;\n\n &::before {\n top: -16px;\n right: 9px;\n left: auto;\n }\n\n &::after {\n top: -14px;\n right: 10px;\n left: auto;\n }\n}\n\n.dropdown-menu-se {\n &::before {\n top: -16px;\n left: 9px;\n }\n\n &::after {\n top: -14px;\n left: 10px;\n }\n}\n"]}
@@ -11,7 +11,7 @@
11
11
  vertical-align: middle;
12
12
  content: '';
13
13
  border-style: solid;
14
- border-width: var(--borderWidth-thicker, 4px) var(--borderWidth-thicker, 4px) 0;
14
+ border-width: var(--borderWidth-thicker) var(--borderWidth-thicker) 0;
15
15
  border-right-color: transparent;
16
16
  border-bottom-color: transparent;
17
17
  border-left-color: transparent;
@@ -26,14 +26,14 @@
26
26
  left: 0;
27
27
  z-index: 100;
28
28
  width: 160px;
29
- padding-top: var(--control-small-paddingBlock, 4px);
30
- padding-bottom: var(--control-small-paddingBlock, 4px);
29
+ padding-top: var(--control-small-paddingBlock);
30
+ padding-bottom: var(--control-small-paddingBlock);
31
31
  margin-top: 2px;
32
32
  list-style: none;
33
33
  background-color: var(--color-canvas-overlay);
34
34
  background-clip: padding-box;
35
- border: var(--borderWidth-thin, 1px) solid var(--color-border-default);
36
- border-radius: var(--borderRadius-medium, 6px);
35
+ border: var(--borderWidth-thin) solid var(--color-border-default);
36
+ border-radius: var(--borderRadius-medium);
37
37
  box-shadow: var(--color-shadow-large);
38
38
 
39
39
  &::before,
@@ -64,7 +64,7 @@
64
64
  width: auto;
65
65
 
66
66
  & .dropdown-item {
67
- padding: var(--control-small-paddingBlock, 4px) var(--control-medium-paddingInline-spacious, 16px);
67
+ padding: var(--control-small-paddingBlock) var(--control-medium-paddingInline-spacious);
68
68
  overflow: visible;
69
69
  text-overflow: inherit;
70
70
  }
@@ -73,8 +73,8 @@
73
73
  /* Dropdown items (can be links or buttons) */
74
74
  .dropdown-item {
75
75
  display: block;
76
- padding: var(--control-small-paddingBlock, 4px) var(--control-medium-paddingInline-condensed, 8px)
77
- var(--control-small-paddingBlock, 4px) var(--control-medium-paddingInline-spacious, 16px);
76
+ padding: var(--control-small-paddingBlock) var(--control-medium-paddingInline-condensed)
77
+ var(--control-small-paddingBlock) var(--control-medium-paddingInline-spacious);
78
78
  overflow: hidden;
79
79
  color: var(--color-fg-default);
80
80
  text-overflow: ellipsis;
@@ -116,13 +116,13 @@
116
116
  .dropdown-divider {
117
117
  display: block;
118
118
  height: 0;
119
- margin: var(--stack-gap-condensed, 8px) 0;
120
- border-top: var(--borderWidth-thin, 1px) solid var(--color-border-default);
119
+ margin: var(--stack-gap-condensed) 0;
120
+ border-top: var(--borderWidth-thin) solid var(--color-border-default);
121
121
  }
122
122
 
123
123
  .dropdown-header {
124
- padding: var(--control-small-paddingBlock, 4px) var(--control-medium-paddingInline-spacious, 16px);
125
- font-size: var(--text-body-size-small, 12px);
124
+ padding: var(--control-small-paddingBlock) var(--control-medium-paddingInline-spacious);
125
+ font-size: var(--text-body-size-small);
126
126
  color: var(--color-fg-muted);
127
127
  }
128
128
 
@@ -10,7 +10,7 @@
10
10
  <% end %>
11
11
  <% if @validation_message %>
12
12
  <%= render(Primer::BaseComponent.new(tag: :div, **@validation_arguments)) do %>
13
- <%= render(Primer::Beta::Octicon.new(icon: :"alert-fill", size: :xsmall, aria: { hidden: true })) %>
13
+ <span class="FormControl-inlineValidation--visual"><%= render(Primer::Beta::Octicon.new(icon: :"alert-fill", size: :xsmall, aria: { hidden: true })) %></span>
14
14
  <span><%= @validation_message %></span>
15
15
  <% end %>
16
16
  <% end %>
@@ -19,8 +19,9 @@ module Primer
19
19
  # <%= render(Primer::Alpha::HellipButton.new(p: 1, classes: "custom-class", "aria-label": "No effect")) %>
20
20
  #
21
21
  # @param inline [Boolean] Whether or not the button is inline.
22
+ # @param disabled [Boolean] Whether or not the button is disabled.
22
23
  # @param system_arguments [Hash] <%= link_to_system_arguments_docs %>
23
- def initialize(inline: false, **system_arguments)
24
+ def initialize(inline: false, disabled: false, **system_arguments)
24
25
  @system_arguments = deny_tag_argument(**system_arguments)
25
26
 
26
27
  validate_aria_label
@@ -31,6 +32,7 @@ module Primer
31
32
  @system_arguments[:classes],
32
33
  "inline" => inline
33
34
  )
35
+ @system_arguments[:disabled] = disabled
34
36
  end
35
37
 
36
38
  def call
@@ -1 +1 @@
1
- .Layout{--Layout-sidebar-width:220px;--Layout-gutter:16px;display:grid}@media (max-width:calc(544px - 0.02px)){.Layout{grid-auto-flow:row;grid-template-columns:1fr!important}.Layout .Layout-divider,.Layout .Layout-main,.Layout .Layout-sidebar{grid-column:1!important;width:100%!important}.Layout.Layout--sidebarPosition-flowRow-start .Layout-sidebar{grid-row:1}.Layout.Layout--sidebarPosition-flowRow-end .Layout-sidebar,.Layout.Layout--sidebarPosition-flowRow-start .Layout-main{grid-row:2/span 2}.Layout.Layout--sidebarPosition-flowRow-end .Layout-main{grid-row:1}.Layout.Layout--sidebarPosition-flowRow-none .Layout-sidebar{display:none}.Layout.Layout--divided{--Layout-gutter:0}.Layout.Layout--divided .Layout-divider{grid-row:2;height:1px}.Layout.Layout--divided .Layout-divider.Layout-divider--flowRow-hidden{display:none}.Layout.Layout--divided .Layout-divider.Layout-divider--flowRow-shallow{background:var(--color-canvas-inset);border-color:var(--color-border-default);border-style:solid;border-width:var(--borderWidth-thin,1px) 0;height:8px;margin-right:0}.Layout.Layout--divided .Layout-main,.Layout.Layout--divided.Layout--sidebarPosition-flowRow-end .Layout-sidebar{grid-row:3/span 1}.Layout.Layout--divided.Layout--sidebarPosition-flowRow-end .Layout-main{grid-row:1}}@media (max-width:calc(768px - 0.02px)){.Layout.Layout--flowRow-until-md{grid-auto-flow:row;grid-template-columns:1fr!important}.Layout.Layout--flowRow-until-md .Layout-divider,.Layout.Layout--flowRow-until-md .Layout-main,.Layout.Layout--flowRow-until-md .Layout-sidebar{grid-column:1!important;width:100%!important}.Layout.Layout--flowRow-until-md.Layout--sidebarPosition-flowRow-start .Layout-sidebar{grid-row:1}.Layout.Layout--flowRow-until-md.Layout--sidebarPosition-flowRow-end .Layout-sidebar,.Layout.Layout--flowRow-until-md.Layout--sidebarPosition-flowRow-start .Layout-main{grid-row:2/span 2}.Layout.Layout--flowRow-until-md.Layout--sidebarPosition-flowRow-end .Layout-main{grid-row:1}.Layout.Layout--flowRow-until-md.Layout--sidebarPosition-flowRow-none .Layout-sidebar{display:none}.Layout.Layout--flowRow-until-md.Layout--divided{--Layout-gutter:0}.Layout.Layout--flowRow-until-md.Layout--divided .Layout-divider{grid-row:2;height:1px}.Layout.Layout--flowRow-until-md.Layout--divided .Layout-divider.Layout-divider--flowRow-hidden{display:none}.Layout.Layout--flowRow-until-md.Layout--divided .Layout-divider.Layout-divider--flowRow-shallow{background:var(--color-canvas-inset);border-color:var(--color-border-default);border-style:solid;border-width:var(--borderWidth-thin,1px) 0;height:8px;margin-right:0}.Layout.Layout--flowRow-until-md.Layout--divided .Layout-main,.Layout.Layout--flowRow-until-md.Layout--divided.Layout--sidebarPosition-flowRow-end .Layout-sidebar{grid-row:3/span 1}.Layout.Layout--flowRow-until-md.Layout--divided.Layout--sidebarPosition-flowRow-end .Layout-main{grid-row:1}}@media (max-width:calc(1012px - 0.02px)){.Layout.Layout--flowRow-until-lg{grid-auto-flow:row;grid-template-columns:1fr!important}.Layout.Layout--flowRow-until-lg .Layout-divider,.Layout.Layout--flowRow-until-lg .Layout-main,.Layout.Layout--flowRow-until-lg .Layout-sidebar{grid-column:1!important;width:100%!important}.Layout.Layout--flowRow-until-lg.Layout--sidebarPosition-flowRow-start .Layout-sidebar{grid-row:1}.Layout.Layout--flowRow-until-lg.Layout--sidebarPosition-flowRow-end .Layout-sidebar,.Layout.Layout--flowRow-until-lg.Layout--sidebarPosition-flowRow-start .Layout-main{grid-row:2/span 2}.Layout.Layout--flowRow-until-lg.Layout--sidebarPosition-flowRow-end .Layout-main{grid-row:1}.Layout.Layout--flowRow-until-lg.Layout--sidebarPosition-flowRow-none .Layout-sidebar{display:none}.Layout.Layout--flowRow-until-lg.Layout--divided{--Layout-gutter:0}.Layout.Layout--flowRow-until-lg.Layout--divided .Layout-divider{grid-row:2;height:1px}.Layout.Layout--flowRow-until-lg.Layout--divided .Layout-divider.Layout-divider--flowRow-hidden{display:none}.Layout.Layout--flowRow-until-lg.Layout--divided .Layout-divider.Layout-divider--flowRow-shallow{background:var(--color-canvas-inset);border-color:var(--color-border-default);border-style:solid;border-width:var(--borderWidth-thin,1px) 0;height:8px;margin-right:0}.Layout.Layout--flowRow-until-lg.Layout--divided .Layout-main,.Layout.Layout--flowRow-until-lg.Layout--divided.Layout--sidebarPosition-flowRow-end .Layout-sidebar{grid-row:3/span 1}.Layout.Layout--flowRow-until-lg.Layout--divided.Layout--sidebarPosition-flowRow-end .Layout-main{grid-row:1}}.Layout{grid-gap:var(--Layout-gutter);grid-auto-flow:column;grid-template-columns:auto 0 minmax(0,calc(100% - var(--Layout-sidebar-width) - var(--Layout-gutter)))}.Layout .Layout-sidebar{grid-column:1}.Layout .Layout-divider{display:none}.Layout .Layout-main{grid-column:2/span 2}@media (min-width:1012px){.Layout{--Layout-gutter:24px}}.Layout.Layout--gutter-none{--Layout-gutter:0px}.Layout.Layout--gutter-condensed{--Layout-gutter:16px}@media (min-width:1012px){.Layout.Layout--gutter-spacious{--Layout-gutter:32px}}@media (min-width:1280px){.Layout.Layout--gutter-spacious{--Layout-gutter:40px}}@media (min-width:544px){.Layout{--Layout-sidebar-width:220px}}@media (min-width:768px){.Layout{--Layout-sidebar-width:256px}}@media (min-width:1012px){.Layout{--Layout-sidebar-width:296px}}@media (min-width:768px){.Layout.Layout--sidebar-narrow{--Layout-sidebar-width:240px}}@media (min-width:1012px){.Layout.Layout--sidebar-narrow{--Layout-sidebar-width:256px}.Layout.Layout--sidebar-wide{--Layout-sidebar-width:320px}}@media (min-width:1280px){.Layout.Layout--sidebar-wide{--Layout-sidebar-width:336px}}.Layout.Layout--sidebarPosition-start .Layout-sidebar{grid-column:1}.Layout.Layout--sidebarPosition-start .Layout-main{grid-column:2/span 2}.Layout.Layout--sidebarPosition-end{grid-template-columns:minmax(0,calc(100% - var(--Layout-sidebar-width) - var(--Layout-gutter))) 0 auto}.Layout.Layout--sidebarPosition-end .Layout-main{grid-column:1}.Layout.Layout--sidebarPosition-end .Layout-sidebar{grid-column:2/span 2}.Layout.Layout--divided .Layout-divider{background:var(--color-border-default);display:block;grid-column:2;margin-right:-1px;width:1px}.Layout.Layout--divided .Layout-main,.Layout.Layout--divided.Layout--sidebarPosition-end .Layout-sidebar{grid-column:3/span 1}.Layout.Layout--divided.Layout--sidebarPosition-end .Layout-main{grid-column:1}.Layout-divider{display:none;width:1px}.Layout-sidebar{width:var(--Layout-sidebar-width)}.Layout-main{min-width:0}.Layout-main .Layout-main-centered-lg,.Layout-main .Layout-main-centered-md,.Layout-main .Layout-main-centered-xl{margin-left:auto;margin-right:auto}.Layout-main .Layout-main-centered-lg>.container-lg,.Layout-main .Layout-main-centered-lg>.container-md,.Layout-main .Layout-main-centered-lg>.container-xl,.Layout-main .Layout-main-centered-md>.container-lg,.Layout-main .Layout-main-centered-md>.container-md,.Layout-main .Layout-main-centered-md>.container-xl,.Layout-main .Layout-main-centered-xl>.container-lg,.Layout-main .Layout-main-centered-xl>.container-md,.Layout-main .Layout-main-centered-xl>.container-xl{margin-left:0}.Layout-main .Layout-main-centered-md{max-width:calc(var(--breakpoint-medium, 768px) + var(--Layout-sidebar-width) + var(--Layout-gutter))}.Layout-main .Layout-main-centered-lg{max-width:calc(var(--breakpoint-large, 1012px) + var(--Layout-sidebar-width) + var(--Layout-gutter))}.Layout-main .Layout-main-centered-xl{max-width:calc(var(--breakpoint-xlarge, 1280px) + var(--Layout-sidebar-width) + var(--Layout-gutter))}
1
+ .Layout{--Layout-sidebar-width:220px;--Layout-gutter:16px;display:grid}@media (max-width:calc(544px - 0.02px)){.Layout{grid-auto-flow:row;grid-template-columns:1fr!important}.Layout .Layout-divider,.Layout .Layout-main,.Layout .Layout-sidebar{grid-column:1!important;width:100%!important}.Layout.Layout--sidebarPosition-flowRow-start .Layout-sidebar{grid-row:1}.Layout.Layout--sidebarPosition-flowRow-end .Layout-sidebar,.Layout.Layout--sidebarPosition-flowRow-start .Layout-main{grid-row:2/span 2}.Layout.Layout--sidebarPosition-flowRow-end .Layout-main{grid-row:1}.Layout.Layout--sidebarPosition-flowRow-none .Layout-sidebar{display:none}.Layout.Layout--divided{--Layout-gutter:0}.Layout.Layout--divided .Layout-divider{grid-row:2;height:1px}.Layout.Layout--divided .Layout-divider.Layout-divider--flowRow-hidden{display:none}.Layout.Layout--divided .Layout-divider.Layout-divider--flowRow-shallow{background:var(--color-canvas-inset);border-color:var(--color-border-default);border-style:solid;border-width:var(--borderWidth-thin,max(1px,.0625rem)) 0;height:8px;margin-right:0}.Layout.Layout--divided .Layout-main,.Layout.Layout--divided.Layout--sidebarPosition-flowRow-end .Layout-sidebar{grid-row:3/span 1}.Layout.Layout--divided.Layout--sidebarPosition-flowRow-end .Layout-main{grid-row:1}}@media (max-width:calc(768px - 0.02px)){.Layout.Layout--flowRow-until-md{grid-auto-flow:row;grid-template-columns:1fr!important}.Layout.Layout--flowRow-until-md .Layout-divider,.Layout.Layout--flowRow-until-md .Layout-main,.Layout.Layout--flowRow-until-md .Layout-sidebar{grid-column:1!important;width:100%!important}.Layout.Layout--flowRow-until-md.Layout--sidebarPosition-flowRow-start .Layout-sidebar{grid-row:1}.Layout.Layout--flowRow-until-md.Layout--sidebarPosition-flowRow-end .Layout-sidebar,.Layout.Layout--flowRow-until-md.Layout--sidebarPosition-flowRow-start .Layout-main{grid-row:2/span 2}.Layout.Layout--flowRow-until-md.Layout--sidebarPosition-flowRow-end .Layout-main{grid-row:1}.Layout.Layout--flowRow-until-md.Layout--sidebarPosition-flowRow-none .Layout-sidebar{display:none}.Layout.Layout--flowRow-until-md.Layout--divided{--Layout-gutter:0}.Layout.Layout--flowRow-until-md.Layout--divided .Layout-divider{grid-row:2;height:1px}.Layout.Layout--flowRow-until-md.Layout--divided .Layout-divider.Layout-divider--flowRow-hidden{display:none}.Layout.Layout--flowRow-until-md.Layout--divided .Layout-divider.Layout-divider--flowRow-shallow{background:var(--color-canvas-inset);border-color:var(--color-border-default);border-style:solid;border-width:var(--borderWidth-thin,max(1px,.0625rem)) 0;height:8px;margin-right:0}.Layout.Layout--flowRow-until-md.Layout--divided .Layout-main,.Layout.Layout--flowRow-until-md.Layout--divided.Layout--sidebarPosition-flowRow-end .Layout-sidebar{grid-row:3/span 1}.Layout.Layout--flowRow-until-md.Layout--divided.Layout--sidebarPosition-flowRow-end .Layout-main{grid-row:1}}@media (max-width:calc(1012px - 0.02px)){.Layout.Layout--flowRow-until-lg{grid-auto-flow:row;grid-template-columns:1fr!important}.Layout.Layout--flowRow-until-lg .Layout-divider,.Layout.Layout--flowRow-until-lg .Layout-main,.Layout.Layout--flowRow-until-lg .Layout-sidebar{grid-column:1!important;width:100%!important}.Layout.Layout--flowRow-until-lg.Layout--sidebarPosition-flowRow-start .Layout-sidebar{grid-row:1}.Layout.Layout--flowRow-until-lg.Layout--sidebarPosition-flowRow-end .Layout-sidebar,.Layout.Layout--flowRow-until-lg.Layout--sidebarPosition-flowRow-start .Layout-main{grid-row:2/span 2}.Layout.Layout--flowRow-until-lg.Layout--sidebarPosition-flowRow-end .Layout-main{grid-row:1}.Layout.Layout--flowRow-until-lg.Layout--sidebarPosition-flowRow-none .Layout-sidebar{display:none}.Layout.Layout--flowRow-until-lg.Layout--divided{--Layout-gutter:0}.Layout.Layout--flowRow-until-lg.Layout--divided .Layout-divider{grid-row:2;height:1px}.Layout.Layout--flowRow-until-lg.Layout--divided .Layout-divider.Layout-divider--flowRow-hidden{display:none}.Layout.Layout--flowRow-until-lg.Layout--divided .Layout-divider.Layout-divider--flowRow-shallow{background:var(--color-canvas-inset);border-color:var(--color-border-default);border-style:solid;border-width:var(--borderWidth-thin,max(1px,.0625rem)) 0;height:8px;margin-right:0}.Layout.Layout--flowRow-until-lg.Layout--divided .Layout-main,.Layout.Layout--flowRow-until-lg.Layout--divided.Layout--sidebarPosition-flowRow-end .Layout-sidebar{grid-row:3/span 1}.Layout.Layout--flowRow-until-lg.Layout--divided.Layout--sidebarPosition-flowRow-end .Layout-main{grid-row:1}}.Layout{grid-gap:var(--Layout-gutter);grid-auto-flow:column;grid-template-columns:auto 0 minmax(0,calc(100% - var(--Layout-sidebar-width) - var(--Layout-gutter)))}.Layout .Layout-sidebar{grid-column:1}.Layout .Layout-divider{display:none}.Layout .Layout-main{grid-column:2/span 2}@media (min-width:1012px){.Layout{--Layout-gutter:24px}}.Layout.Layout--gutter-none{--Layout-gutter:0px}.Layout.Layout--gutter-condensed{--Layout-gutter:16px}@media (min-width:1012px){.Layout.Layout--gutter-spacious{--Layout-gutter:32px}}@media (min-width:1280px){.Layout.Layout--gutter-spacious{--Layout-gutter:40px}}@media (min-width:544px){.Layout{--Layout-sidebar-width:220px}}@media (min-width:768px){.Layout{--Layout-sidebar-width:256px}}@media (min-width:1012px){.Layout{--Layout-sidebar-width:296px}}@media (min-width:768px){.Layout.Layout--sidebar-narrow{--Layout-sidebar-width:240px}}@media (min-width:1012px){.Layout.Layout--sidebar-narrow{--Layout-sidebar-width:256px}.Layout.Layout--sidebar-wide{--Layout-sidebar-width:320px}}@media (min-width:1280px){.Layout.Layout--sidebar-wide{--Layout-sidebar-width:336px}}.Layout.Layout--sidebarPosition-start .Layout-sidebar{grid-column:1}.Layout.Layout--sidebarPosition-start .Layout-main{grid-column:2/span 2}.Layout.Layout--sidebarPosition-end{grid-template-columns:minmax(0,calc(100% - var(--Layout-sidebar-width) - var(--Layout-gutter))) 0 auto}.Layout.Layout--sidebarPosition-end .Layout-main{grid-column:1}.Layout.Layout--sidebarPosition-end .Layout-sidebar{grid-column:2/span 2}.Layout.Layout--divided .Layout-divider{background:var(--color-border-default);display:block;grid-column:2;margin-right:-1px;width:1px}.Layout.Layout--divided .Layout-main,.Layout.Layout--divided.Layout--sidebarPosition-end .Layout-sidebar{grid-column:3/span 1}.Layout.Layout--divided.Layout--sidebarPosition-end .Layout-main{grid-column:1}.Layout-divider{display:none;width:1px}.Layout-sidebar{width:var(--Layout-sidebar-width)}.Layout-main{min-width:0}.Layout-main .Layout-main-centered-lg,.Layout-main .Layout-main-centered-md,.Layout-main .Layout-main-centered-xl{margin-left:auto;margin-right:auto}.Layout-main .Layout-main-centered-lg>.container-lg,.Layout-main .Layout-main-centered-lg>.container-md,.Layout-main .Layout-main-centered-lg>.container-xl,.Layout-main .Layout-main-centered-md>.container-lg,.Layout-main .Layout-main-centered-md>.container-md,.Layout-main .Layout-main-centered-md>.container-xl,.Layout-main .Layout-main-centered-xl>.container-lg,.Layout-main .Layout-main-centered-xl>.container-md,.Layout-main .Layout-main-centered-xl>.container-xl{margin-left:0}.Layout-main .Layout-main-centered-md{max-width:calc(var(--breakpoint-medium,48rem) + var(--Layout-sidebar-width) + var(--Layout-gutter))}.Layout-main .Layout-main-centered-lg{max-width:calc(var(--breakpoint-large,63.25rem) + var(--Layout-sidebar-width) + var(--Layout-gutter))}.Layout-main .Layout-main-centered-xl{max-width:calc(var(--breakpoint-xlarge,80rem) + var(--Layout-sidebar-width) + var(--Layout-gutter))}
@@ -1 +1 @@
1
- {"version":3,"sources":["layout.pcss"],"names":[],"mappings":"AAgFA,QAGE,4BAA6B,CAC7B,oBAAqB,CAHrB,YAkJF,CA7IE,wCANF,QA7EE,kBAAmB,CACnB,mCA+NF,CA7NE,qEAIE,uBAAyB,CADzB,oBAEF,CAGE,8DACE,UACF,CAQA,uHACE,iBACF,CAEA,yDACE,UACF,CAIA,6DACE,YACF,CAGF,wBAoBA,iBAJA,CAMA,wCAEE,UAAW,CADX,UAeF,CAZE,uEACE,YACF,CAEA,wEAGE,oCAAqC,CACrC,wCAAyC,CACzC,kBAAmB,CACnB,0CAA4C,CAL5C,UAAW,CACX,cAKF,CA7BE,iHACE,iBACF,CAEA,yEACE,UACF,CAmCJ,CAGE,wCADF,iCAvFA,kBAAmB,CACnB,mCA0FA,CAxFA,gJAIE,uBAAyB,CADzB,oBAEF,CAGE,uFACE,UACF,CAQA,yKACE,iBACF,CAEA,kFACE,UACF,CAIA,sFACE,YACF,CAGF,iDAoBA,iBAJA,CAMA,iEAEE,UAAW,CADX,UAeF,CAZE,gGACE,YACF,CAEA,iGAGE,oCAAqC,CACrC,wCAAyC,CACzC,kBAAmB,CACnB,0CAA4C,CAL5C,UAAW,CACX,cAKF,CA7BE,mKACE,iBACF,CAEA,kGACE,UACF,CAwCF,CAIA,yCADF,iCA7FA,kBAAmB,CACnB,mCAgGA,CA9FA,gJAIE,uBAAyB,CADzB,oBAEF,CAGE,uFACE,UACF,CAQA,yKACE,iBACF,CAEA,kFACE,UACF,CAIA,sFACE,YACF,CAGF,iDAoBA,iBAJA,CAMA,iEAEE,UAAW,CADX,UAeF,CAZE,gGACE,YACF,CAEA,iGAGE,oCAAqC,CACrC,wCAAyC,CACzC,kBAAmB,CACnB,0CAA4C,CAL5C,UAAW,CACX,cAKF,CA7BE,mKACE,iBACF,CAEA,kGACE,UACF,CA8CF,CAnBJ,QA0BE,6BAA8B,CAF9B,qBAAsB,CACtB,sGA0HF,CAvHE,wBACE,aACF,CAEA,wBACE,YACF,CAEA,qBACE,oBACF,CAIA,0BA1CF,QA2CI,oBAwGJ,CAvGE,CAEA,4BAEE,mBACF,CAEA,iCACE,oBACF,CAGE,0BADF,gCAEI,oBAMJ,CALE,CAEA,0BALF,gCAMI,oBAEJ,CADE,CAIF,yBAlEF,QAmEI,4BAgFJ,CA/EE,CAEA,yBAtEF,QAuEI,4BA4EJ,CA3EE,CAEA,0BA1EF,QA2EI,4BAwEJ,CAvEE,CAGE,yBADF,+BAEI,4BAMJ,CALE,CAEA,0BALF,+BAMI,4BAEJ,CAEA,6BAEI,4BAMJ,CAXE,CAQA,0BALF,6BAMI,4BAEJ,CADE,CAMA,sDACE,aACF,CAEA,mDACE,oBACF,CAGF,oCACE,sGASF,CAPE,iDACE,aACF,CAEA,oDACE,oBACF,CAMA,wCAKE,sCAAuC,CAJvC,aAAc,CACd,aAAc,CAEd,iBAAkB,CADlB,SAGF,CAOE,yGACE,oBACF,CAEA,iEACE,aACF,CAKN,gBACE,YAAa,CACb,SACF,CAEA,gBACE,iCACF,CAEA,aACE,WA4BF,CAxBE,kHAIE,gBAAiB,CADjB,iBAQF,CALE,odAGE,aACF,CAGF,sCACE,oGACF,CAEA,sCACE,oGACF,CAEA,sCACE,qGACF","file":"layout.css","sourcesContent":["/* Layout */\n\n@define-mixin flow-as-row {\n grid-auto-flow: row;\n grid-template-columns: 1fr !important;\n\n & .Layout-sidebar,\n & .Layout-divider,\n & .Layout-main {\n width: 100% !important;\n grid-column: 1 !important;\n }\n\n &.Layout--sidebarPosition-flowRow-start {\n & .Layout-sidebar {\n grid-row: 1;\n }\n\n & .Layout-main {\n grid-row: 2 / span 2;\n }\n }\n\n &.Layout--sidebarPosition-flowRow-end {\n & .Layout-sidebar {\n grid-row: 2 / span 2;\n }\n\n & .Layout-main {\n grid-row: 1;\n }\n }\n\n &.Layout--sidebarPosition-flowRow-none {\n & .Layout-sidebar {\n display: none;\n }\n }\n\n &.Layout--divided {\n @mixin flow-as-row-divider;\n\n & .Layout-main {\n grid-row: 3 / span 1;\n }\n\n &.Layout--sidebarPosition-flowRow-end {\n & .Layout-sidebar {\n grid-row: 3 / span 1;\n }\n\n & .Layout-main {\n grid-row: 1;\n }\n }\n }\n}\n\n@define-mixin flow-as-row-divider {\n --Layout-gutter: 0;\n\n & .Layout-divider {\n height: 1px;\n grid-row: 2;\n\n &.Layout-divider--flowRow-hidden {\n display: none;\n }\n\n &.Layout-divider--flowRow-shallow {\n height: 8px;\n margin-right: 0;\n background: var(--color-canvas-inset);\n border-color: var(--color-border-default);\n border-style: solid;\n border-width: var(--borderWidth-thin, 1px) 0;\n }\n }\n}\n\n.Layout {\n display: grid;\n\n --Layout-sidebar-width: 220px;\n --Layout-gutter: 16px;\n\n @media (max-width: calc(544px - 0.02px)) {\n @mixin flow-as-row;\n }\n\n &.Layout--flowRow-until-md {\n @media (max-width: calc(768px - 0.02px)) {\n @mixin flow-as-row;\n }\n }\n\n &.Layout--flowRow-until-lg {\n @media (max-width: calc(1012px - 0.02px)) {\n @mixin flow-as-row;\n }\n }\n\n /* Flow as column */\n\n grid-auto-flow: column;\n grid-template-columns: auto 0 minmax(0, calc(100% - var(--Layout-sidebar-width) - var(--Layout-gutter))); /* sidebar column, separator, main column */\n grid-gap: var(--Layout-gutter);\n\n & .Layout-sidebar {\n grid-column: 1;\n }\n\n & .Layout-divider {\n display: none;\n }\n\n & .Layout-main {\n grid-column: 2 / span 2;\n }\n\n /* Gutter spacing */\n\n @media (min-width: 1012px) {\n --Layout-gutter: 24px;\n }\n\n &.Layout--gutter-none {\n /* stylelint-disable-next-line length-zero-no-unit */\n --Layout-gutter: 0px; /* Neds px in value */\n }\n\n &.Layout--gutter-condensed {\n --Layout-gutter: 16px;\n }\n\n &.Layout--gutter-spacious {\n @media (min-width: 1012px) {\n --Layout-gutter: 32px;\n }\n\n @media (min-width: 1280px) {\n --Layout-gutter: 40px;\n }\n }\n\n /* Sidebar width */\n @media (min-width: 544px) {\n --Layout-sidebar-width: 220px;\n }\n\n @media (min-width: 768px) {\n --Layout-sidebar-width: 256px;\n }\n\n @media (min-width: 1012px) {\n --Layout-sidebar-width: 296px;\n }\n\n &.Layout--sidebar-narrow {\n @media (min-width: 768px) {\n --Layout-sidebar-width: 240px;\n }\n\n @media (min-width: 1012px) {\n --Layout-sidebar-width: 256px;\n }\n }\n\n &.Layout--sidebar-wide {\n @media (min-width: 1012px) {\n --Layout-sidebar-width: 320px;\n }\n\n @media (min-width: 1280px) {\n --Layout-sidebar-width: 336px;\n }\n }\n\n /* Sidebar position */\n\n &.Layout--sidebarPosition-start {\n & .Layout-sidebar {\n grid-column: 1;\n }\n\n & .Layout-main {\n grid-column: 2 / span 2;\n }\n }\n\n &.Layout--sidebarPosition-end {\n grid-template-columns: minmax(0, calc(100% - var(--Layout-sidebar-width) - var(--Layout-gutter))) 0 auto;\n\n & .Layout-main {\n grid-column: 1;\n }\n\n & .Layout-sidebar {\n grid-column: 2 / span 2;\n }\n }\n\n /* Sidebar divider */\n\n &.Layout--divided {\n & .Layout-divider {\n display: block;\n grid-column: 2;\n width: 1px;\n margin-right: -1px;\n background: var(--color-border-default);\n }\n\n & .Layout-main {\n grid-column: 3 / span 1;\n }\n\n &.Layout--sidebarPosition-end {\n & .Layout-sidebar {\n grid-column: 3 / span 1;\n }\n\n & .Layout-main {\n grid-column: 1;\n }\n }\n }\n}\n\n.Layout-divider {\n display: none;\n width: 1px;\n}\n\n.Layout-sidebar {\n width: var(--Layout-sidebar-width);\n}\n\n.Layout-main {\n min-width: 0;\n\n /* Centered main column\n ** FIXME: right-aligned sidebar */\n & .Layout-main-centered-md,\n & .Layout-main-centered-lg,\n & .Layout-main-centered-xl {\n margin-right: auto;\n margin-left: auto;\n\n & > .container-md,\n & > .container-lg,\n & > .container-xl {\n margin-left: 0;\n }\n }\n\n & .Layout-main-centered-md {\n max-width: calc(var(--breakpoint-medium, 768px) + var(--Layout-sidebar-width) + var(--Layout-gutter));\n }\n\n & .Layout-main-centered-lg {\n max-width: calc(var(--breakpoint-large, 1012px) + var(--Layout-sidebar-width) + var(--Layout-gutter));\n }\n\n & .Layout-main-centered-xl {\n max-width: calc(var(--breakpoint-xlarge, 1280px) + var(--Layout-sidebar-width) + var(--Layout-gutter));\n }\n}\n"]}
1
+ {"version":3,"sources":["layout.pcss"],"names":[],"mappings":"AAgFA,QAGE,4BAA6B,CAC7B,oBAAqB,CAHrB,YAkJF,CA7IE,wCANF,QA7EE,kBAAmB,CACnB,mCA+NF,CA7NE,qEAIE,uBAAyB,CADzB,oBAEF,CAGE,8DACE,UACF,CAQA,uHACE,iBACF,CAEA,yDACE,UACF,CAIA,6DACE,YACF,CAGF,wBAoBA,iBAJA,CAMA,wCAEE,UAAW,CADX,UAeF,CAZE,uEACE,YACF,CAEA,wEAGE,oCAAqC,CACrC,wCAAyC,CACzC,kBAAmB,CACnB,wDAAuC,CALvC,UAAW,CACX,cAKF,CA7BE,iHACE,iBACF,CAEA,yEACE,UACF,CAmCJ,CAGE,wCADF,iCAvFA,kBAAmB,CACnB,mCA0FA,CAxFA,gJAIE,uBAAyB,CADzB,oBAEF,CAGE,uFACE,UACF,CAQA,yKACE,iBACF,CAEA,kFACE,UACF,CAIA,sFACE,YACF,CAGF,iDAoBA,iBAJA,CAMA,iEAEE,UAAW,CADX,UAeF,CAZE,gGACE,YACF,CAEA,iGAGE,oCAAqC,CACrC,wCAAyC,CACzC,kBAAmB,CACnB,wDAAuC,CALvC,UAAW,CACX,cAKF,CA7BE,mKACE,iBACF,CAEA,kGACE,UACF,CAwCF,CAIA,yCADF,iCA7FA,kBAAmB,CACnB,mCAgGA,CA9FA,gJAIE,uBAAyB,CADzB,oBAEF,CAGE,uFACE,UACF,CAQA,yKACE,iBACF,CAEA,kFACE,UACF,CAIA,sFACE,YACF,CAGF,iDAoBA,iBAJA,CAMA,iEAEE,UAAW,CADX,UAeF,CAZE,gGACE,YACF,CAEA,iGAGE,oCAAqC,CACrC,wCAAyC,CACzC,kBAAmB,CACnB,wDAAuC,CALvC,UAAW,CACX,cAKF,CA7BE,mKACE,iBACF,CAEA,kGACE,UACF,CA8CF,CAnBJ,QA0BE,6BAA8B,CAF9B,qBAAsB,CACtB,sGA0HF,CAvHE,wBACE,aACF,CAEA,wBACE,YACF,CAEA,qBACE,oBACF,CAIA,0BA1CF,QA2CI,oBAwGJ,CAvGE,CAEA,4BAEE,mBACF,CAEA,iCACE,oBACF,CAGE,0BADF,gCAEI,oBAMJ,CALE,CAEA,0BALF,gCAMI,oBAEJ,CADE,CAIF,yBAlEF,QAmEI,4BAgFJ,CA/EE,CAEA,yBAtEF,QAuEI,4BA4EJ,CA3EE,CAEA,0BA1EF,QA2EI,4BAwEJ,CAvEE,CAGE,yBADF,+BAEI,4BAMJ,CALE,CAEA,0BALF,+BAMI,4BAEJ,CAEA,6BAEI,4BAMJ,CAXE,CAQA,0BALF,6BAMI,4BAEJ,CADE,CAMA,sDACE,aACF,CAEA,mDACE,oBACF,CAGF,oCACE,sGASF,CAPE,iDACE,aACF,CAEA,oDACE,oBACF,CAMA,wCAKE,sCAAuC,CAJvC,aAAc,CACd,aAAc,CAEd,iBAAkB,CADlB,SAGF,CAOE,yGACE,oBACF,CAEA,iEACE,aACF,CAKN,gBACE,YAAa,CACb,SACF,CAEA,gBACE,iCACF,CAEA,aACE,WA4BF,CAxBE,kHAIE,gBAAiB,CADjB,iBAQF,CALE,odAGE,aACF,CAGF,sCACE,mGACF,CAEA,sCACE,qGACF,CAEA,sCACE,mGACF","file":"layout.css","sourcesContent":["/* Layout */\n\n@define-mixin flow-as-row {\n grid-auto-flow: row;\n grid-template-columns: 1fr !important;\n\n & .Layout-sidebar,\n & .Layout-divider,\n & .Layout-main {\n width: 100% !important;\n grid-column: 1 !important;\n }\n\n &.Layout--sidebarPosition-flowRow-start {\n & .Layout-sidebar {\n grid-row: 1;\n }\n\n & .Layout-main {\n grid-row: 2 / span 2;\n }\n }\n\n &.Layout--sidebarPosition-flowRow-end {\n & .Layout-sidebar {\n grid-row: 2 / span 2;\n }\n\n & .Layout-main {\n grid-row: 1;\n }\n }\n\n &.Layout--sidebarPosition-flowRow-none {\n & .Layout-sidebar {\n display: none;\n }\n }\n\n &.Layout--divided {\n @mixin flow-as-row-divider;\n\n & .Layout-main {\n grid-row: 3 / span 1;\n }\n\n &.Layout--sidebarPosition-flowRow-end {\n & .Layout-sidebar {\n grid-row: 3 / span 1;\n }\n\n & .Layout-main {\n grid-row: 1;\n }\n }\n }\n}\n\n@define-mixin flow-as-row-divider {\n --Layout-gutter: 0;\n\n & .Layout-divider {\n height: 1px;\n grid-row: 2;\n\n &.Layout-divider--flowRow-hidden {\n display: none;\n }\n\n &.Layout-divider--flowRow-shallow {\n height: 8px;\n margin-right: 0;\n background: var(--color-canvas-inset);\n border-color: var(--color-border-default);\n border-style: solid;\n border-width: var(--borderWidth-thin) 0;\n }\n }\n}\n\n.Layout {\n display: grid;\n\n --Layout-sidebar-width: 220px;\n --Layout-gutter: 16px;\n\n @media (max-width: calc(544px - 0.02px)) {\n @mixin flow-as-row;\n }\n\n &.Layout--flowRow-until-md {\n @media (max-width: calc(768px - 0.02px)) {\n @mixin flow-as-row;\n }\n }\n\n &.Layout--flowRow-until-lg {\n @media (max-width: calc(1012px - 0.02px)) {\n @mixin flow-as-row;\n }\n }\n\n /* Flow as column */\n\n grid-auto-flow: column;\n grid-template-columns: auto 0 minmax(0, calc(100% - var(--Layout-sidebar-width) - var(--Layout-gutter))); /* sidebar column, separator, main column */\n grid-gap: var(--Layout-gutter);\n\n & .Layout-sidebar {\n grid-column: 1;\n }\n\n & .Layout-divider {\n display: none;\n }\n\n & .Layout-main {\n grid-column: 2 / span 2;\n }\n\n /* Gutter spacing */\n\n @media (min-width: 1012px) {\n --Layout-gutter: 24px;\n }\n\n &.Layout--gutter-none {\n /* stylelint-disable-next-line length-zero-no-unit */\n --Layout-gutter: 0px; /* Neds px in value */\n }\n\n &.Layout--gutter-condensed {\n --Layout-gutter: 16px;\n }\n\n &.Layout--gutter-spacious {\n @media (min-width: 1012px) {\n --Layout-gutter: 32px;\n }\n\n @media (min-width: 1280px) {\n --Layout-gutter: 40px;\n }\n }\n\n /* Sidebar width */\n @media (min-width: 544px) {\n --Layout-sidebar-width: 220px;\n }\n\n @media (min-width: 768px) {\n --Layout-sidebar-width: 256px;\n }\n\n @media (min-width: 1012px) {\n --Layout-sidebar-width: 296px;\n }\n\n &.Layout--sidebar-narrow {\n @media (min-width: 768px) {\n --Layout-sidebar-width: 240px;\n }\n\n @media (min-width: 1012px) {\n --Layout-sidebar-width: 256px;\n }\n }\n\n &.Layout--sidebar-wide {\n @media (min-width: 1012px) {\n --Layout-sidebar-width: 320px;\n }\n\n @media (min-width: 1280px) {\n --Layout-sidebar-width: 336px;\n }\n }\n\n /* Sidebar position */\n\n &.Layout--sidebarPosition-start {\n & .Layout-sidebar {\n grid-column: 1;\n }\n\n & .Layout-main {\n grid-column: 2 / span 2;\n }\n }\n\n &.Layout--sidebarPosition-end {\n grid-template-columns: minmax(0, calc(100% - var(--Layout-sidebar-width) - var(--Layout-gutter))) 0 auto;\n\n & .Layout-main {\n grid-column: 1;\n }\n\n & .Layout-sidebar {\n grid-column: 2 / span 2;\n }\n }\n\n /* Sidebar divider */\n\n &.Layout--divided {\n & .Layout-divider {\n display: block;\n grid-column: 2;\n width: 1px;\n margin-right: -1px;\n background: var(--color-border-default);\n }\n\n & .Layout-main {\n grid-column: 3 / span 1;\n }\n\n &.Layout--sidebarPosition-end {\n & .Layout-sidebar {\n grid-column: 3 / span 1;\n }\n\n & .Layout-main {\n grid-column: 1;\n }\n }\n }\n}\n\n.Layout-divider {\n display: none;\n width: 1px;\n}\n\n.Layout-sidebar {\n width: var(--Layout-sidebar-width);\n}\n\n.Layout-main {\n min-width: 0;\n\n /* Centered main column\n ** FIXME: right-aligned sidebar */\n & .Layout-main-centered-md,\n & .Layout-main-centered-lg,\n & .Layout-main-centered-xl {\n margin-right: auto;\n margin-left: auto;\n\n & > .container-md,\n & > .container-lg,\n & > .container-xl {\n margin-left: 0;\n }\n }\n\n & .Layout-main-centered-md {\n max-width: calc(var(--breakpoint-medium) + var(--Layout-sidebar-width) + var(--Layout-gutter));\n }\n\n & .Layout-main-centered-lg {\n max-width: calc(var(--breakpoint-large) + var(--Layout-sidebar-width) + var(--Layout-gutter));\n }\n\n & .Layout-main-centered-xl {\n max-width: calc(var(--breakpoint-xlarge) + var(--Layout-sidebar-width) + var(--Layout-gutter));\n }\n}\n"]}
@@ -73,7 +73,7 @@
73
73
  background: var(--color-canvas-inset);
74
74
  border-color: var(--color-border-default);
75
75
  border-style: solid;
76
- border-width: var(--borderWidth-thin, 1px) 0;
76
+ border-width: var(--borderWidth-thin) 0;
77
77
  }
78
78
  }
79
79
  }
@@ -255,14 +255,14 @@
255
255
  }
256
256
 
257
257
  & .Layout-main-centered-md {
258
- max-width: calc(var(--breakpoint-medium, 768px) + var(--Layout-sidebar-width) + var(--Layout-gutter));
258
+ max-width: calc(var(--breakpoint-medium) + var(--Layout-sidebar-width) + var(--Layout-gutter));
259
259
  }
260
260
 
261
261
  & .Layout-main-centered-lg {
262
- max-width: calc(var(--breakpoint-large, 1012px) + var(--Layout-sidebar-width) + var(--Layout-gutter));
262
+ max-width: calc(var(--breakpoint-large) + var(--Layout-sidebar-width) + var(--Layout-gutter));
263
263
  }
264
264
 
265
265
  & .Layout-main-centered-xl {
266
- max-width: calc(var(--breakpoint-xlarge, 1280px) + var(--Layout-sidebar-width) + var(--Layout-gutter));
266
+ max-width: calc(var(--breakpoint-xlarge) + var(--Layout-sidebar-width) + var(--Layout-gutter));
267
267
  }
268
268
  }
@@ -1 +1 @@
1
- .menu{background-color:var(--color-canvas-default);border:var(--borderWidth-thin,1px) solid var(--color-border-default);border-radius:var(--borderRadius-medium,6px);list-style:none;margin-bottom:var(--stack-gap-normal,16px)}.menu-item{border-bottom:var(--borderWidth-thin,1px) solid var(--color-border-muted);color:var(--color-fg-default);display:block;padding:var(--control-medium-paddingInline-condensed,8px) var(--control-medium-paddingInline-spacious,16px);position:relative}.menu-item:first-child{border-top:0;border-top-right-radius:var(--borderRadius-medium,6px)}.menu-item:first-child,.menu-item:first-child:before{border-top-left-radius:var(--borderRadius-medium,6px)}.menu-item:last-child{border-bottom:0;border-bottom-right-radius:var(--borderRadius-medium,6px)}.menu-item:last-child,.menu-item:last-child:before{border-bottom-left-radius:var(--borderRadius-medium,6px)}.menu-item:hover{background-color:var(--color-neutral-subtle);text-decoration:none}.menu-item:active{background-color:var(--color-canvas-subtle)}.menu-item.selected,.menu-item[aria-current]:not([aria-current=false]),.menu-item[aria-selected=true]{background-color:var(--color-menu-bg-active);cursor:default}.menu-item.selected:before,.menu-item[aria-current]:not([aria-current=false]):before,.menu-item[aria-selected=true]:before{background-color:var(--color-primer-border-active);bottom:0;content:"";left:0;position:absolute;top:0;width:2px}.menu-item .octicon{color:var(--color-fg-muted);margin-right:var(--control-medium-gap,8px);text-align:center;width:16px}.menu-item .Counter{float:right;margin-left:var(--control-small-gap,4px)}.menu-item .menu-warning{color:var(--color-attention-fg);float:right}.menu-item .avatar{float:left;margin-right:var(--control-small-gap,4px)}.menu-item.alert .Counter{color:var(--color-danger-fg)}.menu-heading{border-bottom:var(--borderWidth-thin,1px) solid var(--color-border-muted);color:var(--color-fg-default);display:block;font-size:inherit;font-weight:var(--base-text-weight-semibold,600);margin-bottom:0;margin-top:0;padding:var(--control-medium-paddingInline-condensed,8px) var(--control-medium-paddingInline-spacious,16px)}.menu-heading:hover{text-decoration:none}.menu-heading:first-child{border-top-left-radius:var(--borderRadius-medium,6px);border-top-right-radius:var(--borderRadius-medium,6px)}.menu-heading:last-child{border-bottom:0;border-bottom-left-radius:var(--borderRadius-medium,6px);border-bottom-right-radius:var(--borderRadius-medium,6px)}
1
+ .menu{background-color:var(--color-canvas-default);border:var(--borderWidth-thin,max(1px,.0625rem)) solid var(--color-border-default);border-radius:var(--borderRadius-medium,6px);list-style:none;margin-bottom:var(--stack-gap-normal,1rem)}.menu-item{border-bottom:var(--borderWidth-thin,max(1px,.0625rem)) solid var(--color-border-muted);color:var(--color-fg-default);display:block;padding:var(--control-medium-paddingInline-condensed,.5rem) var(--control-medium-paddingInline-spacious,1rem);position:relative}.menu-item:first-child{border-top:0;border-top-right-radius:var(--borderRadius-medium,6px)}.menu-item:first-child,.menu-item:first-child:before{border-top-left-radius:var(--borderRadius-medium,6px)}.menu-item:last-child{border-bottom:0;border-bottom-right-radius:var(--borderRadius-medium,6px)}.menu-item:last-child,.menu-item:last-child:before{border-bottom-left-radius:var(--borderRadius-medium,6px)}.menu-item:hover{background-color:var(--color-neutral-subtle);text-decoration:none}.menu-item:active{background-color:var(--color-canvas-subtle)}.menu-item.selected,.menu-item[aria-current]:not([aria-current=false]),.menu-item[aria-selected=true]{background-color:var(--color-menu-bg-active);cursor:default}.menu-item.selected:before,.menu-item[aria-current]:not([aria-current=false]):before,.menu-item[aria-selected=true]:before{background-color:var(--color-primer-border-active);bottom:0;content:"";left:0;position:absolute;top:0;width:2px}.menu-item .octicon{color:var(--color-fg-muted);margin-right:var(--control-medium-gap,.5rem);text-align:center;width:16px}.menu-item .Counter{float:right;margin-left:var(--control-small-gap,.25rem)}.menu-item .menu-warning{color:var(--color-attention-fg);float:right}.menu-item .avatar{float:left;margin-right:var(--control-small-gap,.25rem)}.menu-item.alert .Counter{color:var(--color-danger-fg)}.menu-heading{border-bottom:var(--borderWidth-thin,max(1px,.0625rem)) solid var(--color-border-muted);color:var(--color-fg-default);display:block;font-size:inherit;font-weight:var(--base-text-weight-semibold,600);margin-bottom:0;margin-top:0;padding:var(--control-medium-paddingInline-condensed,.5rem) var(--control-medium-paddingInline-spacious,1rem)}.menu-heading:hover{text-decoration:none}.menu-heading:first-child{border-top-left-radius:var(--borderRadius-medium,6px);border-top-right-radius:var(--borderRadius-medium,6px)}.menu-heading:last-child{border-bottom:0;border-bottom-left-radius:var(--borderRadius-medium,6px);border-bottom-right-radius:var(--borderRadius-medium,6px)}