@primer/react/dist/deprecated/ActionList/Item-cf87f98a.css.map

An implementation of GitHub's Primer Design System using React

{"version":3,"sources":["../../src/deprecated/ActionList/Item.module.css.js"],"names":[],"mappings":"AACA,qCAKE,iBAEF,CAEA,uEARE,YAAa,CAKb,WAAY,CAJZ,WAaF,CANA,kCACE,oBAAqB,CAGrB,iDAEF,CAEA,2BAKE,gDAAyC,CACzC,oDAA6B,CAF7B,YAAa,CADb,oCAA+B,CAM/B,4BAAqB,CAArB,oBAAqB,CADrB,qCAEF,CAEA,mCACE,kDACF,CAEA,qCACE,6DAA8B,CAC9B,cACF,CAEA,wCACE,iCAEE,wFAA+D,CAC/D,cACF,CAEA,yCACE,+FAAsE,CACtE,kDACF,CAEA,2CACE,sBAAuB,CACvB,cACF,CACF,CAGA,wIACE,YAMF,CAJE,+JAEE,cACF,CAGF,oLAQE,kBAAwC,CACxC,iEAAmB,CAPnB,WAAY,CACZ,aAAc,CACd,iBAAkB,CAGlB,QAAS,CAFT,UAKF,CAGE,mEAEE,oBACF,CAIF,2JAIE,kFACF,CAGA;EAIE,oEAAoE,CACpE,kCACF,CAGA,yEACE,iEACF,CAEA,2EACE,0DACF,CAEA,iCAEE,YACF,CAEA,mEAJE,iEAMF,CAEA,0CACE,kBACF,CAEA,yCACE,qBACF,CAaA,uFAJE,kBAAmB,CAFnB,YAAa,CAGb,aAAc,CANd,WAAY,CAIZ,sBAAuB,CAFvB,qCAAgC,CADhC,8BAkBF,CAVA,6CAQE,qBAEF,CAEA,iDACE,+CAA0B,CAC1B,4CACF,CAEA,8EACE,iDACF,CAEA,wEACE,4DACF,CAEA,sCASE,kBAAmB,CAPnB,gDAA2B,CAK3B,YAAa,CAGb,aAAc,CAPd,WAAY,CAKZ,sBAAuB,CAHvB,oCAA+B,CAC/B,cAAe,CAFf,UAOF,CAEA,mEACE,gDACF,CAEA,6DACE,6DACF,CAEA,uDACE,oCACF,CAEA,0CACE,+CAA0B,CAC1B,4CACF,CAEA,uEACE,iDACF,CAEA,iEACE,4DACF,CAEA,2CASE,kDAAmD,CAHnD,WAAY,CAJZ,4CAAsC,CAEtC,gBAAiB,CAIjB,oDAAqD,CAHrD,WAKF,CAEA,iFAXE,gDAaF,CAEA,2CACE,uDAA4B,CAC5B,6DAAkC,CAClC,oBACF,CAEA,2CACE,0DAA+B,CAC/B,gEAAuC,CACvC,SACF,CAEA,kEACE,gEAAoC,CACpC,kEACF,CAEA,kEACE,SACF,CAEA,oPAIE,iDACF,CAEA,wMAIE,cACF","file":"Item-cf87f98a.css","sourcesContent":["/* stylelint-disable selector-max-specificity */\n.DividedContent {\n  display: flex;\n  min-width: 0;\n\n  /* Required for dividers */\n  position: relative;\n  flex-grow: 1;\n}\n\n.MainContent {\n  align-items: baseline;\n  display: flex;\n  min-width: 0;\n  flex-direction: var(--main-content-flex-direction);\n  flex-grow: 1;\n}\n\n.Item {\n  /* 6px vertical padding + 20px line height = 32px total height */\n  /* stylelint-disable-next-line primer/spacing */\n  padding: 6px var(--base-size-8);\n  display: flex;\n  border-radius: var(--borderRadius-medium);\n  color: var(--fgColor-default);\n  /* 2 frames on a 60hz monitor */\n  transition: background 33.333ms linear;\n  text-decoration: none;\n}\n\n.Item--danger {\n  color: var(--fgColor-danger);\n}\n\n.Item--disabled {\n  color: var(--fgColor-disabled);\n  cursor: default;\n}\n\n@media (hover: hover) and (pointer: fine) {\n  .Item:hover {\n    /* allow override in case another item in the list is active/focused */\n    background: var(--item-hover-bg-override, var(--bgColor-muted));\n    cursor: pointer;\n  }\n\n  .Item--danger:hover {\n    background: var(--item-hover-bg-override, var(--bgColor-danger-muted));\n    color: var(--fgColor-danger);\n  }\n\n  .Item--disabled:hover {\n    background: transparent;\n    cursor: default;\n  }\n}\n\n/* Item dividers */\n.Item:not(:first-of-type):not([data-component='ActionList.Divider'] + *):not([data-component='ActionList.Header'] + *) {\n  margin-top: 0;\n\n  :where([data-divider]) {\n    /* stylelint-disable-next-line primer/spacing */\n    margin-top: 1px;\n  }\n}\n\n.Item:not(:first-of-type):not([data-component='ActionList.Divider'] + *):not([data-component='ActionList.Header'] + *)\n  .DividedContent::before {\n  content: ' ';\n  display: block;\n  position: absolute;\n  width: 100%;\n  /* stylelint-disable-next-line primer/spacing */\n  top: -7px;\n  border: 0 solid var(--borderColor-muted);\n  border-top-width: 0;\n}\n\n:where([data-divider]) {\n  .DividedContent::before {\n    /* stylelint-disable-next-line primer/borders */\n    border-top-width: 1px;\n  }\n}\n\n/* Item dividers should not be visible above/below hovered items */\n.Item:hover .DividedContent::before,\n:hover + .Item .DividedContent::before {\n  /* allow override in case another item in the list is active/focused */\n  /* stylelint-disable-next-line primer/colors */\n  border-color: var(--item-hover-divider-border-color-override, transparent) !important;\n}\n\n/* Item dividers should not be visible above/below focused items */\n.Item:focus .DividedContent::before,\n:focus + .Item .DividedContent::before,\n.Item[data-is-active-descendant] .DividedContent::before,\n[data-active-descendant] + .Item .DividedContent::before {\n  /* !important because all the :not's above give higher specificity */\n  border-color: transparent !important;\n}\n\n/* Active Descendant */\n.Item[data-is-active-descendant='activated-directly'] {\n  background: var(--bgColor-accent-muted);\n}\n\n.Item[data-is-active-descendant='activated-indirectly'] {\n  background: var(--bgColor-muted);\n}\n\n.Item:focus {\n  background: var(--bgColor-accent-muted);\n  outline: none;\n}\n\n.Item:active {\n  background: var(--bgColor-accent-muted);\n}\n\n.MainContent--inline {\n  flex-direction: row;\n}\n\n.MainContent--block {\n  flex-direction: column;\n}\n\n.BaseVisualContainer {\n  /* Match visual height to adjacent text line height. */\n  height: 20px;\n  width: var(--base-size-16);\n  margin-right: var(--base-size-8);\n  display: flex;\n  justify-content: center;\n  align-items: center;\n  flex-shrink: 0;\n}\n\n.LeadingVisualContainer {\n  /* Match visual height to adjacent text line height. */\n  height: 20px;\n  width: var(--base-size-16);\n  margin-right: var(--base-size-8);\n  align-items: center;\n  flex-shrink: 0;\n  display: flex;\n  flex-direction: column;\n  justify-content: center;\n}\n\n.LeadingVisualContainer svg {\n  fill: var(--fgColor-muted);\n  font-size: var(--text-body-size-small);\n}\n\n.LeadingVisualContainer:where([data-variant='danger']) svg {\n  fill: var(--fgColor-danger);\n}\n\n.LeadingVisualContainer:where([data-disabled]) svg {\n  fill: var(--fgColor-disabled);\n}\n\n.TrailingContent {\n  /* Match visual height to adjacent text line height. */\n  color: var(--fgColor-muted);\n  height: 20px;\n  width: auto;\n  margin-left: var(--base-size-8);\n  margin-right: 0;\n  display: flex;\n  justify-content: center;\n  align-items: center;\n  flex-shrink: 0;\n}\n\n.TrailingContent:where([data-variant='danger']) {\n  color: var(--fgColor-muted);\n}\n\n.TrailingContent:where([data-disabled]) {\n  color: var(--fgColor-disabled);\n}\n\n.TrailingContent div:nth-child(2) {\n  margin-left: var(--base-size-8);\n}\n\n.TrailingContent svg {\n  fill: var(--fgColor-muted);\n  font-size: var(--text-body-size-small);\n}\n\n.TrailingContent:where([data-variant='danger']) svg {\n  fill: var(--fgColor-danger);\n}\n\n.TrailingContent:where([data-disabled]) svg {\n  fill: var(--fgColor-disabled);\n}\n\n.DescriptionContainer {\n  color: var(--fgColor-muted);\n  font-size: var(--text-body-size-small);\n  /* stylelint-disable-next-line primer/typography */\n  line-height: 16px;\n  min-width: 0;\n  flex-grow: 1;\n  /* stylelint-disable-next-line primer/spacing */\n  margin-left: var(--description-container-margin-left);\n  flex-basis: var(--description-container-flex-basis);\n}\n\n.MultiSelectIcon {\n  color: var(--fgColor-muted);\n}\n\n.MultiSelectIcon rect {\n  fill: var(--bgColor-default);\n  stroke: var(--borderColor-default);\n  shape-rendering: auto; /* this is a workaround to override global style in github/github, see primer/react#1666 */\n}\n\n.MultiSelectIcon path {\n  fill: var(--fgColor-onEmphasis);\n  box-shadow: var(--shadow-resting-small);\n  opacity: 0;\n}\n\n.MultiSelectIcon:where([data-selected]) rect {\n  fill: var(--bgColor-accent-emphasis);\n  stroke: var(--bgColor-accent-emphasis);\n}\n\n.MultiSelectIcon:where([data-selected]) path {\n  opacity: 1;\n}\n\n.Item[data-divider]:not(:first-of-type):not([data-component='ActionList.Divider'] + .Item):not(\n    [data-component='ActionList.Header'] + .Item\n  )\n  .DividedContent::before {\n  border-top-width: var(--borderWidth-thin);\n}\n\n.Item[data-divider]:not(:first-of-type):not([data-component='ActionList.Divider'] + .Item):not(\n    [data-component='ActionList.Header'] + .Item\n  ) {\n  /* stylelint-disable-next-line primer/spacing */\n  margin-top: 1px;\n}\n"]}