primer_view_components 0.51.4 → 0.51.6
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- checksums.yaml +4 -4
- data/CHANGELOG.md +16 -0
- data/app/assets/javascripts/primer_view_components.js +1 -1
- data/app/assets/javascripts/primer_view_components.js.map +1 -1
- data/app/assets/styles/primer_view_components.css +1 -1
- data/app/assets/styles/primer_view_components.css.map +1 -1
- data/app/components/primer/alpha/action_bar.css +1 -1
- data/app/components/primer/alpha/action_bar.css.map +1 -1
- data/app/components/primer/alpha/action_list.css +1 -1
- data/app/components/primer/alpha/action_list.css.json +4 -10
- data/app/components/primer/alpha/action_list.css.map +1 -1
- data/app/components/primer/alpha/auto_complete.css +1 -1
- data/app/components/primer/alpha/auto_complete.css.map +1 -1
- data/app/components/primer/alpha/banner.css +1 -1
- data/app/components/primer/alpha/banner.css.map +1 -1
- data/app/components/primer/alpha/button_marketing.css +1 -1
- data/app/components/primer/alpha/button_marketing.css.map +1 -1
- data/app/components/primer/alpha/dialog.css +1 -1
- data/app/components/primer/alpha/dialog.css.json +2 -1
- data/app/components/primer/alpha/dialog.css.map +1 -1
- data/app/components/primer/alpha/dialog.pcss +4 -1
- data/app/components/primer/alpha/dropdown.css +1 -1
- data/app/components/primer/alpha/dropdown.css.map +1 -1
- data/app/components/primer/alpha/dropdown.pcss +8 -12
- data/app/components/primer/alpha/layout.css +1 -1
- data/app/components/primer/alpha/layout.css.json +10 -14
- data/app/components/primer/alpha/layout.css.map +1 -1
- data/app/components/primer/alpha/menu.css +1 -1
- data/app/components/primer/alpha/menu.css.map +1 -1
- data/app/components/primer/alpha/overlay.css +1 -1
- data/app/components/primer/alpha/overlay.css.map +1 -1
- data/app/components/primer/alpha/segmented_control.css +1 -1
- data/app/components/primer/alpha/segmented_control.css.json +1 -2
- data/app/components/primer/alpha/segmented_control.css.map +1 -1
- data/app/components/primer/alpha/select_panel.css +1 -1
- data/app/components/primer/alpha/select_panel.css.map +1 -1
- data/app/components/primer/alpha/skeleton_box.css +1 -1
- data/app/components/primer/alpha/skeleton_box.css.map +1 -1
- data/app/components/primer/alpha/stack.css +1 -1
- data/app/components/primer/alpha/stack.css.map +1 -1
- data/app/components/primer/alpha/tab_nav.css +1 -1
- data/app/components/primer/alpha/tab_nav.css.map +1 -1
- data/app/components/primer/alpha/text_field.css +1 -1
- data/app/components/primer/alpha/text_field.css.json +1 -2
- data/app/components/primer/alpha/text_field.css.map +1 -1
- data/app/components/primer/alpha/toggle_switch.css +1 -1
- data/app/components/primer/alpha/toggle_switch.css.map +1 -1
- data/app/components/primer/alpha/tree_view/sub_tree_node.rb +1 -1
- data/app/components/primer/alpha/tree_view/visual.rb +1 -1
- data/app/components/primer/alpha/tree_view.css +1 -1
- data/app/components/primer/alpha/tree_view.css.json +1 -2
- data/app/components/primer/alpha/tree_view.css.map +1 -1
- data/app/components/primer/alpha/underline_nav.css +1 -1
- data/app/components/primer/alpha/underline_nav.css.map +1 -1
- data/app/components/primer/beta/avatar.css +1 -1
- data/app/components/primer/beta/avatar.css.map +1 -1
- data/app/components/primer/beta/avatar_stack.css +1 -1
- data/app/components/primer/beta/avatar_stack.css.map +1 -1
- data/app/components/primer/beta/blankslate.css +1 -1
- data/app/components/primer/beta/blankslate.css.map +1 -1
- data/app/components/primer/beta/border_box.css +1 -1
- data/app/components/primer/beta/border_box.css.map +1 -1
- data/app/components/primer/beta/breadcrumbs.css +1 -1
- data/app/components/primer/beta/breadcrumbs.css.map +1 -1
- data/app/components/primer/beta/button.css +1 -1
- data/app/components/primer/beta/button.css.map +1 -1
- data/app/components/primer/beta/button_group.css +1 -1
- data/app/components/primer/beta/button_group.css.map +1 -1
- data/app/components/primer/beta/button_group.rb +1 -1
- data/app/components/primer/beta/counter.css +1 -1
- data/app/components/primer/beta/counter.css.map +1 -1
- data/app/components/primer/beta/flash.css +1 -1
- data/app/components/primer/beta/flash.css.map +1 -1
- data/app/components/primer/beta/label.css +1 -1
- data/app/components/primer/beta/label.css.map +1 -1
- data/app/components/primer/beta/link.css +1 -1
- data/app/components/primer/beta/link.css.map +1 -1
- data/app/components/primer/beta/popover.css +1 -1
- data/app/components/primer/beta/popover.css.map +1 -1
- data/app/components/primer/beta/progress_bar.css +1 -1
- data/app/components/primer/beta/progress_bar.css.map +1 -1
- data/app/components/primer/beta/state.css +1 -1
- data/app/components/primer/beta/state.css.map +1 -1
- data/app/components/primer/beta/subhead.css +1 -1
- data/app/components/primer/beta/subhead.css.map +1 -1
- data/app/components/primer/beta/timeline_item.css +1 -1
- data/app/components/primer/beta/timeline_item.css.map +1 -1
- data/app/components/primer/beta/truncate.css +1 -1
- data/app/components/primer/beta/truncate.css.map +1 -1
- data/app/components/primer/dialog_helper.js +10 -1
- data/app/components/primer/dialog_helper.ts +16 -1
- data/app/lib/primer/forms/acts_as_component.rb +1 -1
- data/app/lib/primer/forms/toggle_switch_form.rb +1 -1
- data/lib/primer/form_components.rb +1 -1
- data/lib/primer/view_components/version.rb +1 -1
- data/previews/primer/alpha/dropdown_preview.rb +12 -0
- data/static/info_arch.json +6 -6
- data/static/previews.json +6 -6
- metadata +2 -2
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["avatar_stack.pcss"],"names":[],"mappings":"AAUA,
|
|
1
|
+
{"version":3,"sources":["avatar_stack.pcss"],"names":[],"mappings":"AAUA,aACE,iBAAkB,CAClB,cAAe,CACf,WAaF,CAXE,+BACE,iBACF,CAEA,8BACE,cACF,CAEA,qCACE,cACF,CAGF,kBACE,YAAa,CACb,iCAAkC,CAElC,mBAgEF,CA9DE,0BACE,iBAAkB,CAClB,SAAU,CACV,YAAa,CACb,UAAW,CACX,WAAY,CACZ,kBAAuB,CAEvB,kBAAmB,CACnB,uCAAwC,CACxC,uCAAwC,CACxC,iCAoBF,CAlBE,2CACE,SACF,CAEA,0CACE,SACF,CAGA,mCACE,uCACF,CASF,4FACE,YAAa,CACb,SACF,CAIE,0HACE,+BACF,CAOA,uRACE,YAAa,CACb,SACF,CAEA,+HACE,sBACF,CAGF,uCACE,iBACF,CAGF,oBACE,SAAU,CACV,cAAe,CACf,+BAsBF,CApBE,qDAEE,iBAAkB,CAClB,aAAc,CACd,WAAY,CACZ,UAAW,CAEX,iBAAkB,CAClB,4DACF,CAEA,2BACE,UAAW,CACX,gDACF,CAEA,0BACE,UAAW,CACX,kDACF,CAMA,sCACE,OAAQ,CACR,0BAMF,CAJE,oFACE,cAAe,CACf,8BACF,CAGF,wCACE,kDAUF,CARE,oDACE,SACF,CAEA,mDACE,SAAU,CACV,+BACF,CAGF,4BACE,cAAe,CAEf,iBACF","file":"avatar_stack.css","sourcesContent":["/* stylelint-disable selector-max-specificity */\n/* The selector-max-specificity rule is disabled here because the nested selectors\n in AvatarStack require high specificity to properly override default styles and \n achieve the intended visual stacking. */\n\n/* AvatarStack */\n\n/* Stacked avatars can be used to show who is participating in thread when\n** there is limited space available. */\n\n.AvatarStack {\n position: relative;\n min-width: 26px;\n height: 20px;\n\n & .AvatarStack-body {\n position: absolute;\n }\n\n &.AvatarStack--two {\n min-width: 36px;\n }\n\n &.AvatarStack--three-plus {\n min-width: 46px;\n }\n}\n\n.AvatarStack-body {\n display: flex;\n background: var(--bgColor-default);\n /* stylelint-disable-next-line primer/borders */\n border-radius: 100px;\n\n & .avatar {\n position: relative;\n z-index: 2;\n display: flex;\n width: 20px;\n height: 20px;\n box-sizing: content-box;\n /* stylelint-disable-next-line primer/spacing */\n margin-right: -11px;\n background-color: var(--bgColor-default);\n border-radius: var(--borderRadius-small);\n transition: margin 0.1s ease-in-out;\n\n &:first-child {\n z-index: 3;\n }\n\n &:last-child {\n z-index: 1;\n }\n\n /* stylelint-disable-next-line selector-max-type */\n & img {\n border-radius: var(--borderRadius-small);\n }\n\n /* Account for 4+ avatars */\n &:nth-child(n + 4) {\n display: none;\n opacity: 0;\n }\n }\n /* stylelint-disable-next-line selector-max-type */\n & span:nth-child(n + 4) .avatar {\n display: none;\n opacity: 0;\n }\n\n &:hover:not([data-disable-expand]),\n &:focus-within:not([data-disable-expand]) {\n & .avatar {\n margin-right: var(--base-size-4);\n }\n\n & .avatar:nth-child(n + 4) {\n display: flex;\n opacity: 1;\n }\n /* stylelint-disable-next-line selector-max-type */\n & span:nth-child(n + 4) .avatar {\n display: flex;\n opacity: 1;\n }\n\n & .avatar-more {\n display: none !important;\n }\n }\n\n &[data-disable-expand] {\n position: relative;\n }\n}\n\n.avatar.avatar-more {\n z-index: 1;\n margin-right: 0;\n background: var(--bgColor-muted);\n\n &::before,\n &::after {\n position: absolute;\n display: block;\n height: 20px;\n content: '';\n /* stylelint-disable-next-line primer/borders */\n border-radius: 2px;\n outline: var(--borderWidth-thin) solid var(--bgColor-default);\n }\n\n &::before {\n width: 17px;\n background: var(--avatarStack-fade-bgColor-muted);\n }\n\n &::after {\n width: 14px;\n background: var(--avatarStack-fade-bgColor-default);\n }\n}\n\n/* Right aligned variation */\n\n.AvatarStack--right {\n & .AvatarStack-body {\n right: 0;\n flex-direction: row-reverse;\n\n &:hover:not([data-disable-expand]) .avatar {\n margin-right: 0;\n margin-left: var(--base-size-4);\n }\n }\n\n & .avatar.avatar-more {\n background: var(--avatarStack-fade-bgColor-default);\n\n &::before {\n width: 5px;\n }\n\n &::after {\n width: 2px;\n background: var(--bgColor-muted);\n }\n }\n\n & .avatar {\n margin-right: 0;\n /* stylelint-disable-next-line primer/spacing */\n margin-left: -11px;\n }\n}\n"]}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
.blankslate-container{container-type:inline-size;width:100%}.blankslate{--blankslate-outer-padding-block:var(--base-size-32);--blankslate-outer-padding-inline:var(--base-size-32);padding:var(--blankslate-outer-padding-block) var(--blankslate-outer-padding-inline);
|
|
1
|
+
.blankslate-container{container-type:inline-size;width:100%}.blankslate{--blankslate-outer-padding-block:var(--base-size-32);--blankslate-outer-padding-inline:var(--base-size-32);position:relative;padding:var(--blankslate-outer-padding-block) var(--blankslate-outer-padding-inline);text-align:center}.blankslate p{font-size:var(--text-body-size-large);color:var(--fgColor-muted)}.blankslate code{padding:var(--base-size-2) var(--base-size-4) var(--base-size-4);font-size:var(--text-body-size-medium);background:var(--bgColor-default);border:var(--borderWidth-thin) solid var(--borderColor-muted);border-radius:var(--borderRadius-medium)}.blankslate img{width:56px;height:56px}.blankslate-icon{margin-right:var(--control-small-gap);margin-bottom:var(--stack-gap-condensed);margin-left:var(--control-small-gap);color:var(--fgColor-muted)}.blankslate-image{margin-bottom:var(--stack-gap-normal)}.blankslate-heading{margin-bottom:var(--base-size-4);font-size:var(--text-title-size-medium);font-weight:var(--text-title-weight-medium);text-wrap:balance}.blankslate-description{text-wrap:balance}.blankslate-action{margin-top:var(--stack-gap-normal)}.blankslate-action:first-of-type{margin-top:var(--stack-gap-spacious)}.blankslate-action:last-of-type{margin-bottom:var(--stack-gap-condensed)}.blankslate-capped{border-radius:0 0 var(--borderRadius-medium) var(--borderRadius-medium)}.blankslate-spacious{--blankslate-outer-padding-block:var(--base-size-80);--blankslate-outer-padding-inline:var(--base-size-40)}.blankslate-narrow{max-width:485px;margin:0 auto}.blankslate-large img{width:80px;height:80px}.blankslate-large h3{margin:var(--stack-gap-normal) 0;font-size:24px}.blankslate-large p{font-size:var(--text-body-size-large)}.blankslate-clean-background{border:0}@container (max-width: 34rem){.blankslate{--blankslate-outer-padding-block:var(--base-size-20);--blankslate-outer-padding-inline:var(--base-size-20)}.blankslate-spacious{--blankslate-outer-padding-block:var(--base-size-44);--blankslate-outer-padding-inline:var(--base-size-28)}.blankslate-icon{margin-bottom:var(--stack-gap-condensed)}.blankslate-heading{font-size:var(--text-title-size-small)}.blankslate p{font-size:var(--text-body-size-medium)}.blankslate-action{margin-top:var(--stack-gap-condensed)}.blankslate-action:first-of-type{margin-top:var(--stack-gap-normal)}.blankslate-action:last-of-type{margin-bottom:calc(var(--stack-gap-condensed)/2)}}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["blankslate.pcss"],"names":[],"mappings":"AAEA,sBACE,0BAA2B,CAC3B,UACF,CAEA,YACE,oDAAqD,CACrD,qDAAsD,
|
|
1
|
+
{"version":3,"sources":["blankslate.pcss"],"names":[],"mappings":"AAEA,sBACE,0BAA2B,CAC3B,UACF,CAEA,YACE,oDAAqD,CACrD,qDAAsD,CAEtD,iBAAkB,CAElB,oFAAqF,CACrF,iBAsBF,CAnBE,cACE,qCAAsC,CACtC,0BACF,CAGA,iBACE,gEAAiE,CACjE,sCAAuC,CACvC,iCAAkC,CAClC,6DAA8D,CAC9D,wCACF,CAGA,gBACE,UAAW,CACX,WACF,CAGF,iBAEE,qCAAsC,CAEtC,wCAAyC,CAEzC,oCAAqC,CACrC,0BACF,CAEA,kBAEE,qCACF,CAEA,oBACE,gCAAiC,CACjC,uCAAwC,CACxC,2CAA4C,CAC5C,iBACF,CAEA,wBACE,iBACF,CAEA,mBAEE,kCAWF,CATE,iCAEE,oCACF,CAEA,gCAEE,wCACF,CAGF,mBACE,uEACF,CAEA,qBACE,oDAAqD,CACrD,qDACF,CAEA,mBACE,eAAgB,CAChB,aACF,CAME,sBACE,UAAW,CACX,WACF,CAGA,qBAEE,gCAAiC,CAIjC,cACF,CAGA,oBACE,qCACF,CAKF,6BACE,QACF,CAIA,8BACE,YACE,oDAAqD,CACrD,qDACF,CAEA,qBACE,oDAAqD,CACrD,qDACF,CAEA,iBAEE,wCACF,CAEA,oBACE,sCACF,CAGA,cACE,sCACF,CAEA,mBAEE,qCAWF,CATE,iCAEE,kCACF,CAEA,gCAEE,gDACF,CAEJ","file":"blankslate.css","sourcesContent":["/* blankslate */\n\n.blankslate-container {\n container-type: inline-size;\n width: 100%;\n}\n\n.blankslate {\n --blankslate-outer-padding-block: var(--base-size-32);\n --blankslate-outer-padding-inline: var(--base-size-32);\n\n position: relative;\n /* stylelint-disable-next-line primer/spacing */\n padding: var(--blankslate-outer-padding-block) var(--blankslate-outer-padding-inline);\n text-align: center;\n\n /* stylelint-disable-next-line selector-max-type */\n & p {\n font-size: var(--text-body-size-large);\n color: var(--fgColor-muted);\n }\n\n /* stylelint-disable-next-line selector-max-type */\n & code {\n padding: var(--base-size-2) var(--base-size-4) var(--base-size-4);\n font-size: var(--text-body-size-medium);\n background: var(--bgColor-default);\n border: var(--borderWidth-thin) solid var(--borderColor-muted);\n border-radius: var(--borderRadius-medium);\n }\n\n /* stylelint-disable-next-line selector-max-type */\n & img {\n width: 56px;\n height: 56px;\n }\n}\n\n.blankslate-icon {\n /* stylelint-disable-next-line primer/spacing */\n margin-right: var(--control-small-gap);\n /* stylelint-disable-next-line primer/spacing */\n margin-bottom: var(--stack-gap-condensed);\n /* stylelint-disable-next-line primer/spacing */\n margin-left: var(--control-small-gap);\n color: var(--fgColor-muted);\n}\n\n.blankslate-image {\n /* stylelint-disable-next-line primer/spacing */\n margin-bottom: var(--stack-gap-normal);\n}\n\n.blankslate-heading {\n margin-bottom: var(--base-size-4);\n font-size: var(--text-title-size-medium);\n font-weight: var(--text-title-weight-medium);\n text-wrap: balance;\n}\n\n.blankslate-description {\n text-wrap: balance;\n}\n\n.blankslate-action {\n /* stylelint-disable-next-line primer/spacing */\n margin-top: var(--stack-gap-normal);\n\n &:first-of-type {\n /* stylelint-disable-next-line primer/spacing */\n margin-top: var(--stack-gap-spacious);\n }\n\n &:last-of-type {\n /* stylelint-disable-next-line primer/spacing */\n margin-bottom: var(--stack-gap-condensed);\n }\n}\n\n.blankslate-capped {\n border-radius: 0 0 var(--borderRadius-medium) var(--borderRadius-medium);\n}\n\n.blankslate-spacious {\n --blankslate-outer-padding-block: var(--base-size-80);\n --blankslate-outer-padding-inline: var(--base-size-40);\n}\n\n.blankslate-narrow {\n max-width: 485px;\n margin: 0 auto;\n}\n\n/* was .large-format\n** QUESTION: should we deprecate this? */\n.blankslate-large {\n /* stylelint-disable-next-line selector-max-type */\n & img {\n width: 80px;\n height: 80px;\n }\n\n /* stylelint-disable-next-line selector-max-type */\n & h3 {\n /* stylelint-disable-next-line primer/spacing */\n margin: var(--stack-gap-normal) 0;\n\n /* font-size: $h3-size; // This doesn't actually make the text larger. Should this be $h2-size? */\n /* stylelint-disable-next-line primer/typography */\n font-size: 24px;\n }\n\n /* stylelint-disable-next-line selector-max-type */\n & p {\n font-size: var(--text-body-size-large);\n }\n}\n\n/* was .clean-background\n** TO DO: deprecate this and use utility instead */\n.blankslate-clean-background {\n border: 0;\n}\n\n/* At the time these styles were written,\n `34rem` was our \"small\" breakpoint width */\n@container (max-width: 34rem) {\n .blankslate {\n --blankslate-outer-padding-block: var(--base-size-20);\n --blankslate-outer-padding-inline: var(--base-size-20);\n }\n\n .blankslate-spacious {\n --blankslate-outer-padding-block: var(--base-size-44);\n --blankslate-outer-padding-inline: var(--base-size-28);\n }\n\n .blankslate-icon {\n /* stylelint-disable-next-line primer/spacing */\n margin-bottom: var(--stack-gap-condensed);\n }\n\n .blankslate-heading {\n font-size: var(--text-title-size-small);\n }\n\n /* stylelint-disable-next-line selector-max-type */\n .blankslate p {\n font-size: var(--text-body-size-medium);\n }\n\n .blankslate-action {\n /* stylelint-disable-next-line primer/spacing */\n margin-top: var(--stack-gap-condensed);\n\n &:first-of-type {\n /* stylelint-disable-next-line primer/spacing */\n margin-top: var(--stack-gap-normal);\n }\n\n &:last-of-type {\n /* stylelint-disable-next-line primer/spacing */\n margin-bottom: calc(var(--stack-gap-condensed) / 2);\n }\n }\n}\n"]}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
.Box{background-color:var(--bgColor-default);border-color:var(--borderColor-default);border-
|
|
1
|
+
.Box{background-color:var(--bgColor-default);border-color:var(--borderColor-default);border-style:solid;border-width:var(--borderWidth-thin);border-radius:var(--borderRadius-medium)}.Box--condensed{line-height:1.25}.Box--condensed .Box-body,.Box--condensed .Box-footer,.Box--condensed .Box-header{padding:var(--stack-padding-condensed) var(--stack-padding-normal)}.btn-octicon:is(.Box--condensed .Box-btn-octicon){padding:var(--control-medium-paddingInline-condensed) var(--control-medium-paddingInline-spacious);margin:calc(var(--controlStack-medium-gap-condensed)*-1) calc(var(--controlStack-small-gap-spacious)*-1);line-height:1.25}.Box--condensed .Box-row{padding:var(--stack-padding-condensed) var(--stack-padding-normal)}.Box--spacious .Box-header{padding:var(--stack-padding-spacious);line-height:1.25}.Box--spacious .Box-title{font-size:var(--text-title-size-medium)}.Box--spacious .Box-body,.Box--spacious .Box-footer{padding:var(--stack-padding-spacious)}.btn-octicon:is(.Box--spacious .Box-btn-octicon){padding:var(--stack-padding-spacious);margin:calc(var(--stack-gap-spacious)*-1)}.Box--spacious .Box-row{padding:var(--stack-padding-spacious)}.Box-header{padding:var(--stack-padding-normal);margin:calc(var(--borderWidth-thin)*-1) calc(var(--borderWidth-thin)*-1) 0;background-color:var(--bgColor-muted);border-color:var(--borderColor-default);border-style:solid;border-width:var(--borderWidth-thin);border-top-left-radius:var(--borderRadius-medium);border-top-right-radius:var(--borderRadius-medium)}.Box-title{font-size:var(--text-body-size-medium);font-weight:var(--base-text-weight-semibold)}.Box-body{padding:var(--stack-padding-normal);border-bottom:var(--borderWidth-thin) solid var(--borderColor-default)}.Box-body:last-of-type{margin-bottom:calc(var(--borderWidth-thin)*-1);border-bottom-right-radius:var(--borderRadius-medium);border-bottom-left-radius:var(--borderRadius-medium)}.Box-row{padding:var(--stack-padding-normal);margin-top:calc(var(--borderWidth-thin)*-1);list-style-type:none;border-top:var(--borderWidth-thin) solid var(--borderColor-muted)}.Box-row:first-of-type{border-top-left-radius:var(--borderRadius-medium);border-top-right-radius:var(--borderRadius-medium)}.Box-row:last-of-type{border-bottom-right-radius:var(--borderRadius-medium);border-bottom-left-radius:var(--borderRadius-medium)}.Box-row.Box-row--unread,.Box-row.unread{box-shadow:inset 2px 0 0 var(--borderColor-accent-emphasis)}.Box-row.navigation-focus .Box-row--drag-button{color:var(--fgColor-accent);cursor:grab;opacity:1}.Box-row.navigation-focus.is-dragging .Box-row--drag-button{cursor:grabbing}.Box-row.navigation-focus.sortable-chosen,.Box-row.navigation-focus.sortable-ghost{background-color:var(--bgColor-muted)}.Box-row.navigation-focus.sortable-ghost .Box-row--drag-hide{opacity:0}.Box-row--focus-gray.navigation-focus{background-color:var(--bgColor-muted)}.Box-row--focus-blue.navigation-focus{background-color:var(--bgColor-accent-muted)}.Box-row--hover-gray:hover{background-color:var(--bgColor-muted)}.Box-row--hover-blue:hover{background-color:var(--bgColor-accent-muted)}@media (min-width:768px){.Box-row-link{color:var(--fgColor-default)}.Box-row-link,.Box-row-link:hover{-webkit-text-decoration:none;text-decoration:none}.Box-row-link:hover{color:var(--fgColor-accent)}}.Box-row--drag-button{opacity:0}.Box-footer{padding:var(--stack-padding-normal);margin-top:calc(var(--borderWidth-thin)*-1);border-top:var(--borderWidth-thin) solid var(--borderColor-default);border-radius:0 0 var(--borderRadius-medium) var(--borderRadius-medium)}.Box--scrollable{max-height:324px;overflow:scroll}.Box--blue,.Box--blue .Box-header{border-color:var(--borderColor-accent-muted)}.Box--blue .Box-header{background-color:var(--bgColor-accent-muted)}.Box--blue .Box-body,.Box--blue .Box-footer,.Box--blue .Box-row{border-color:var(--borderColor-accent-muted)}.Box--danger,:is(.Box--danger .Box-body):last-of-type,:is(.Box--danger .Box-row):first-of-type{border-color:var(--borderColor-danger-emphasis)}.Box-header--blue{background-color:var(--bgColor-accent-muted);border-color:var(--borderColor-accent-muted)}.Box-row--yellow{background-color:var(--bgColor-attention-muted)}.Box-row--blue{background-color:var(--bgColor-accent-muted)}.Box-row--gray{background-color:var(--bgColor-muted)}.Box-btn-octicon.btn-octicon{padding:var(--control-medium-paddingInline-spacious);margin:calc(var(--controlStack-small-gap-spacious)*-1);line-height:var(--text-title-lineHeight-large)}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["border_box.pcss"],"names":[],"mappings":"AAMA,KACE,uCAAwC,CACxC,uCAAwC,
|
|
1
|
+
{"version":3,"sources":["border_box.pcss"],"names":[],"mappings":"AAMA,KACE,uCAAwC,CACxC,uCAAwC,CACxC,kBAAmB,CACnB,oCAAqC,CACrC,wCACF,CAGA,gBACE,gBAyBF,CAfE,kFACE,kEACF,CAGE,kDACE,kGAAmG,CACnG,wGAA6G,CAC7G,gBACF,CAGF,yBACE,kEACF,CAIA,2BACE,qCAAsC,CACtC,gBACF,CAEA,0BACE,uCACF,CAMA,oDACE,qCACF,CAGE,iDACE,qCAAsC,CACtC,yCACF,CAGF,wBACE,qCACF,CAGF,YACE,mCAAoC,CACpC,0EAA+E,CAC/E,qCAAsC,CACtC,uCAAwC,CACxC,kBAAmB,CACnB,oCAAqC,CACrC,iDAAkD,CAClD,kDACF,CAEA,WACE,sCAAuC,CACvC,4CACF,CAEA,UACE,mCAAoC,CACpC,sEAQF,CALE,uBACE,8CAAiD,CACjD,qDAAsD,CACtD,oDACF,CAIF,SACE,mCAAoC,CACpC,2CAA8C,CAC9C,oBAAqB,CAGrB,iEAiDF,CA/CE,uBACE,iDAAkD,CAClD,kDACF,CAEA,sBACE,qDAAsD,CACtD,oDACF,CAIA,yCAIE,2DACF,CAIE,gDACE,2BAA4B,CAC5B,WAAY,CACZ,SACF,CAGA,4DACE,eACF,CAQA,mFACE,qCAMF,CAHE,6DACE,SACF,CAMJ,sCACE,qCACF,CAIA,sCACE,4CACF,CAIA,2BACE,qCACF,CAIA,2BACE,4CACF,CAOA,yBADF,cAEI,4BAQJ,CALI,kCAFA,4BAAqB,CAArB,oBAKA,CAHA,oBACE,2BAEF,CACF,CAKF,sBACE,SACF,CAEA,YACE,mCAAoC,CACpC,2CAA8C,CAG9C,mEAAyC,CACzC,uEACF,CAGA,iBACE,gBAAiB,CACjB,eACF,CAOE,kCAFA,4CAKA,CAHA,uBACE,4CAEF,CAUA,gEACE,4CACF,CAeE,+FACE,+CACF,CAIJ,kBACE,4CAA6C,CAC7C,4CACF,CAIA,iBACE,+CACF,CAEA,eACE,4CACF,CAEA,eACE,qCACF,CAKE,6BACE,oDAAqD,CACrD,sDAAyD,CACzD,8CACF","file":"border_box.css","sourcesContent":["/* stylelint-disable primer/spacing */\n/* stylelint-disable primer/typography */\n\n/* BorderBox */\n\n/* TODO: Rename to BorderBox to match PVC */\n.Box {\n background-color: var(--bgColor-default);\n border-color: var(--borderColor-default);\n border-style: solid;\n border-width: var(--borderWidth-thin);\n border-radius: var(--borderRadius-medium);\n}\n\n/* Box padding density options */\n.Box--condensed {\n line-height: 1.25;\n\n & .Box-header {\n padding: var(--stack-padding-condensed) var(--stack-padding-normal);\n }\n\n & .Box-body {\n padding: var(--stack-padding-condensed) var(--stack-padding-normal);\n }\n\n & .Box-footer {\n padding: var(--stack-padding-condensed) var(--stack-padding-normal);\n }\n\n & .Box-btn-octicon {\n &.btn-octicon {\n padding: var(--control-medium-paddingInline-condensed) var(--control-medium-paddingInline-spacious);\n margin: calc(var(--controlStack-medium-gap-condensed) * -1) calc(var(--controlStack-small-gap-spacious) * -1);\n line-height: 1.25;\n }\n }\n\n & .Box-row {\n padding: var(--stack-padding-condensed) var(--stack-padding-normal);\n }\n}\n\n.Box--spacious {\n & .Box-header {\n padding: var(--stack-padding-spacious);\n line-height: 1.25;\n }\n\n & .Box-title {\n font-size: var(--text-title-size-medium);\n }\n\n & .Box-body {\n padding: var(--stack-padding-spacious);\n }\n\n & .Box-footer {\n padding: var(--stack-padding-spacious);\n }\n\n & .Box-btn-octicon {\n &.btn-octicon {\n padding: var(--stack-padding-spacious);\n margin: calc(var(--stack-gap-spacious) * -1);\n }\n }\n\n & .Box-row {\n padding: var(--stack-padding-spacious);\n }\n}\n\n.Box-header {\n padding: var(--stack-padding-normal);\n margin: calc(var(--borderWidth-thin) * -1) calc(var(--borderWidth-thin) * -1) 0;\n background-color: var(--bgColor-muted);\n border-color: var(--borderColor-default);\n border-style: solid;\n border-width: var(--borderWidth-thin);\n border-top-left-radius: var(--borderRadius-medium);\n border-top-right-radius: var(--borderRadius-medium);\n}\n\n.Box-title {\n font-size: var(--text-body-size-medium);\n font-weight: var(--base-text-weight-semibold);\n}\n\n.Box-body {\n padding: var(--stack-padding-normal);\n border-bottom: var(--borderWidth-thin) solid var(--borderColor-default);\n\n /* Ensures bottom-border doesn't poke out when .Box-body used without box-footer */\n &:last-of-type {\n margin-bottom: calc(var(--borderWidth-thin) * -1);\n border-bottom-right-radius: var(--borderRadius-medium);\n border-bottom-left-radius: var(--borderRadius-medium);\n }\n}\n\n/* Box rows */\n.Box-row {\n padding: var(--stack-padding-normal);\n margin-top: calc(var(--borderWidth-thin) * -1);\n list-style-type: none; /* To account for applying Box component to a list */\n border-top-color: var(--borderColor-muted);\n border-top-style: solid;\n border-top-width: var(--borderWidth-thin);\n\n &:first-of-type {\n border-top-left-radius: var(--borderRadius-medium);\n border-top-right-radius: var(--borderRadius-medium);\n }\n\n &:last-of-type {\n border-bottom-right-radius: var(--borderRadius-medium);\n border-bottom-left-radius: var(--borderRadius-medium);\n }\n\n /* Adds a blue vertical line to the left of the row\n ** For indicating a row item is unread */\n &.Box-row--unread,\n /* .unread to be deprecated with .Box-row-unread */\n &.unread {\n /* stylelint-disable-next-line primer/box-shadow */\n box-shadow: inset 2px 0 0 var(--borderColor-accent-emphasis);\n }\n\n &.navigation-focus {\n /* Focus styles for when drag icon */\n & .Box-row--drag-button {\n color: var(--fgColor-accent);\n cursor: grab;\n opacity: 100;\n }\n\n /* Grabbing while row is dragged */\n &.is-dragging .Box-row--drag-button {\n cursor: grabbing;\n }\n\n /* Row dragging styles */\n &.sortable-chosen {\n background-color: var(--bgColor-muted);\n }\n\n /* Makes dragging row background gray */\n &.sortable-ghost {\n background-color: var(--bgColor-muted);\n\n /* Hides contents of row while dragging so row looks solid gray */\n & .Box-row--drag-hide {\n opacity: 0;\n }\n }\n }\n}\n\n.Box-row--focus-gray {\n &.navigation-focus {\n background-color: var(--bgColor-muted);\n }\n}\n\n.Box-row--focus-blue {\n &.navigation-focus {\n background-color: var(--bgColor-accent-muted);\n }\n}\n\n.Box-row--hover-gray {\n &:hover {\n background-color: var(--bgColor-muted);\n }\n}\n\n.Box-row--hover-blue {\n &:hover {\n background-color: var(--bgColor-accent-muted);\n }\n}\n\n/* Optional link style\n** Makes links on mobile blue since they don't have hover state,\n** and links are dark-gray with blue hover on desktop. */\n.Box-row-link {\n @media (min-width: 768px) {\n color: var(--fgColor-default);\n text-decoration: none;\n\n &:hover {\n color: var(--fgColor-accent);\n text-decoration: none;\n }\n }\n}\n\n/* Optional drag icon styles for reordering items\n** Focus styles included in .Box-row above */\n.Box-row--drag-button {\n opacity: 0;\n}\n\n.Box-footer {\n padding: var(--stack-padding-normal);\n margin-top: calc(var(--borderWidth-thin) * -1); /* prevents double border when used with .Box-body */\n border-top-color: var(--borderColor-default);\n border-top-style: solid;\n border-top-width: var(--borderWidth-thin);\n border-radius: 0 0 var(--borderRadius-medium) var(--borderRadius-medium);\n}\n\n/* Option for a box with scrolling content */\n.Box--scrollable {\n max-height: 324px;\n overflow: scroll;\n}\n\n/* Box themes */\n\n.Box--blue {\n border-color: var(--borderColor-accent-muted);\n\n & .Box-header {\n background-color: var(--bgColor-accent-muted);\n border-color: var(--borderColor-accent-muted);\n }\n\n & .Box-body {\n border-color: var(--borderColor-accent-muted);\n }\n\n & .Box-row {\n border-color: var(--borderColor-accent-muted);\n }\n\n & .Box-footer {\n border-color: var(--borderColor-accent-muted);\n }\n}\n\n/* Applies and red border to the outside of the box,\n** but not to the border separating rows. */\n.Box--danger {\n border-color: var(--borderColor-danger-emphasis);\n\n & .Box-row {\n &:first-of-type {\n border-color: var(--borderColor-danger-emphasis);\n }\n }\n\n & .Box-body {\n &:last-of-type {\n border-color: var(--borderColor-danger-emphasis);\n }\n }\n}\n\n.Box-header--blue {\n background-color: var(--bgColor-accent-muted);\n border-color: var(--borderColor-accent-muted);\n}\n\n/* Box row highlight themes */\n\n.Box-row--yellow {\n background-color: var(--bgColor-attention-muted);\n}\n\n.Box-row--blue {\n background-color: var(--bgColor-accent-muted);\n}\n\n.Box-row--gray {\n background-color: var(--bgColor-muted);\n}\n\n/* Box with btn-octicon */\n.Box-btn-octicon {\n /* Increase specificity when btn-octicon is used because comes after .Box in the cascade */\n &.btn-octicon {\n padding: var(--control-medium-paddingInline-spacious);\n margin: calc(var(--controlStack-small-gap-spacious) * -1);\n line-height: var(--text-title-lineHeight-large); /* override btn-octicon line-height */\n }\n}\n"]}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
.breadcrumb-item{display:inline-block;list-style:none;max-width:100%}.breadcrumb-item:after{
|
|
1
|
+
.breadcrumb-item{display:inline-block;list-style:none;max-width:100%}.breadcrumb-item:after{display:inline-block;height:.8em;margin:0 .15em 0 .5em;content:"";border-right:.1em solid var(--borderColor-neutral-emphasis);transform:rotate(15deg) translateY(.0625em)}:is(.breadcrumb-item-selected,.breadcrumb-item[aria-current]:not([aria-current=false])):after{content:none}.breadcrumb-item-selected a{color:var(--fgColor-default);-webkit-text-decoration:none!important;text-decoration:none!important;cursor:default!important}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["breadcrumbs.pcss"],"names":[],"mappings":"AAAA,iBACE,oBAAqB,CACrB,eAAgB,CAChB,cAYF,CAVE,
|
|
1
|
+
{"version":3,"sources":["breadcrumbs.pcss"],"names":[],"mappings":"AAAA,iBACE,oBAAqB,CACrB,eAAgB,CAChB,cAYF,CAVE,uBACE,oBAAqB,CACrB,WAAa,CAEb,qBAAwB,CACxB,UAAW,CAEX,2DAA6D,CAC7D,2CACF,CAKA,8FACE,YACF,CAIF,4BACE,4BAA6B,CAC7B,sCAAgC,CAAhC,8BAAgC,CAChC,wBACF","file":"breadcrumbs.css","sourcesContent":[".breadcrumb-item {\n display: inline-block;\n list-style: none;\n max-width: 100%;\n\n &::after {\n display: inline-block;\n height: 0.8em;\n /* stylelint-disable-next-line primer/spacing */\n margin: 0 0.15em 0 0.5em;\n content: '';\n /* stylelint-disable-next-line primer/borders */\n border-right: 0.1em solid var(--borderColor-neutral-emphasis);\n transform: rotate(15deg) translateY(0.0625em);\n }\n}\n\n.breadcrumb-item-selected,\n.breadcrumb-item[aria-current]:not([aria-current='false']) {\n &::after {\n content: none;\n }\n}\n\n/* stylelint-disable-next-line selector-max-type */\n.breadcrumb-item-selected a {\n color: var(--fgColor-default);\n text-decoration: none !important;\n cursor: default !important;\n}"]}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
:root{--duration-fast:80ms;--easing-easeInOut:cubic-bezier(0.65,0,0.35,1)}.Button{
|
|
1
|
+
:root{--duration-fast:80ms;--easing-easeInOut:cubic-bezier(0.65,0,0.35,1)}.Button{position:relative;display:inline-flex;min-width:max-content;height:var(--control-medium-size);padding:0 var(--control-medium-paddingInline-normal);font-size:var(--text-body-size-medium);font-weight:var(--base-text-weight-medium);color:var(--button-default-fgColor-rest);text-align:center;cursor:pointer;flex-direction:row;-webkit-user-select:none;user-select:none;background-color:initial;border:var(--borderWidth-thin) solid;border-color:#0000;border-radius:var(--borderRadius-medium);transition:var(--duration-fast) var(--easing-easeInOut);transition-property:color,fill,background-color,border-color;justify-content:space-between;align-items:center;gap:var(--base-size-4)}@media (pointer:coarse){:is(.Button:before){position:absolute;top:50%;left:50%;width:100%;height:100%;min-height:48px;content:"";transform:translateX(-50%) translateY(-50%);min-width:48px}}.Button:hover{transition-duration:var(--duration-fast)}.Button:active{transition:none}.Button:disabled,.Button[aria-disabled=true]{cursor:not-allowed;box-shadow:none}.Button.Button--iconOnly{color:var(--fgColor-muted)}:is(a.Button,summary.Button):hover{-webkit-text-decoration:none;text-decoration:none}.Button-content{flex:1 0 auto;display:grid;grid-template-areas:"leadingVisual text trailingVisual";grid-template-columns:min-content minmax(0,auto) min-content;align-items:center;place-content:center}.Button-content>:not(:last-child){margin-right:var(--control-medium-gap)}.Button-content--alignStart{justify-content:start}.Button-visual{display:flex;pointer-events:none}.Button-visual .Counter{color:inherit;background-color:var(--buttonCounter-default-bgColor-rest)}.Button-label{line-height:var(--text-body-lineHeight-medium);white-space:nowrap;grid-area:text}.Button-leadingVisual{grid-area:leadingVisual}.Button-leadingVisual svg{fill:currentcolor}.Button-trailingVisual{grid-area:trailingVisual}.Button-trailingAction{margin-right:calc(var(--base-size-4)*-1)}.Button--small{min-width:var(--control-small-size);height:var(--control-small-size);padding:0 var(--control-small-paddingInline-condensed);font-size:var(--text-body-size-small);gap:var(--control-small-gap)}.Button--small .Button-label{line-height:var(--text-body-lineHeight-small)}:is(.Button--small .Button-content)>:not(:last-child){margin-right:var(--control-small-gap)}.Button--large{height:var(--control-large-size);padding:0 var(--control-large-paddingInline-spacious);gap:var(--control-large-gap)}.Button--large .Button-label{line-height:var(--text-body-lineHeight-large)}:is(.Button--large .Button-content)>:not(:last-child){margin-right:var(--control-large-gap)}.Button--fullWidth{width:100%}.Button--labelWrap{min-width:fit-content;height:unset;min-height:var(--control-medium-size)}.Button--labelWrap .Button-content{flex:1 1 auto;align-self:stretch;padding-block:calc(var(--control-medium-paddingBlock) - var(--base-size-2))}.Button--labelWrap .Button-label{white-space:unset}.Button--labelWrap.Button--small{height:unset;min-height:var(--control-small-size)}.Button--labelWrap.Button--small .Button-content{padding-block:calc(var(--control-small-paddingBlock) - var(--base-size-2))}.Button--labelWrap.Button--large{height:unset;min-height:var(--control-large-size);padding-inline:var(--control-large-paddingInline-spacious)}.Button--labelWrap.Button--large .Button-content{padding-block:calc(var(--control-large-paddingBlock) - var(--base-size-2))}.Button--primary{color:var(--button-primary-fgColor-rest);fill:var(--button-primary-iconColor-rest);background-color:var(--button-primary-bgColor-rest);border-color:var(--button-primary-borderColor-rest);box-shadow:var(--shadow-resting-small,var(--color-btn-primary-shadow))}.Button--primary.Button--iconOnly{color:var(--button-primary-iconColor-rest)}.Button--primary:hover:not(:disabled,.Button--inactive){background-color:var(--button-primary-bgColor-hover);border-color:var(--button-primary-borderColor-hover)}.Button--primary:focus{outline:2px solid var(--focus-outlineColor);outline-offset:-2px;box-shadow:inset 0 0 0 3px var(--fgColor-onEmphasis)}.Button--primary:focus:not(:focus-visible){outline:1px solid #0000;box-shadow:none}.Button--primary:focus-visible{outline:2px solid var(--focus-outlineColor);outline-offset:-2px;box-shadow:inset 0 0 0 3px var(--fgColor-onEmphasis)}.Button--primary:active:not(:disabled),.Button--primary[aria-pressed=true]{background-color:var(--button-primary-bgColor-active);box-shadow:var(--button-primary-shadow-selected)}.Button--primary:disabled,.Button--primary[aria-disabled=true]{color:var(--button-primary-fgColor-disabled);fill:var(--button-primary-fgColor-disabled);background-color:var(--button-primary-bgColor-disabled);border-color:var(--button-primary-borderColor-disabled)}.Button--primary .Counter{color:inherit;background-color:var(--buttonCounter-primary-bgColor-rest)}.Button--secondary{color:var(--button-default-fgColor-rest);fill:var(--fgColor-muted);background-color:var(--button-default-bgColor-rest);border-color:var(--button-default-borderColor-rest);box-shadow:var(--button-default-shadow-resting),var(--button-default-shadow-inset)}.Button--secondary:hover:not(:disabled,.Button--inactive){background-color:var(--button-default-bgColor-hover);border-color:var(--button-default-borderColor-hover)}.Button--secondary:active:not(:disabled){background-color:var(--button-default-bgColor-active);border-color:var(--button-default-borderColor-active)}.Button--secondary[aria-pressed=true]{background-color:var(--button-default-bgColor-selected);box-shadow:var(--shadow-inset)}.Button--secondary:disabled,.Button--secondary[aria-disabled=true]{color:var(--control-fgColor-disabled);fill:var(--control-fgColor-disabled);background-color:var(--button-default-bgColor-disabled);border-color:var(--button-default-borderColor-disabled)}.Button--invisible{color:var(--button-invisible-fgColor-rest)}.Button--invisible.Button--iconOnly{color:var(--button-invisible-iconColor-rest,var(--color-fg-muted))}.Button--invisible:hover:not(:disabled,.Button--inactive){background-color:var(--control-transparent-bgColor-hover,var(--color-action-list-item-default-hover-bg))}.Button--invisible:active:not(:disabled),.Button--invisible[aria-pressed=true]{background-color:var(--button-invisible-bgColor-active)}.Button--invisible:disabled,.Button--invisible[aria-disabled=true]{color:var(--button-invisible-fgColor-disabled);fill:var(--button-invisible-fgColor-disabled);background-color:var(--button-invisible-bgColor-disabled);border-color:var(--button-invisible-borderColor-disabled)}.Button--invisible.Button--invisible-noVisuals .Button-label{color:var(--button-invisible-fgColor-rest)}.Button--invisible .Button-visual{color:var(--button-invisible-iconColor-rest,var(--color-fg-muted))}:is(.Button--invisible .Button-visual) .Counter{color:var(--fgColor-default)}.Button--link{display:inline-block;min-width:fit-content;height:unset;padding:0;font-size:inherit;color:var(--fgColor-link);fill:var(--fgColor-link);border:none}.Button--link:hover:not(:disabled,.Button--inactive){-webkit-text-decoration:underline;text-decoration:underline}.Button--link:focus,.Button--link:focus-visible{outline-offset:2px}.Button--link:disabled,.Button--link[aria-disabled=true]{color:var(--control-fgColor-disabled);fill:var(--control-fgColor-disabled);background-color:initial;border-color:#0000}.Button--link .Button-label{white-space:unset}.Button--danger{color:var(--button-danger-fgColor-rest);fill:var(--button-danger-iconColor-rest);background-color:var(--button-danger-bgColor-rest);border-color:var(--button-danger-borderColor-rest);box-shadow:var(--button-default-shadow-resting),var(--button-default-shadow-inset)}.Button--danger.Button--iconOnly{color:var(--button-danger-iconColor-rest)}.Button--danger:hover:not(:disabled,.Button--inactive){color:var(--button-danger-fgColor-hover);fill:var(--button-danger-fgColor-hover);background-color:var(--button-danger-bgColor-hover);border-color:var(--button-danger-borderColor-hover);box-shadow:var(--shadow-resting-small)}.Button--danger:hover:not(:disabled,.Button--inactive) .Counter{color:var(--buttonCounter-danger-fgColor-hover);background-color:var(--buttonCounter-danger-bgColor-hover)}.Button--danger:active:not(:disabled),.Button--danger[aria-pressed=true]{color:var(--button-danger-fgColor-active);fill:var(--button-danger-fgColor-active);background-color:var(--button-danger-bgColor-active);border-color:var(--button-danger-borderColor-active);box-shadow:var(--button-danger-shadow-selected)}.Button--danger:disabled,.Button--danger[aria-disabled=true]{color:var(--button-danger-fgColor-disabled);fill:var(--button-danger-fgColor-disabled);background-color:var(--button-danger-bgColor-disabled);border-color:var(--button-default-borderColor-disabled)}:is(.Button--danger:disabled,.Button--danger[aria-disabled=true]) .Counter{color:var(--buttonCounter-danger-fgColor-disabled);background-color:var(--buttonCounter-danger-bgColor-disabled)}.Button--danger .Counter{color:var(--buttonCounter-danger-fgColor-rest);background-color:var(--buttonCounter-danger-bgColor-rest)}.Button--iconOnly{display:inline-grid;width:var(--control-medium-size);padding:unset;place-content:center}.Button--iconOnly.Button--small{width:var(--control-small-size)}.Button--iconOnly.Button--large{width:var(--control-large-size)}.Button--inactive:not([aria-disabled=true],:disabled){color:var(--button-inactive-fgColor);cursor:default;background-color:var(--button-inactive-bgColor);border:0}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["button.pcss","<no source>","../../../../lib/postcss_mixins/focusOutlineOnEmphasis.pcss"],"names":[],"mappings":"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","file":"button.css","sourcesContent":["/* stylelint-disable selector-no-qualifying-type */\n/* stylelint-disable selector-max-type */\n/* stylelint-disable primer/spacing */\n\n/* CSS for Button */\n\n/* temporary, pre primitives release */\n:root {\n --duration-fast: 80ms;\n --easing-easeInOut: cubic-bezier(0.65, 0, 0.35, 1);\n}\n\n/* base button */\n.Button {\n position: relative;\n display: inline-flex;\n min-width: max-content;\n height: var(--control-medium-size);\n padding: 0 var(--control-medium-paddingInline-normal);\n font-size: var(--text-body-size-medium);\n font-weight: var(--base-text-weight-medium);\n color: var(--button-default-fgColor-rest);\n text-align: center;\n cursor: pointer;\n flex-direction: row;\n user-select: none;\n background-color: transparent;\n border: var(--borderWidth-thin) solid;\n border-color: transparent;\n border-radius: var(--borderRadius-medium);\n transition: var(--duration-fast) var(--easing-easeInOut);\n transition-property: color, fill, background-color, border-color;\n justify-content: space-between;\n align-items: center;\n gap: var(--base-size-4);\n\n /* mobile friendly sizing */\n @media (pointer: coarse) {\n &::before {\n @mixin minTouchTarget 48px, 48px;\n }\n }\n\n /* base states */\n\n &:hover {\n transition-duration: var(--duration-fast);\n }\n\n &:active {\n transition: none;\n }\n\n &:disabled,\n &[aria-disabled='true'] {\n cursor: not-allowed;\n box-shadow: none;\n }\n\n &.Button--iconOnly {\n color: var(--fgColor-muted);\n }\n}\n\na.Button,\nsummary.Button {\n &:hover {\n text-decoration: none;\n }\n}\n\n/* wrap grid content to allow trailingAction to lock-right */\n.Button-content {\n flex: 1 0 auto;\n display: grid;\n grid-template-areas: 'leadingVisual text trailingVisual';\n grid-template-columns: min-content minmax(0, auto) min-content;\n align-items: center;\n place-content: center;\n\n /* padding-bottom: 1px; optical alignment for firefox */\n\n & > :not(:last-child) {\n margin-right: var(--control-medium-gap);\n }\n}\n\n/* center child elements for fullWidth */\n.Button-content--alignStart {\n justify-content: start;\n}\n\n/* button child elements */\n\n/* align svg */\n.Button-visual {\n display: flex;\n pointer-events: none; /* allow click handler to work, avoiding visuals */\n\n & .Counter {\n color: inherit;\n background-color: var(--buttonCounter-default-bgColor-rest);\n }\n}\n\n.Button-label {\n line-height: var(--text-body-lineHeight-medium);\n white-space: nowrap;\n grid-area: text;\n}\n\n.Button-leadingVisual {\n grid-area: leadingVisual;\n}\n\n.Button-leadingVisual svg {\n fill: currentcolor;\n}\n\n.Button-trailingVisual {\n grid-area: trailingVisual;\n}\n\n.Button-trailingAction {\n margin-right: calc(var(--base-size-4) * -1);\n}\n\n/* sizes */\n\n.Button--small {\n min-width: var(--control-small-size);\n height: var(--control-small-size);\n padding: 0 var(--control-small-paddingInline-condensed);\n font-size: var(--text-body-size-small);\n gap: var(--control-small-gap);\n\n & .Button-label {\n line-height: var(--text-body-lineHeight-small);\n }\n\n & .Button-content {\n & > :not(:last-child) {\n margin-right: var(--control-small-gap);\n }\n }\n}\n\n.Button--large {\n height: var(--control-large-size);\n padding: 0 var(--control-large-paddingInline-spacious);\n gap: var(--control-large-gap);\n\n & .Button-label {\n line-height: var(--text-body-lineHeight-large);\n }\n\n & .Button-content {\n & > :not(:last-child) {\n margin-right: var(--control-large-gap);\n }\n }\n}\n\n.Button--fullWidth {\n width: 100%;\n}\n\n/* allow button label text to wrap */\n\n.Button--labelWrap {\n min-width: fit-content;\n height: unset;\n min-height: var(--control-medium-size);\n\n & .Button-content {\n flex: 1 1 auto;\n align-self: stretch;\n padding-block: calc(var(--control-medium-paddingBlock) - var(--base-size-2));\n }\n\n & .Button-label {\n white-space: unset;\n }\n\n &.Button--small {\n height: unset;\n min-height: var(--control-small-size);\n\n & .Button-content {\n padding-block: calc(var(--control-small-paddingBlock) - var(--base-size-2));\n }\n }\n\n &.Button--large {\n height: unset;\n min-height: var(--control-large-size);\n padding-inline: var(--control-large-paddingInline-spacious);\n\n & .Button-content {\n padding-block: calc(var(--control-large-paddingBlock) - var(--base-size-2));\n }\n }\n}\n\n/* variants */\n\n/* primary */\n.Button--primary {\n color: var(--button-primary-fgColor-rest);\n fill: var(--button-primary-iconColor-rest);\n background-color: var(--button-primary-bgColor-rest);\n border-color: var(--button-primary-borderColor-rest);\n box-shadow: var(--shadow-resting-small, var(--color-btn-primary-shadow));\n\n &.Button--iconOnly {\n color: var(--button-primary-iconColor-rest);\n }\n\n &:hover:not(:disabled, .Button--inactive) {\n background-color: var(--button-primary-bgColor-hover);\n border-color: var(--button-primary-borderColor-hover);\n }\n\n /* fallback :focus state */\n &:focus {\n @mixin focusOutlineOnEmphasis;\n\n /* remove fallback :focus if :focus-visible is supported */\n &:not(:focus-visible) {\n outline: solid 1px transparent;\n box-shadow: none;\n }\n }\n\n /* default focus state */\n &:focus-visible {\n @mixin focusOutlineOnEmphasis;\n }\n\n &:active:not(:disabled),\n &[aria-pressed='true'] {\n background-color: var(--button-primary-bgColor-active);\n box-shadow: var(--button-primary-shadow-selected);\n }\n\n &:disabled,\n &[aria-disabled='true'] {\n color: var(--button-primary-fgColor-disabled);\n fill: var(--button-primary-fgColor-disabled);\n background-color: var(--button-primary-bgColor-disabled);\n border-color: var(--button-primary-borderColor-disabled);\n }\n\n & .Counter {\n color: inherit;\n background-color: var(--buttonCounter-primary-bgColor-rest);\n }\n}\n\n/* default (secondary) */\n.Button--secondary {\n color: var(--button-default-fgColor-rest);\n fill: var(--fgColor-muted); /* help this */\n background-color: var(--button-default-bgColor-rest);\n border-color: var(--button-default-borderColor-rest);\n box-shadow: var(--button-default-shadow-resting), var(--button-default-shadow-inset);\n\n &:hover:not(:disabled, .Button--inactive) {\n background-color: var(--button-default-bgColor-hover);\n border-color: var(--button-default-borderColor-hover);\n }\n\n &:active:not(:disabled) {\n background-color: var(--button-default-bgColor-active);\n border-color: var(--button-default-borderColor-active);\n }\n\n &[aria-pressed='true'] {\n background-color: var(--button-default-bgColor-selected);\n box-shadow: var(--shadow-inset);\n }\n\n &:disabled,\n &[aria-disabled='true'] {\n color: var(--control-fgColor-disabled);\n fill: var(--control-fgColor-disabled);\n background-color: var(--button-default-bgColor-disabled);\n border-color: var(--button-default-borderColor-disabled);\n }\n}\n\n.Button--invisible {\n color: var(--button-invisible-fgColor-rest);\n\n &.Button--iconOnly {\n color: var(--button-invisible-iconColor-rest, var(--color-fg-muted));\n }\n\n &:hover:not(:disabled, .Button--inactive) {\n background-color: var(--control-transparent-bgColor-hover, var(--color-action-list-item-default-hover-bg));\n }\n\n &[aria-pressed='true'],\n &:active:not(:disabled) {\n background-color: var(--button-invisible-bgColor-active);\n }\n\n &:disabled,\n &[aria-disabled='true'] {\n color: var(--button-invisible-fgColor-disabled);\n fill: var(--button-invisible-fgColor-disabled);\n background-color: var(--button-invisible-bgColor-disabled);\n border-color: var(--button-invisible-borderColor-disabled);\n }\n\n /* if button has no visuals, use link blue for text */\n &.Button--invisible-noVisuals .Button-label {\n color: var(--button-invisible-fgColor-rest);\n }\n\n & .Button-visual {\n color: var(--button-invisible-iconColor-rest, var(--color-fg-muted));\n\n & .Counter {\n color: var(--fgColor-default);\n }\n }\n}\n\n.Button--link {\n display: inline-block;\n min-width: fit-content;\n height: unset;\n padding: 0;\n font-size: inherit;\n color: var(--fgColor-link);\n fill: var(--fgColor-link);\n border: none;\n\n &:hover:not(:disabled, .Button--inactive) {\n text-decoration: underline;\n }\n\n &:focus-visible,\n &:focus {\n outline-offset: 2px;\n }\n\n &:disabled,\n &[aria-disabled='true'] {\n color: var(--control-fgColor-disabled);\n fill: var(--control-fgColor-disabled);\n background-color: transparent;\n border-color: transparent;\n }\n\n & .Button-label {\n white-space: unset;\n }\n}\n\n/* danger */\n.Button--danger {\n color: var(--button-danger-fgColor-rest);\n fill: var(--button-danger-iconColor-rest);\n background-color: var(--button-danger-bgColor-rest);\n border-color: var(--button-danger-borderColor-rest);\n box-shadow: var(--button-default-shadow-resting), var(--button-default-shadow-inset);\n\n &.Button--iconOnly {\n color: var(--button-danger-iconColor-rest);\n }\n\n &:hover:not(:disabled, .Button--inactive) {\n color: var(--button-danger-fgColor-hover);\n fill: var(--button-danger-fgColor-hover);\n background-color: var(--button-danger-bgColor-hover);\n border-color: var(--button-danger-borderColor-hover);\n box-shadow: var(--shadow-resting-small);\n\n & .Counter {\n color: var(--buttonCounter-danger-fgColor-hover);\n background-color: var(--buttonCounter-danger-bgColor-hover);\n }\n }\n\n &:active:not(:disabled),\n &[aria-pressed='true'] {\n color: var(--button-danger-fgColor-active);\n fill: var(--button-danger-fgColor-active);\n background-color: var(--button-danger-bgColor-active);\n border-color: var(--button-danger-borderColor-active);\n box-shadow: var(--button-danger-shadow-selected);\n }\n\n &:disabled,\n &[aria-disabled='true'] {\n color: var(--button-danger-fgColor-disabled);\n fill: var(--button-danger-fgColor-disabled);\n background-color: var(--button-danger-bgColor-disabled);\n border-color: var(--button-default-borderColor-disabled);\n\n & .Counter {\n color: var(--buttonCounter-danger-fgColor-disabled);\n background-color: var(--buttonCounter-danger-bgColor-disabled);\n }\n }\n\n & .Counter {\n color: var(--buttonCounter-danger-fgColor-rest);\n background-color: var(--buttonCounter-danger-bgColor-rest);\n }\n}\n\n.Button--iconOnly {\n display: inline-grid;\n width: var(--control-medium-size);\n padding: unset;\n place-content: center;\n\n &.Button--small {\n width: var(--control-small-size);\n }\n\n &.Button--large {\n width: var(--control-large-size);\n }\n}\n\n/* `disabled` takes precedence over `inactive` */\n.Button--inactive:not([aria-disabled='true'], :disabled) {\n color: var(--button-inactive-fgColor);\n cursor: default;\n background-color: var(--button-inactive-bgColor);\n border: 0;\n}\n",null,"/* outline with fg box-shadow for buttons */\n@define-mixin focusOutlineOnEmphasis $outlineOffset: -2px, $outlineColor: var(--focus-outlineColor) {\n outline: 2px solid $outlineColor;\n outline-offset: $outlineOffset;\n box-shadow: inset 0 0 0 3px var(--fgColor-onEmphasis);\n}\n"]}
|
|
1
|
+
{"version":3,"sources":["button.pcss","<no source>","../../../../lib/postcss_mixins/focusOutlineOnEmphasis.pcss"],"names":[],"mappings":"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","file":"button.css","sourcesContent":["/* stylelint-disable selector-no-qualifying-type */\n/* stylelint-disable selector-max-type */\n/* stylelint-disable primer/spacing */\n\n/* CSS for Button */\n\n/* temporary, pre primitives release */\n:root {\n --duration-fast: 80ms;\n --easing-easeInOut: cubic-bezier(0.65, 0, 0.35, 1);\n}\n\n/* base button */\n.Button {\n position: relative;\n display: inline-flex;\n min-width: max-content;\n height: var(--control-medium-size);\n padding: 0 var(--control-medium-paddingInline-normal);\n font-size: var(--text-body-size-medium);\n font-weight: var(--base-text-weight-medium);\n color: var(--button-default-fgColor-rest);\n text-align: center;\n cursor: pointer;\n flex-direction: row;\n user-select: none;\n background-color: transparent;\n border: var(--borderWidth-thin) solid;\n border-color: transparent;\n border-radius: var(--borderRadius-medium);\n transition: var(--duration-fast) var(--easing-easeInOut);\n transition-property: color, fill, background-color, border-color;\n justify-content: space-between;\n align-items: center;\n gap: var(--base-size-4);\n\n /* mobile friendly sizing */\n @media (pointer: coarse) {\n &::before {\n @mixin minTouchTarget 48px, 48px;\n }\n }\n\n /* base states */\n\n &:hover {\n transition-duration: var(--duration-fast);\n }\n\n &:active {\n transition: none;\n }\n\n &:disabled,\n &[aria-disabled='true'] {\n cursor: not-allowed;\n box-shadow: none;\n }\n\n &.Button--iconOnly {\n color: var(--fgColor-muted);\n }\n}\n\na.Button,\nsummary.Button {\n &:hover {\n text-decoration: none;\n }\n}\n\n/* wrap grid content to allow trailingAction to lock-right */\n.Button-content {\n flex: 1 0 auto;\n display: grid;\n grid-template-areas: 'leadingVisual text trailingVisual';\n grid-template-columns: min-content minmax(0, auto) min-content;\n align-items: center;\n place-content: center;\n\n /* padding-bottom: 1px; optical alignment for firefox */\n\n & > :not(:last-child) {\n margin-right: var(--control-medium-gap);\n }\n}\n\n/* center child elements for fullWidth */\n.Button-content--alignStart {\n justify-content: start;\n}\n\n/* button child elements */\n\n/* align svg */\n.Button-visual {\n display: flex;\n pointer-events: none; /* allow click handler to work, avoiding visuals */\n\n & .Counter {\n color: inherit;\n background-color: var(--buttonCounter-default-bgColor-rest);\n }\n}\n\n.Button-label {\n line-height: var(--text-body-lineHeight-medium);\n white-space: nowrap;\n grid-area: text;\n}\n\n.Button-leadingVisual {\n grid-area: leadingVisual;\n}\n\n.Button-leadingVisual svg {\n fill: currentcolor;\n}\n\n.Button-trailingVisual {\n grid-area: trailingVisual;\n}\n\n.Button-trailingAction {\n margin-right: calc(var(--base-size-4) * -1);\n}\n\n/* sizes */\n\n.Button--small {\n min-width: var(--control-small-size);\n height: var(--control-small-size);\n padding: 0 var(--control-small-paddingInline-condensed);\n font-size: var(--text-body-size-small);\n gap: var(--control-small-gap);\n\n & .Button-label {\n line-height: var(--text-body-lineHeight-small);\n }\n\n & .Button-content {\n & > :not(:last-child) {\n margin-right: var(--control-small-gap);\n }\n }\n}\n\n.Button--large {\n height: var(--control-large-size);\n padding: 0 var(--control-large-paddingInline-spacious);\n gap: var(--control-large-gap);\n\n & .Button-label {\n line-height: var(--text-body-lineHeight-large);\n }\n\n & .Button-content {\n & > :not(:last-child) {\n margin-right: var(--control-large-gap);\n }\n }\n}\n\n.Button--fullWidth {\n width: 100%;\n}\n\n/* allow button label text to wrap */\n\n.Button--labelWrap {\n min-width: fit-content;\n height: unset;\n min-height: var(--control-medium-size);\n\n & .Button-content {\n flex: 1 1 auto;\n align-self: stretch;\n padding-block: calc(var(--control-medium-paddingBlock) - var(--base-size-2));\n }\n\n & .Button-label {\n white-space: unset;\n }\n\n &.Button--small {\n height: unset;\n min-height: var(--control-small-size);\n\n & .Button-content {\n padding-block: calc(var(--control-small-paddingBlock) - var(--base-size-2));\n }\n }\n\n &.Button--large {\n height: unset;\n min-height: var(--control-large-size);\n padding-inline: var(--control-large-paddingInline-spacious);\n\n & .Button-content {\n padding-block: calc(var(--control-large-paddingBlock) - var(--base-size-2));\n }\n }\n}\n\n/* variants */\n\n/* primary */\n.Button--primary {\n color: var(--button-primary-fgColor-rest);\n fill: var(--button-primary-iconColor-rest);\n background-color: var(--button-primary-bgColor-rest);\n border-color: var(--button-primary-borderColor-rest);\n box-shadow: var(--shadow-resting-small, var(--color-btn-primary-shadow));\n\n &.Button--iconOnly {\n color: var(--button-primary-iconColor-rest);\n }\n\n &:hover:not(:disabled, .Button--inactive) {\n background-color: var(--button-primary-bgColor-hover);\n border-color: var(--button-primary-borderColor-hover);\n }\n\n /* fallback :focus state */\n &:focus {\n @mixin focusOutlineOnEmphasis;\n\n /* remove fallback :focus if :focus-visible is supported */\n &:not(:focus-visible) {\n outline: solid 1px transparent;\n box-shadow: none;\n }\n }\n\n /* default focus state */\n &:focus-visible {\n @mixin focusOutlineOnEmphasis;\n }\n\n &:active:not(:disabled),\n &[aria-pressed='true'] {\n background-color: var(--button-primary-bgColor-active);\n box-shadow: var(--button-primary-shadow-selected);\n }\n\n &:disabled,\n &[aria-disabled='true'] {\n color: var(--button-primary-fgColor-disabled);\n fill: var(--button-primary-fgColor-disabled);\n background-color: var(--button-primary-bgColor-disabled);\n border-color: var(--button-primary-borderColor-disabled);\n }\n\n & .Counter {\n color: inherit;\n background-color: var(--buttonCounter-primary-bgColor-rest);\n }\n}\n\n/* default (secondary) */\n.Button--secondary {\n color: var(--button-default-fgColor-rest);\n fill: var(--fgColor-muted); /* help this */\n background-color: var(--button-default-bgColor-rest);\n border-color: var(--button-default-borderColor-rest);\n box-shadow: var(--button-default-shadow-resting), var(--button-default-shadow-inset);\n\n &:hover:not(:disabled, .Button--inactive) {\n background-color: var(--button-default-bgColor-hover);\n border-color: var(--button-default-borderColor-hover);\n }\n\n &:active:not(:disabled) {\n background-color: var(--button-default-bgColor-active);\n border-color: var(--button-default-borderColor-active);\n }\n\n &[aria-pressed='true'] {\n background-color: var(--button-default-bgColor-selected);\n box-shadow: var(--shadow-inset);\n }\n\n &:disabled,\n &[aria-disabled='true'] {\n color: var(--control-fgColor-disabled);\n fill: var(--control-fgColor-disabled);\n background-color: var(--button-default-bgColor-disabled);\n border-color: var(--button-default-borderColor-disabled);\n }\n}\n\n.Button--invisible {\n color: var(--button-invisible-fgColor-rest);\n\n &.Button--iconOnly {\n color: var(--button-invisible-iconColor-rest, var(--color-fg-muted));\n }\n\n &:hover:not(:disabled, .Button--inactive) {\n background-color: var(--control-transparent-bgColor-hover, var(--color-action-list-item-default-hover-bg));\n }\n\n &[aria-pressed='true'],\n &:active:not(:disabled) {\n background-color: var(--button-invisible-bgColor-active);\n }\n\n &:disabled,\n &[aria-disabled='true'] {\n color: var(--button-invisible-fgColor-disabled);\n fill: var(--button-invisible-fgColor-disabled);\n background-color: var(--button-invisible-bgColor-disabled);\n border-color: var(--button-invisible-borderColor-disabled);\n }\n\n /* if button has no visuals, use link blue for text */\n &.Button--invisible-noVisuals .Button-label {\n color: var(--button-invisible-fgColor-rest);\n }\n\n & .Button-visual {\n color: var(--button-invisible-iconColor-rest, var(--color-fg-muted));\n\n & .Counter {\n color: var(--fgColor-default);\n }\n }\n}\n\n.Button--link {\n display: inline-block;\n min-width: fit-content;\n height: unset;\n padding: 0;\n font-size: inherit;\n color: var(--fgColor-link);\n fill: var(--fgColor-link);\n border: none;\n\n &:hover:not(:disabled, .Button--inactive) {\n text-decoration: underline;\n }\n\n &:focus-visible,\n &:focus {\n outline-offset: 2px;\n }\n\n &:disabled,\n &[aria-disabled='true'] {\n color: var(--control-fgColor-disabled);\n fill: var(--control-fgColor-disabled);\n background-color: transparent;\n border-color: transparent;\n }\n\n & .Button-label {\n white-space: unset;\n }\n}\n\n/* danger */\n.Button--danger {\n color: var(--button-danger-fgColor-rest);\n fill: var(--button-danger-iconColor-rest);\n background-color: var(--button-danger-bgColor-rest);\n border-color: var(--button-danger-borderColor-rest);\n box-shadow: var(--button-default-shadow-resting), var(--button-default-shadow-inset);\n\n &.Button--iconOnly {\n color: var(--button-danger-iconColor-rest);\n }\n\n &:hover:not(:disabled, .Button--inactive) {\n color: var(--button-danger-fgColor-hover);\n fill: var(--button-danger-fgColor-hover);\n background-color: var(--button-danger-bgColor-hover);\n border-color: var(--button-danger-borderColor-hover);\n box-shadow: var(--shadow-resting-small);\n\n & .Counter {\n color: var(--buttonCounter-danger-fgColor-hover);\n background-color: var(--buttonCounter-danger-bgColor-hover);\n }\n }\n\n &:active:not(:disabled),\n &[aria-pressed='true'] {\n color: var(--button-danger-fgColor-active);\n fill: var(--button-danger-fgColor-active);\n background-color: var(--button-danger-bgColor-active);\n border-color: var(--button-danger-borderColor-active);\n box-shadow: var(--button-danger-shadow-selected);\n }\n\n &:disabled,\n &[aria-disabled='true'] {\n color: var(--button-danger-fgColor-disabled);\n fill: var(--button-danger-fgColor-disabled);\n background-color: var(--button-danger-bgColor-disabled);\n border-color: var(--button-default-borderColor-disabled);\n\n & .Counter {\n color: var(--buttonCounter-danger-fgColor-disabled);\n background-color: var(--buttonCounter-danger-bgColor-disabled);\n }\n }\n\n & .Counter {\n color: var(--buttonCounter-danger-fgColor-rest);\n background-color: var(--buttonCounter-danger-bgColor-rest);\n }\n}\n\n.Button--iconOnly {\n display: inline-grid;\n width: var(--control-medium-size);\n padding: unset;\n place-content: center;\n\n &.Button--small {\n width: var(--control-small-size);\n }\n\n &.Button--large {\n width: var(--control-large-size);\n }\n}\n\n/* `disabled` takes precedence over `inactive` */\n.Button--inactive:not([aria-disabled='true'], :disabled) {\n color: var(--button-inactive-fgColor);\n cursor: default;\n background-color: var(--button-inactive-bgColor);\n border: 0;\n}\n",null,"/* outline with fg box-shadow for buttons */\n@define-mixin focusOutlineOnEmphasis $outlineOffset: -2px, $outlineColor: var(--focus-outlineColor) {\n outline: 2px solid $outlineColor;\n outline-offset: $outlineOffset;\n box-shadow: inset 0 0 0 3px var(--fgColor-onEmphasis);\n}\n"]}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
.ButtonGroup{display:inline-flex}.ButtonGroup .Button{
|
|
1
|
+
.ButtonGroup{display:inline-flex}.ButtonGroup .Button{margin-inline-end:-1px;position:relative;border-radius:0}:is(.ButtonGroup .Button):active,:is(.ButtonGroup .Button):focus,:is(.ButtonGroup .Button):hover{z-index:1}.ButtonGroup>:first-child .Button{border-top-left-radius:var(--borderRadius-medium);border-bottom-left-radius:var(--borderRadius-medium)}.ButtonGroup>:last-child .Button{border-top-right-radius:var(--borderRadius-medium);border-bottom-right-radius:var(--borderRadius-medium)}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["button_group.pcss"],"names":[],"mappings":"AAAA,aACE,mBAwBF,CAtBE,
|
|
1
|
+
{"version":3,"sources":["button_group.pcss"],"names":[],"mappings":"AAAA,aACE,mBAwBF,CAtBE,qBAEE,sBAAuB,CACvB,iBAAkB,CAClB,eAOF,CALE,iGAGE,SACF,CAGF,kCACE,iDAAkD,CAClD,oDACF,CAEA,iCACE,kDAAmD,CACnD,qDACF","file":"button_group.css","sourcesContent":[".ButtonGroup {\n display: inline-flex;\n\n & .Button {\n /* stylelint-disable-next-line primer/spacing */\n margin-inline-end: -1px;\n position: relative;\n border-radius: 0;\n\n &:focus,\n &:active,\n &:hover {\n z-index: 1;\n }\n }\n\n & > :first-child .Button {\n border-top-left-radius: var(--borderRadius-medium);\n border-bottom-left-radius: var(--borderRadius-medium);\n }\n\n & > :last-child .Button {\n border-top-right-radius: var(--borderRadius-medium);\n border-bottom-right-radius: var(--borderRadius-medium);\n }\n}\n"]}
|
|
@@ -107,7 +107,7 @@ module Primer
|
|
|
107
107
|
@button = @menu.with_show_button(icon: "triangle-down", **button_arguments)
|
|
108
108
|
end
|
|
109
109
|
|
|
110
|
-
def render_in(view_context, &block)
|
|
110
|
+
def render_in(view_context, **_kwargs, &block)
|
|
111
111
|
super(view_context) do
|
|
112
112
|
block.call(@menu, @button)
|
|
113
113
|
end
|
|
@@ -1 +1 @@
|
|
|
1
|
-
.Counter{
|
|
1
|
+
.Counter{display:inline-block;min-width:var(--base-size-20);padding:0 var(--base-size-6);font-size:var(--text-body-size-small);font-weight:var(--base-text-weight-medium);line-height:calc(var(--base-size-20) - var(--borderWidth-thin)*2);color:var(--fgColor-default);text-align:center;background-color:var(--bgColor-neutral-muted,var(--color-neutral-muted));border:var(--borderWidth-thin) solid var(--counter-borderColor);border-radius:2em}.Counter:empty{display:none}.Counter .octicon{vertical-align:text-top;opacity:.8}.Counter--primary{color:var(--fgColor-onEmphasis);background-color:var(--bgColor-neutral-emphasis)}.Counter--secondary{color:var(--fgColor-muted);background-color:var(--bgColor-neutral-muted)}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["counter.pcss"],"names":[],"mappings":"AAEA,
|
|
1
|
+
{"version":3,"sources":["counter.pcss"],"names":[],"mappings":"AAEA,SACE,oBAAqB,CACrB,6BAA8B,CAC9B,4BAA6B,CAC7B,qCAAsC,CACtC,0CAA2C,CAE3C,iEAAoE,CACpE,4BAA6B,CAC7B,iBAAkB,CAClB,wEAA0E,CAC1E,+DAAgE,CAEhE,iBAWF,CATE,eACE,YACF,CAGA,kBACE,uBAAwB,CACxB,UACF,CAGF,kBACE,+BAAgC,CAChC,gDACF,CAEA,oBACE,0BAA2B,CAC3B,6CACF","file":"counter.css","sourcesContent":["/* Counter */\n\n.Counter {\n display: inline-block;\n min-width: var(--base-size-20); /* makes sure it's a circle with just one digit */\n padding: 0 var(--base-size-6);\n font-size: var(--text-body-size-small);\n font-weight: var(--base-text-weight-medium);\n /* stylelint-disable-next-line primer/typography */\n line-height: calc(var(--base-size-20) - var(--borderWidth-thin) * 2); /* 20px - 2px for the borders */\n color: var(--fgColor-default);\n text-align: center;\n background-color: var(--bgColor-neutral-muted, var(--color-neutral-muted));\n border: var(--borderWidth-thin) solid var(--counter-borderColor);\n /* stylelint-disable-next-line primer/borders */\n border-radius: 2em;\n\n &:empty {\n display: none;\n }\n\n /* Is this selector used? could not find any use of it */\n & .octicon {\n vertical-align: text-top;\n opacity: 0.8;\n }\n}\n\n.Counter--primary {\n color: var(--fgColor-onEmphasis);\n background-color: var(--bgColor-neutral-emphasis);\n}\n\n.Counter--secondary {\n color: var(--fgColor-muted);\n background-color: var(--bgColor-neutral-muted);\n}\n"]}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
.flash:not(.Banner){background-image:linear-gradient(var(--bgColor-accent-muted),var(--bgColor-accent-muted));border-color:var(--borderColor-accent-muted);border-
|
|
1
|
+
.flash:not(.Banner){position:relative;padding:var(--base-size-20) var(--control-medium-paddingInline-spacious);color:var(--fgColor-default);background-image:linear-gradient(var(--bgColor-accent-muted),var(--bgColor-accent-muted));border-color:var(--borderColor-accent-muted);border-style:solid;border-width:var(--borderWidth-thin);border-radius:var(--borderRadius-medium)}.flash:not(.Banner) .octicon{margin-right:var(--base-size-12);color:var(--fgColor-accent)}.flash:not(.Banner) p:last-child{margin-bottom:0}.flash-messages{margin-bottom:var(--stack-gap-spacious)}.flash-close:not(.Banner-close){float:right;margin-top:calc(var(--base-size-4)*-1);text-align:center;cursor:pointer;background:none;border:0;appearance:none}.flash-close:not(.Banner-close):hover{opacity:.7}.flash-close:not(.Banner-close):active{opacity:.5}.flash-close:not(.Banner-close) .octicon{margin-right:0}.flash-action:not(.Banner-actions){float:right;margin-top:-3px;margin-left:var(--stack-gap-spacious);background-clip:padding-box}.flash-action.btn:not(.Banner-actions) .octicon{margin-right:var(--control-small-gap);color:var(--fgColor-muted)}.flash-action.btn-primary:not(.Banner-actions){background-clip:initial}.flash-action.btn-primary:not(.Banner-actions) .octicon{color:inherit}.flash-warn:not(.Banner){color:var(--fgColor-default);background-image:linear-gradient(var(--bgColor-attention-muted),var(--bgColor-attention-muted));border-color:var(--borderColor-attention-muted)}.flash-warn:not(.Banner) .octicon{color:var(--fgColor-attention)}.flash-error:not(.Banner){color:var(--fgColor-default);background-image:linear-gradient(var(--bgColor-danger-muted),var(--bgColor-danger-muted));border-color:var(--borderColor-danger-muted)}.flash-error:not(.Banner) .octicon{color:var(--fgColor-danger)}.flash-success:not(.Banner){color:var(--fgColor-default);background-image:linear-gradient(var(--bgColor-success-muted),var(--bgColor-success-muted));border-color:var(--borderColor-success-muted)}.flash-success:not(.Banner) .octicon{color:var(--fgColor-success)}.flash-full:not(.Banner){margin-top:calc(var(--borderWidth-thin)*-1);border-width:var(--borderWidth-thin) 0;border-radius:0}.flash-banner{position:fixed;top:0;z-index:90;width:100%;border-top:0;border-right:0;border-left:0;border-radius:0}.flash-banner,.flash-full{background-color:var(--bgColor-default)}.warning{padding:.5em;margin-bottom:.8em;font-weight:var(--base-text-weight-semibold);background-color:var(--bgColor-attention-muted)}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["flash.pcss"],"names":[],"mappings":"AAKA,
|
|
1
|
+
{"version":3,"sources":["flash.pcss"],"names":[],"mappings":"AAKA,oBACE,iBAAkB,CAClB,wEAAyE,CAGzE,4BAA6B,CAC7B,yFAA2F,CAC3F,4CAA6C,CAC7C,kBAAmB,CACnB,oCAAqC,CACrC,wCAWF,CATE,6BACE,gCAAiC,CACjC,2BACF,CAGA,iCACE,eACF,CAIF,gBACE,uCACF,CAGA,gCACE,WAAY,CACZ,sCAAyC,CACzC,iBAAkB,CAClB,cAAe,CAGf,eAAgB,CAChB,QAAS,CACT,eAaF,CAXE,sCACE,UACF,CAEA,uCACE,UACF,CAEA,yCACE,cACF,CAIF,mCACE,WAAY,CACZ,eAAgB,CAChB,qCAAsC,CACtC,2BAcF,CAZE,gDACE,qCAAsC,CACtC,0BACF,CAEA,+CACE,uBAKF,CAHE,wDACE,aACF,CAMJ,yBACE,4BAA6B,CAC7B,+FAAiG,CACjG,+CAKF,CAHE,kCACE,8BACF,CAGF,0BACE,4BAA6B,CAC7B,yFAA2F,CAC3F,4CAKF,CAHE,mCACE,2BACF,CAGF,4BACE,4BAA6B,CAC7B,2FAA6F,CAC7F,6CAKF,CAHE,qCACE,4BACF,CAKF,yBACE,2CAA8C,CAC9C,sCAAuC,CACvC,eACF,CAGA,cACE,cAAe,CACf,KAAM,CACN,UAAW,CACX,UAAW,CACX,YAAa,CACb,cAAe,CACf,aAAc,CACd,eACF,CAGA,0BAEE,uCACF,CAGA,SACE,YAAc,CACd,kBAAoB,CACpB,4CAA6C,CAC7C,+CACF","file":"flash.css","sourcesContent":["/* stylelint-disable primer/spacing */\n\n/* flash */\n\n/* Default flash */\n.flash:not(.Banner) {\n position: relative;\n padding: var(--base-size-20) var(--control-medium-paddingInline-spacious);\n\n /* Default color */\n color: var(--fgColor-default);\n background-image: linear-gradient(var(--bgColor-accent-muted), var(--bgColor-accent-muted));\n border-color: var(--borderColor-accent-muted);\n border-style: solid;\n border-width: var(--borderWidth-thin);\n border-radius: var(--borderRadius-medium);\n\n & .octicon {\n margin-right: var(--base-size-12);\n color: var(--fgColor-accent);\n }\n\n /* stylelint-disable-next-line selector-max-type */\n & p:last-child {\n margin-bottom: 0;\n }\n}\n\n/* Contain the flash messages */\n.flash-messages {\n margin-bottom: var(--stack-gap-spacious);\n}\n\n/* Close button */\n.flash-close:not(.Banner-close) {\n float: right;\n margin-top: calc(var(--base-size-4) * -1);\n text-align: center;\n cursor: pointer;\n\n /* Undo `<button>` styles */\n background: none;\n border: 0;\n appearance: none;\n\n &:hover {\n opacity: 0.7;\n }\n\n &:active {\n opacity: 0.5;\n }\n\n & .octicon {\n margin-right: 0;\n }\n}\n\n/* Action button */\n.flash-action:not(.Banner-actions) {\n float: right;\n margin-top: -3px;\n margin-left: var(--stack-gap-spacious);\n background-clip: padding-box;\n\n &.btn .octicon {\n margin-right: var(--control-small-gap);\n color: var(--fgColor-muted);\n }\n\n &.btn-primary {\n background-clip: border-box;\n\n & .octicon {\n color: inherit;\n }\n }\n}\n\n/* Color variations */\n\n.flash-warn:not(.Banner) {\n color: var(--fgColor-default);\n background-image: linear-gradient(var(--bgColor-attention-muted), var(--bgColor-attention-muted));\n border-color: var(--borderColor-attention-muted);\n\n & .octicon {\n color: var(--fgColor-attention);\n }\n}\n\n.flash-error:not(.Banner) {\n color: var(--fgColor-default);\n background-image: linear-gradient(var(--bgColor-danger-muted), var(--bgColor-danger-muted));\n border-color: var(--borderColor-danger-muted);\n\n & .octicon {\n color: var(--fgColor-danger);\n }\n}\n\n.flash-success:not(.Banner) {\n color: var(--fgColor-default);\n background-image: linear-gradient(var(--bgColor-success-muted), var(--bgColor-success-muted));\n border-color: var(--borderColor-success-muted);\n\n & .octicon {\n color: var(--fgColor-success);\n }\n}\n\n/* Layout variations */\n\n.flash-full:not(.Banner) {\n margin-top: calc(var(--borderWidth-thin) * -1);\n border-width: var(--borderWidth-thin) 0;\n border-radius: 0;\n}\n\n/* A banner rendered at the top of the page. */\n.flash-banner {\n position: fixed;\n top: 0;\n z-index: 90;\n width: 100%;\n border-top: 0;\n border-right: 0;\n border-left: 0;\n border-radius: 0;\n}\n\n/* Makes sure the background is opaque to cover any content underneath */\n.flash-full,\n.flash-banner {\n background-color: var(--bgColor-default);\n}\n\n/* FIXME deprecate this */\n.warning {\n padding: 0.5em;\n margin-bottom: 0.8em;\n font-weight: var(--base-text-weight-semibold);\n background-color: var(--bgColor-attention-muted);\n}\n"]}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
.labels{position:relative}.Label,.label{
|
|
1
|
+
.labels{position:relative}.Label,.label{display:inline-block;padding:0 var(--base-size-6);font-size:var(--text-body-size-small);font-weight:var(--base-text-weight-medium);line-height:18px;white-space:nowrap;border:var(--borderWidth-thin) solid var(--borderColor-default);border-radius:var(--borderRadius-full)}:is(.label,.Label):hover{-webkit-text-decoration:none;text-decoration:none}.Label--large{padding:0 var(--base-size-8);line-height:22px}.Label--inline{display:inline;padding:.12em .5em;font-size:85%}.Label--primary{color:var(--fgColor-default);border-color:var(--borderColor-neutral-emphasis)}.Label--secondary{color:var(--fgColor-muted);border-color:var(--borderColor-default)}.Label--accent,.Label--info{color:var(--fgColor-accent);border-color:var(--borderColor-accent-emphasis)}.Label--success{color:var(--fgColor-success);border-color:var(--borderColor-success-emphasis)}.Label--attention,.Label--warning{color:var(--fgColor-attention);border-color:var(--borderColor-attention-emphasis)}.Label--severe{color:var(--fgColor-severe);border-color:var(--borderColor-severe-emphasis)}.Label--danger{color:var(--fgColor-danger);border-color:var(--borderColor-danger-emphasis)}.Label--open{color:var(--fgColor-open);border-color:var(--borderColor-open-emphasis)}.Label--closed{color:var(--fgColor-closed);border-color:var(--borderColor-closed-emphasis)}.Label--done{color:var(--fgColor-done);border-color:var(--borderColor-done-emphasis)}.Label--sponsors{color:var(--fgColor-sponsors);border-color:var(--borderColor-sponsors-emphasis)}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["label.pcss"],"names":[],"mappings":"AAGA,QACE,iBACF,CAIA,
|
|
1
|
+
{"version":3,"sources":["label.pcss"],"names":[],"mappings":"AAGA,QACE,iBACF,CAIA,cAEE,oBAAqB,CACrB,4BAA6B,CAC7B,qCAAsC,CACtC,0CAA2C,CAE3C,gBAAiB,CACjB,kBAAmB,CACnB,+DAAgE,CAChE,sCAKF,CAHE,yBACE,4BAAqB,CAArB,oBACF,CAKF,cACE,4BAA6B,CAE7B,gBACF,CAMA,eACE,cAAe,CAEf,kBAAqB,CAErB,aACF,CAIA,gBACE,4BAA6B,CAC7B,gDACF,CAEA,kBACE,0BAA2B,CAC3B,uCACF,CAIA,4BAEE,2BAA4B,CAC5B,+CACF,CAEA,gBACE,4BAA6B,CAC7B,gDACF,CAEA,kCAEE,8BAA+B,CAC/B,kDACF,CAEA,eACE,2BAA4B,CAC5B,+CACF,CAEA,eACE,2BAA4B,CAC5B,+CACF,CAEA,aACE,yBAA0B,CAC1B,6CACF,CAEA,eACE,2BAA4B,CAC5B,+CACF,CAEA,aACE,yBAA0B,CAC1B,6CACF,CAEA,iBACE,6BAA8B,CAC9B,iDACF","file":"label.css","sourcesContent":["/* Labels */\n\n/* Provide a wrapper to ensure labels stick together */\n.labels {\n position: relative;\n}\n\n/* Default 20px */\n\n.label, /* TODO: Deprecate */\n.Label {\n display: inline-block;\n padding: 0 var(--base-size-6);\n font-size: var(--text-body-size-small);\n font-weight: var(--base-text-weight-medium);\n /* stylelint-disable-next-line primer/typography */\n line-height: 18px;\n white-space: nowrap;\n border: var(--borderWidth-thin) solid var(--borderColor-default);\n border-radius: var(--borderRadius-full);\n\n &:hover {\n text-decoration: none;\n }\n}\n\n/* Large 24px */\n\n.Label--large {\n padding: 0 var(--base-size-8);\n /* stylelint-disable-next-line primer/typography */\n line-height: 22px;\n}\n\n/* Inline */\n\n/* Doesn't increase height of parent element\n** Can be used with different font-sizes */\n.Label--inline {\n display: inline;\n /* stylelint-disable-next-line primer/spacing */\n padding: 0.12em 0.5em;\n /* stylelint-disable-next-line primer/typography */\n font-size: 85%;\n}\n\n/* Contrast */\n\n.Label--primary {\n color: var(--fgColor-default);\n border-color: var(--borderColor-neutral-emphasis);\n}\n\n.Label--secondary {\n color: var(--fgColor-muted);\n border-color: var(--borderColor-default);\n}\n\n/* Colors */\n\n.Label--info, /* TODO: deprecate */\n.Label--accent {\n color: var(--fgColor-accent);\n border-color: var(--borderColor-accent-emphasis);\n}\n\n.Label--success {\n color: var(--fgColor-success);\n border-color: var(--borderColor-success-emphasis);\n}\n\n.Label--warning, /* TODO: deprecate */\n.Label--attention {\n color: var(--fgColor-attention);\n border-color: var(--borderColor-attention-emphasis);\n}\n\n.Label--severe {\n color: var(--fgColor-severe);\n border-color: var(--borderColor-severe-emphasis);\n}\n\n.Label--danger {\n color: var(--fgColor-danger);\n border-color: var(--borderColor-danger-emphasis);\n}\n\n.Label--open {\n color: var(--fgColor-open);\n border-color: var(--borderColor-open-emphasis);\n}\n\n.Label--closed {\n color: var(--fgColor-closed);\n border-color: var(--borderColor-closed-emphasis);\n}\n\n.Label--done {\n color: var(--fgColor-done);\n border-color: var(--borderColor-done-emphasis);\n}\n\n.Label--sponsors {\n color: var(--fgColor-sponsors);\n border-color: var(--borderColor-sponsors-emphasis);\n}\n"]}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
.Link{color:var(--fgColor-accent);-webkit-text-decoration:none;text-decoration:none}.Link:hover{cursor:pointer}.Link:focus,.Link:hover{-webkit-text-decoration:underline;text-decoration:underline}.Link:focus,.Link:focus-visible{outline-offset:0}.Link--underline{-webkit-text-decoration:underline;text-decoration:underline}.Link--primary{color:var(--fgColor-default)!important}.Link--primary:hover{color:var(--fgColor-accent)!important}.Link--secondary{color:var(--fgColor-muted)!important}.Link--secondary:hover{color:var(--fgColor-accent)!important}.Link--muted{color:var(--fgColor-muted)!important}.Link--muted:hover{color:var(--fgColor-accent)!important;-webkit-text-decoration:none;text-decoration:none}.Link--onHover:hover{color:var(--fgColor-accent)!important
|
|
1
|
+
.Link{color:var(--fgColor-accent);-webkit-text-decoration:none;text-decoration:none}.Link:hover{cursor:pointer}.Link:focus,.Link:hover{-webkit-text-decoration:underline;text-decoration:underline}.Link:focus,.Link:focus-visible{outline-offset:0}.Link--underline{-webkit-text-decoration:underline;text-decoration:underline}.Link--primary{color:var(--fgColor-default)!important}.Link--primary:hover{color:var(--fgColor-accent)!important}.Link--secondary{color:var(--fgColor-muted)!important}.Link--secondary:hover{color:var(--fgColor-accent)!important}.Link--muted{color:var(--fgColor-muted)!important}.Link--muted:hover{color:var(--fgColor-accent)!important;-webkit-text-decoration:none;text-decoration:none}.Link--onHover:hover{color:var(--fgColor-accent)!important;-webkit-text-decoration:underline;text-decoration:underline;cursor:pointer}:is(.Link--secondary,.Link--primary,.Link--muted):hover [class*=color-fg]{color:inherit!important}.Link-content{display:inline-flex;align-items:center;line-height:normal;gap:var(--base-size-4);text-decoration:inherit}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["link.pcss"],"names":[],"mappings":"AAEA,MACE,2BAA4B,CAC5B,4BAAqB,CAArB,oBAeF,CAbE,YAEE,cACF,CAEA,wBAJE,iCAA0B,CAA1B,yBAMF,CAEA,gCAEE,gBACF,CAGF,iBACE,iCAA0B,CAA1B,yBACF,CAEA,eACE,sCAKF,CAHE,qBACE,qCACF,CAGF,iBACE,oCAKF,CAHE,uBACE,qCACF,CAGF,aACE,oCAMF,CAJE,mBACE,qCAAuC,CACvC,4BAAqB,CAArB,oBACF,CAMA,qBACE,qCAAuC,
|
|
1
|
+
{"version":3,"sources":["link.pcss"],"names":[],"mappings":"AAEA,MACE,2BAA4B,CAC5B,4BAAqB,CAArB,oBAeF,CAbE,YAEE,cACF,CAEA,wBAJE,iCAA0B,CAA1B,yBAMF,CAEA,gCAEE,gBACF,CAGF,iBACE,iCAA0B,CAA1B,yBACF,CAEA,eACE,sCAKF,CAHE,qBACE,qCACF,CAGF,iBACE,oCAKF,CAHE,uBACE,qCACF,CAGF,aACE,oCAMF,CAJE,mBACE,qCAAuC,CACvC,4BAAqB,CAArB,oBACF,CAMA,qBACE,qCAAuC,CACvC,iCAA0B,CAA1B,yBAA0B,CAC1B,cACF,CAQA,0EACE,uBACF,CAGF,cACE,mBAAoB,CACpB,kBAAmB,CAEnB,kBAAmB,CACnB,sBAAuB,CACvB,uBACF","file":"link.css","sourcesContent":["/* Links */\n\n.Link {\n color: var(--fgColor-accent);\n text-decoration: none;\n\n &:hover {\n text-decoration: underline;\n cursor: pointer;\n }\n\n &:focus {\n text-decoration: underline;\n }\n\n &:focus,\n &:focus-visible {\n outline-offset: 0;\n }\n}\n\n.Link--underline {\n text-decoration: underline;\n}\n\n.Link--primary {\n color: var(--fgColor-default) !important;\n\n &:hover {\n color: var(--fgColor-accent) !important;\n }\n}\n\n.Link--secondary {\n color: var(--fgColor-muted) !important;\n\n &:hover {\n color: var(--fgColor-accent) !important;\n }\n}\n\n.Link--muted {\n color: var(--fgColor-muted) !important;\n\n &:hover {\n color: var(--fgColor-accent) !important;\n text-decoration: none;\n }\n}\n\n/* Set the link color only on hover\n Useful when you want only part of a link to turn blue on hover */\n.Link--onHover {\n &:hover {\n color: var(--fgColor-accent) !important;\n text-decoration: underline;\n cursor: pointer;\n }\n}\n\n/* When using a color utility class inside of a link class\n color should change with link on hover. */\n.Link--secondary,\n.Link--primary,\n.Link--muted {\n &:hover [class*='color-fg'] {\n color: inherit !important;\n }\n}\n\n.Link-content {\n display: inline-flex;\n align-items: center;\n /* stylelint-disable-next-line primer/typography */\n line-height: normal;\n gap: var(--base-size-4);\n text-decoration: inherit;\n}\n"]}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
.Popover{position:absolute;z-index:100}.Popover-message{background-color:var(--overlay-bgColor);border:var(--borderWidth-thin) solid var(--borderColor-default);border-radius:var(--borderRadius-medium);box-shadow:var(--shadow-floating-legacy,var(--color-shadow-large))!important
|
|
1
|
+
.Popover{position:absolute;z-index:100}.Popover-message{position:relative;width:232px;margin-right:auto;margin-left:auto;background-color:var(--overlay-bgColor);border:var(--borderWidth-thin) solid var(--borderColor-default);border-radius:var(--borderRadius-medium);box-shadow:var(--shadow-floating-legacy,var(--color-shadow-large))!important}.Popover-message:after,.Popover-message:before{position:absolute;left:50%;display:inline-block;content:""}.Popover-message:before{top:-16px;margin-left:-9px;border:8px solid #0000;border-bottom:8px solid var(--borderColor-default)}.Popover-message:after{top:-14px;margin-left:-8px;border:7px solid #0000;border-bottom:7px solid var(--overlay-bgColor)}.Popover-message--no-caret:after,.Popover-message--no-caret:before{display:none}:is(.Popover-message--bottom,.Popover-message--bottom-right,.Popover-message--bottom-left):after,:is(.Popover-message--bottom,.Popover-message--bottom-right,.Popover-message--bottom-left):before{top:auto;border-bottom-color:#0000}:is(.Popover-message--bottom,.Popover-message--bottom-right,.Popover-message--bottom-left):before{bottom:-16px;border-top-color:var(--borderColor-default)}:is(.Popover-message--bottom,.Popover-message--bottom-right,.Popover-message--bottom-left):after{bottom:-14px;border-top-color:var(--overlay-bgColor)}.Popover-message--bottom-right,.Popover-message--top-right{right:-9px;margin-right:0}:is(.Popover-message--top-right,.Popover-message--bottom-right):after,:is(.Popover-message--top-right,.Popover-message--bottom-right):before{left:auto;margin-left:0}:is(.Popover-message--top-right,.Popover-message--bottom-right):before{right:var(--base-size-20)}:is(.Popover-message--top-right,.Popover-message--bottom-right):after{right:var(--base-size-20);margin-right:1px}.Popover-message--bottom-left,.Popover-message--top-left{left:-9px;margin-left:0}:is(.Popover-message--top-left,.Popover-message--bottom-left):after,:is(.Popover-message--top-left,.Popover-message--bottom-left):before{left:var(--base-size-24);margin-left:0}:is(.Popover-message--top-left,.Popover-message--bottom-left):after{left:var(--base-size-24);margin-left:1px}:is(.Popover-message--right,.Popover-message--right-top,.Popover-message--right-bottom,.Popover-message--left,.Popover-message--left-top,.Popover-message--left-bottom):after,:is(.Popover-message--right,.Popover-message--right-top,.Popover-message--right-bottom,.Popover-message--left,.Popover-message--left-top,.Popover-message--left-bottom):before{top:50%;left:auto;margin-left:0;border-bottom-color:#0000}:is(.Popover-message--right,.Popover-message--right-top,.Popover-message--right-bottom,.Popover-message--left,.Popover-message--left-top,.Popover-message--left-bottom):before{margin-top:-9px}:is(.Popover-message--right,.Popover-message--right-top,.Popover-message--right-bottom,.Popover-message--left,.Popover-message--left-top,.Popover-message--left-bottom):after{margin-top:-8px}:is(.Popover-message--right,.Popover-message--right-top,.Popover-message--right-bottom):before{right:-16px;border-left-color:var(--borderColor-default)}:is(.Popover-message--right,.Popover-message--right-top,.Popover-message--right-bottom):after{right:-14px;border-left-color:var(--overlay-bgColor)}:is(.Popover-message--left,.Popover-message--left-top,.Popover-message--left-bottom):before{left:-16px;border-right-color:var(--borderColor-default)}:is(.Popover-message--left,.Popover-message--left-top,.Popover-message--left-bottom):after{left:-14px;margin-bottom:1px;border-right-color:var(--overlay-bgColor)}:is(.Popover-message--right-top,.Popover-message--left-top):after,:is(.Popover-message--right-top,.Popover-message--left-top):before{top:var(--base-size-24)}:is(.Popover-message--right-bottom,.Popover-message--left-bottom):after,:is(.Popover-message--right-bottom,.Popover-message--left-bottom):before{top:auto}:is(.Popover-message--right-bottom,.Popover-message--left-bottom):before{bottom:var(--base-size-16)}:is(.Popover-message--right-bottom,.Popover-message--left-bottom):after{bottom:var(--base-size-16);margin-bottom:1px}@media (min-width:544px){.Popover-message--large{min-width:320px}}@media (max-width:767.98px){.Popover{position:fixed;top:auto!important;right:0!important;bottom:0!important;left:0!important}.Popover-message{top:auto;right:auto;bottom:auto;left:auto;width:auto!important;margin:var(--stack-gap-condensed)}.Popover-message>.btn-octicon{padding:var(--control-medium-paddingInline-normal)!important}.Popover-message:after,.Popover-message:before{display:none}}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["popover.pcss"],"names":[],"mappings":"AAIA,SACE,iBAAkB,CAClB,WACF,CAEA,
|
|
1
|
+
{"version":3,"sources":["popover.pcss"],"names":[],"mappings":"AAIA,SACE,iBAAkB,CAClB,WACF,CAEA,iBACE,iBAAkB,CAClB,WAAY,CACZ,iBAAkB,CAClB,gBAAiB,CACjB,uCAAwC,CACxC,+DAAgE,CAChE,wCAAyC,CAGzC,4EA2BF,CAxBE,+CAEE,iBAAkB,CAClB,QAAS,CACT,oBAAqB,CACrB,UACF,CAEA,wBACE,SAAU,CACV,gBAAiB,CAGjB,sBAA+C,CAA/C,kDACF,CAEA,uBACE,SAAU,CACV,gBAAiB,CAIjB,sBAA2C,CAA3C,8CACF,CAKA,mEAEE,YACF,CAOA,mMAEE,QAAS,CACT,yBACF,CAEA,kGACE,YAAa,CACb,2CACF,CAEA,iGACE,YAAa,CAEb,uCACF,CAIF,2DAEE,UAAW,CACX,cAgBF,CAdE,6IAEE,SAAU,CACV,aACF,CAEA,uEACE,yBACF,CAEA,sEACE,yBAA0B,CAC1B,gBACF,CAIF,yDAEE,SAAU,CACV,aAYF,CAVE,yIAEE,wBAAyB,CACzB,aACF,CAEA,oEACE,wBAAyB,CACzB,eACF,CAUA,6VAEE,OAAQ,CACR,SAAU,CACV,aAAc,CACd,yBACF,CAEA,+KACE,eACF,CAEA,8KACE,eACF,CAOA,+FACE,WAAY,CACZ,4CACF,CAEA,8FACE,WAAY,CAEZ,wCACF,CAOA,4FACE,UAAW,CACX,6CACF,CAEA,2FACE,UAAW,CACX,iBAAkB,CAElB,yCACF,CAMA,qIAEE,uBACF,CAMA,iJAEE,QACF,CAEA,yEACE,0BACF,CAEA,wEACE,0BAA2B,CAC3B,iBACF,CAGF,yBACE,wBACE,eACF,CACF,CAKA,4BACE,SACE,cAAe,CACf,kBAAoB,CACpB,iBAAmB,CACnB,kBAAoB,CACpB,gBACF,CAEA,iBACE,QAAS,CACT,UAAW,CACX,WAAY,CACZ,SAAU,CACV,oBAAsB,CACtB,iCACF,CAGA,8BACE,4DACF,CAGA,+CAEE,YACF,CACF","file":"popover.css","sourcesContent":["/* stylelint-disable primer/spacing */\n\n/* Popover */\n\n.Popover {\n position: absolute;\n z-index: 100;\n}\n\n.Popover-message {\n position: relative;\n width: 232px;\n margin-right: auto;\n margin-left: auto;\n background-color: var(--overlay-bgColor);\n border: var(--borderWidth-thin) solid var(--borderColor-default);\n border-radius: var(--borderRadius-medium);\n\n /* adding !important to override utility classes used in dotcom */\n box-shadow: var(--shadow-floating-legacy, var(--color-shadow-large)) !important;\n\n /* Carets */\n &::before,\n &::after {\n position: absolute;\n left: 50%;\n display: inline-block;\n content: '';\n }\n\n &::before {\n top: -16px;\n margin-left: -9px;\n /* stylelint-disable-next-line primer/borders */\n border: 8px solid transparent;\n border-bottom-color: var(--borderColor-default);\n }\n\n &::after {\n top: -14px;\n margin-left: -8px;\n /* stylelint-disable-next-line primer/borders */\n border: 7px solid transparent;\n /* stylelint-disable-next-line primer/colors */\n border-bottom-color: var(--overlay-bgColor);\n }\n}\n\n/* No caret */\n.Popover-message--no-caret {\n &::before,\n &::after {\n display: none;\n }\n}\n\n/* Bottom-oriented carets */\n.Popover-message--bottom,\n.Popover-message--bottom-right,\n.Popover-message--bottom-left {\n &::before,\n &::after {\n top: auto;\n border-bottom-color: transparent;\n }\n\n &::before {\n bottom: -16px;\n border-top-color: var(--borderColor-default);\n }\n\n &::after {\n bottom: -14px;\n /* stylelint-disable-next-line primer/colors */\n border-top-color: var(--overlay-bgColor);\n }\n}\n\n/* Top and Bottom: Right-oriented carets */\n.Popover-message--top-right,\n.Popover-message--bottom-right {\n right: -9px;\n margin-right: 0;\n\n &::before,\n &::after {\n left: auto;\n margin-left: 0;\n }\n\n &::before {\n right: var(--base-size-20);\n }\n\n &::after {\n right: var(--base-size-20);\n margin-right: 1px;\n }\n}\n\n/* Top and Bottom: Left-oriented carets */\n.Popover-message--top-left,\n.Popover-message--bottom-left {\n left: -9px;\n margin-left: 0;\n\n &::before,\n &::after {\n left: var(--base-size-24);\n margin-left: 0;\n }\n\n &::after {\n left: var(--base-size-24);\n margin-left: 1px;\n }\n}\n\n/* Right- and Left-oriented carets */\n.Popover-message--right,\n.Popover-message--right-top,\n.Popover-message--right-bottom,\n.Popover-message--left,\n.Popover-message--left-top,\n.Popover-message--left-bottom {\n &::before,\n &::after {\n top: 50%;\n left: auto;\n margin-left: 0;\n border-bottom-color: transparent;\n }\n\n &::before {\n margin-top: -9px;\n }\n\n &::after {\n margin-top: -8px;\n }\n}\n\n/* Right-oriented carets */\n.Popover-message--right,\n.Popover-message--right-top,\n.Popover-message--right-bottom {\n &::before {\n right: -16px;\n border-left-color: var(--borderColor-default);\n }\n\n &::after {\n right: -14px;\n /* stylelint-disable-next-line primer/colors */\n border-left-color: var(--overlay-bgColor);\n }\n}\n\n/* Left-oriented carets */\n.Popover-message--left,\n.Popover-message--left-top,\n.Popover-message--left-bottom {\n &::before {\n left: -16px;\n border-right-color: var(--borderColor-default);\n }\n\n &::after {\n left: -14px;\n margin-bottom: 1px;\n /* stylelint-disable-next-line primer/colors */\n border-right-color: var(--overlay-bgColor);\n }\n}\n\n/* Right and Left: Top-oriented carets */\n.Popover-message--right-top,\n.Popover-message--left-top {\n &::before,\n &::after {\n top: var(--base-size-24);\n }\n}\n\n/* Right and Left: Bottom-oriented carets */\n.Popover-message--right-bottom,\n.Popover-message--left-bottom {\n &::before,\n &::after {\n top: auto;\n }\n\n &::before {\n bottom: var(--base-size-16);\n }\n\n &::after {\n bottom: var(--base-size-16);\n margin-bottom: 1px;\n }\n}\n\n@media (min-width: 544px) {\n .Popover-message--large {\n min-width: 320px;\n }\n}\n\n/* Responsive Popover\n** For < md it will show full-width anchored to the bottom */\n\n@media (max-width: 767.98px) {\n .Popover {\n position: fixed;\n top: auto !important;\n right: 0 !important;\n bottom: 0 !important;\n left: 0 !important;\n }\n\n .Popover-message {\n top: auto;\n right: auto;\n bottom: auto;\n left: auto;\n width: auto !important;\n margin: var(--stack-gap-condensed);\n }\n\n /* Increase tap area for touch input */\n .Popover-message > .btn-octicon {\n padding: var(--control-medium-paddingInline-normal) !important;\n }\n\n /* Remove caret */\n .Popover-message::after,\n .Popover-message::before {\n display: none;\n }\n}\n"]}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
.Progress{background-color:var(--progressBar-track-bgColor);border-radius:var(--borderRadius-medium);
|
|
1
|
+
.Progress{display:flex;height:8px;overflow:hidden;background-color:var(--progressBar-track-bgColor);border-radius:var(--borderRadius-medium);outline:solid 1px var(--progressBar-track-borderColor);outline-offset:-1px}.Progress--large{height:10px}.Progress--small{height:5px}.Progress-item{outline:2px solid #0000;background:LinkText}.Progress-item+.Progress-item{margin-left:var(--base-size-2)}@media (forced-colors:active){:root{--progressBar-track-bgColor:CanvasText}.Progress,.Progress-item{forced-color-adjust:none}}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["progress_bar.pcss"],"names":[],"mappings":"AAEA,
|
|
1
|
+
{"version":3,"sources":["progress_bar.pcss"],"names":[],"mappings":"AAEA,UACE,YAAa,CACb,UAAW,CACX,eAAgB,CAChB,iDAAkD,CAClD,wCAAyC,CACzC,sDAAuD,CACvD,mBACF,CAEA,iBACE,WACF,CAEA,iBACE,UACF,CAEA,eACE,uBAA8B,CAC9B,mBACF,CAEA,8BACE,8BACF,CAEA,8BACE,MACE,sCACF,CAEA,yBACE,wBACF,CACF","file":"progress_bar.css","sourcesContent":["/* Progress */\n\n.Progress {\n display: flex;\n height: 8px;\n overflow: hidden;\n background-color: var(--progressBar-track-bgColor);\n border-radius: var(--borderRadius-medium);\n outline: solid 1px var(--progressBar-track-borderColor);\n outline-offset: -1px;\n}\n\n.Progress--large {\n height: 10px;\n}\n\n.Progress--small {\n height: 5px;\n}\n\n.Progress-item {\n outline: 2px solid transparent; /* Support Firefox custom colors */\n background: LinkText;\n}\n\n.Progress-item + .Progress-item {\n margin-left: var(--base-size-2);\n}\n\n@media (forced-colors: active) {\n :root {\n --progressBar-track-bgColor: CanvasText;\n }\n\n .Progress, .Progress-item {\n forced-color-adjust: none;\n }\n}\n"]}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
.State,.state{
|
|
1
|
+
.State,.state{display:inline-block;padding:var(--base-size-4) var(--control-medium-paddingInline-normal);font-size:var(--text-body-size-medium);font-weight:var(--base-text-weight-medium);line-height:var(--base-size-20);text-align:center;white-space:nowrap;border-radius:2em}.State,.State--draft,.state{color:var(--fgColor-onEmphasis);background-color:var(--bgColor-draft-emphasis,var(--bgColor-neutral-emphasis));border:var(--borderWidth-thin) solid #0000;box-shadow:var(--boxShadow-thin) var(--borderColor-draft-emphasis,var(--borderColor-neutral-emphasis))}.State--open{background-color:var(--bgColor-open-emphasis,var(--color-open-emphasis));box-shadow:var(--boxShadow-thin) var(--borderColor-open-emphasis)}.State--merged,.State--open{color:var(--fgColor-onEmphasis)}.State--merged{background-color:var(--bgColor-done-emphasis,var(--color-done-emphasis));box-shadow:var(--boxShadow-thin) var(--borderColor-done-emphasis)}.State--closed{color:var(--fgColor-onEmphasis);background-color:var(--bgColor-closed-emphasis,var(--color-closed-emphasis));box-shadow:var(--boxShadow-thin) var(--borderColor-closed-emphasis)}.State--small{padding:0 10px;font-size:var(--text-body-size-small);line-height:var(--base-size-24)}.State--small .octicon{width:1em}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["state.pcss"],"names":[],"mappings":"AAIA,
|
|
1
|
+
{"version":3,"sources":["state.pcss"],"names":[],"mappings":"AAIA,cAEE,oBAAqB,CAErB,qEAAsE,CACtE,sCAAuC,CACvC,0CAA2C,CAE3C,+BAAgC,CAChC,iBAAkB,CAClB,kBAAmB,CAEnB,iBACF,CAEA,4BAGE,+BAAgC,CAChC,8EAAgF,CAChF,0CAAiD,CACjD,sGACF,CAEA,aAEE,wEAA0E,CAC1E,iEACF,CAEA,4BALE,+BASF,CAJA,eAEE,wEAA0E,CAC1E,iEACF,CAEA,eACE,+BAAgC,CAChC,4EAA8E,CAC9E,mEACF,CAIA,cAEE,cAAe,CACf,qCAAsC,CAEtC,+BAKF,CAHE,uBACE,SACF","file":"state.css","sourcesContent":["/* State */\n\n/* Default 32px */\n\n.state, /* TODO: Deprecate */\n.State {\n display: inline-block;\n /* stylelint-disable-next-line primer/spacing */\n padding: var(--base-size-4) var(--control-medium-paddingInline-normal);\n font-size: var(--text-body-size-medium);\n font-weight: var(--base-text-weight-medium);\n /* stylelint-disable-next-line primer/typography */\n line-height: var(--base-size-20);\n text-align: center;\n white-space: nowrap;\n /* stylelint-disable-next-line primer/borders */\n border-radius: 2em;\n}\n\n.state, /* TODO: Deprecate */\n.State,\n.State--draft {\n color: var(--fgColor-onEmphasis);\n background-color: var(--bgColor-draft-emphasis, var(--bgColor-neutral-emphasis));\n border: var(--borderWidth-thin) solid transparent;\n box-shadow: var(--boxShadow-thin) var(--borderColor-draft-emphasis, var(--borderColor-neutral-emphasis));\n}\n\n.State--open {\n color: var(--fgColor-onEmphasis);\n background-color: var(--bgColor-open-emphasis, var(--color-open-emphasis));\n box-shadow: var(--boxShadow-thin) var(--borderColor-open-emphasis);\n}\n\n.State--merged {\n color: var(--fgColor-onEmphasis);\n background-color: var(--bgColor-done-emphasis, var(--color-done-emphasis));\n box-shadow: var(--boxShadow-thin) var(--borderColor-done-emphasis);\n}\n\n.State--closed {\n color: var(--fgColor-onEmphasis);\n background-color: var(--bgColor-closed-emphasis, var(--color-closed-emphasis));\n box-shadow: var(--boxShadow-thin) var(--borderColor-closed-emphasis);\n}\n\n/* Small 24px */\n\n.State--small {\n /* stylelint-disable-next-line primer/spacing */\n padding: 0 10px;\n font-size: var(--text-body-size-small);\n /* stylelint-disable-next-line primer/typography */\n line-height: var(--base-size-24);\n\n & .octicon {\n width: 1em; /* Ensures different icons don't change State indicator width */\n }\n}\n"]}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
.Subhead{border-bottom:var(--borderWidth-thin) solid var(--borderColor-muted);
|
|
1
|
+
.Subhead{display:flex;padding-bottom:var(--stack-padding-condensed);margin-bottom:var(--stack-gap-normal);border-bottom:var(--borderWidth-thin) solid var(--borderColor-muted);flex-flow:row wrap;justify-content:flex-end}.Subhead--spacious{margin-top:var(--base-size-40)}.Subhead-heading{font-weight:var(--base-text-weight-normal);flex:1 1 auto;order:0}.Subhead-heading--large{font-size:var(--base-size-24)}.Subhead-heading--medium{font-size:var(--text-title-size-medium)}.Subhead-heading--danger{font-weight:var(--base-text-weight-semibold);color:var(--fgColor-danger)}.Subhead-description{font-size:var(--text-body-size-medium);color:var(--fgColor-muted);flex:1 100%;order:2}.Subhead-actions{margin:var(--base-size-4) 0 var(--base-size-4) var(--base-size-4);align-self:center;justify-content:flex-end;order:1}.Subhead-actions+.Subhead-description{margin-top:var(--base-size-4)}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["subhead.pcss"],"names":[],"mappings":"AAEA,
|
|
1
|
+
{"version":3,"sources":["subhead.pcss"],"names":[],"mappings":"AAEA,SACE,YAAa,CAEb,6CAA8C,CAE9C,qCAAsC,CACtC,oEAAqE,CACrE,kBAAmB,CACnB,wBACF,CAGA,mBACE,8BACF,CAGA,iBACE,0CAA2C,CAC3C,aAAc,CACd,OACF,CAEA,wBAEE,6BACF,CAEA,yBACE,uCACF,CAGA,yBACE,4CAA6C,CAC7C,2BACF,CAGA,qBACE,sCAAuC,CACvC,0BAA2B,CAC3B,WAAY,CACZ,OACF,CAGA,iBACE,iEAAkE,CAClE,iBAAkB,CAClB,wBAAyB,CACzB,OAKF,CAHE,sCACE,6BACF","file":"subhead.css","sourcesContent":["/* Subhead */\n\n.Subhead {\n display: flex;\n /* stylelint-disable-next-line primer/spacing */\n padding-bottom: var(--stack-padding-condensed);\n /* stylelint-disable-next-line primer/spacing */\n margin-bottom: var(--stack-gap-normal);\n border-bottom: var(--borderWidth-thin) solid var(--borderColor-muted);\n flex-flow: row wrap;\n justify-content: flex-end; /* Keep actions right aligned. */\n}\n\n/* Modifier class to give a lot of breathing room between sections of content. */\n.Subhead--spacious {\n margin-top: var(--base-size-40);\n}\n\n/* <h2> sized heading with normal font weight */\n.Subhead-heading {\n font-weight: var(--base-text-weight-normal);\n flex: 1 1 auto;\n order: 0;\n}\n\n.Subhead-heading--large {\n /* stylelint-disable-next-line primer/typography */\n font-size: var(--base-size-24);\n}\n\n.Subhead-heading--medium {\n font-size: var(--text-title-size-medium);\n}\n\n/* Make the text bold and red for dangerous content */\n.Subhead-heading--danger {\n font-weight: var(--base-text-weight-semibold);\n color: var(--fgColor-danger);\n}\n\n/* One-liner of supporting text */\n.Subhead-description {\n font-size: var(--text-body-size-medium);\n color: var(--fgColor-muted);\n flex: 1 100%;\n order: 2;\n}\n\n/* Add 1 or 2 buttons to the right of the heading */\n.Subhead-actions {\n margin: var(--base-size-4) 0 var(--base-size-4) var(--base-size-4);\n align-self: center;\n justify-content: flex-end;\n order: 1;\n\n & + .Subhead-description {\n margin-top: var(--base-size-4);\n }\n}\n"]}
|