@primer/css 20.2.0 → 20.2.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -1 +1 @@
1
- {"size":4653,"gzipSize":1016,"humanizedSize":"5KB","humanizedGzipSize":"1016B","rules":{"total":37,"size":{"graph":[3,1,1,18,1,8,1,1,2,1,1,1,2,1,1,3,1,1,4,1,2,1,1,1,5,6,6,13,1,5,1,2,1,2,2,1,1],"max":18,"average":2.810810810810811},"selectorByRuleSizes":[{"selector":".ToggleSwitch-track","declarations":18},{"selector":".ToggleSwitch-knob","declarations":13},{"selector":".ToggleSwitch-track::before","declarations":8},{"selector":".ToggleSwitch-circleIcon","declarations":6},{"selector":".ToggleSwitch-lineIcon","declarations":6},{"selector":".ToggleSwitch-status","declarations":5},{"selector":".ToggleSwitch-icons","declarations":5},{"selector":".ToggleSwitch-track[aria-disabled=true]","declarations":4},{"selector":".ToggleSwitch-track[aria-checked=true] .ToggleSwitch-knob","declarations":3},{"selector":".ToggleSwitch","declarations":3},{"selector":".ToggleSwitch-statusOff","declarations":2},{"selector":".ToggleSwitch-statusOn","declarations":2},{"selector":".ToggleSwitch--small .ToggleSwitch-track","declarations":2},{"selector":".ToggleSwitch-track[aria-disabled=true] .ToggleSwitch-knob","declarations":2},{"selector":".ToggleSwitch-track[aria-checked=true]","declarations":2},{"selector":".ToggleSwitch-track[aria-checked=true][aria-disabled=true]","declarations":2},{"selector":".ToggleSwitch--statusAtEnd .ToggleSwitch-status","declarations":1},{"selector":".ToggleSwitch--statusAtEnd","declarations":1},{"selector":".ToggleSwitch--disabled .ToggleSwitch-status","declarations":1},{"selector":".ToggleSwitch--small .ToggleSwitch-status","declarations":1},{"selector":".ToggleSwitch-knob","declarations":1},{"selector":".ToggleSwitch-track[aria-disabled=true] .ToggleSwitch-circleIcon","declarations":1},{"selector":".ToggleSwitch-track[aria-disabled=true] .ToggleSwitch-lineIcon","declarations":1},{"selector":".ToggleSwitch-track[aria-disabled=true] .ToggleSwitch-knob:hover,.ToggleSwitch-track[aria-disabled=true] .ToggleSwitch-knob:active","declarations":1},{"selector":".ToggleSwitch-track[aria-disabled=true]:hover .ToggleSwitch-knob,.ToggleSwitch-track[aria-disabled=true]:active .ToggleSwitch-knob","declarations":1},{"selector":".ToggleSwitch-track[aria-checked=true] .ToggleSwitch-circleIcon","declarations":1},{"selector":".ToggleSwitch-track[aria-checked=true] .ToggleSwitch-lineIcon","declarations":1},{"selector":".ToggleSwitch-track[aria-checked=true]:active","declarations":1},{"selector":".ToggleSwitch-track[aria-checked=true]:hover","declarations":1},{"selector":".ToggleSwitch-track[aria-checked=true][aria-disabled=true] .ToggleSwitch-knob","declarations":1},{"selector":".ToggleSwitch-track[aria-checked=true][aria-disabled=true]:hover .ToggleSwitch-knob,.ToggleSwitch-track[aria-checked=true][aria-disabled=true]:active .ToggleSwitch-knob","declarations":1},{"selector":".ToggleSwitch-track[aria-checked=true][aria-disabled=true]:hover,.ToggleSwitch-track[aria-checked=true][aria-disabled=true]:active","declarations":1},{"selector":".ToggleSwitch-track *","declarations":1},{"selector":".ToggleSwitch-track","declarations":1},{"selector":".ToggleSwitch-track:focus,.ToggleSwitch-track:focus-visible","declarations":1},{"selector":".ToggleSwitch:active .ToggleSwitch-knob","declarations":1},{"selector":".ToggleSwitch:hover .ToggleSwitch-knob","declarations":1}]},"selectors":{"total":42,"type":0,"class":42,"id":0,"pseudoClass":14,"pseudoElement":1,"values":[".ToggleSwitch",".ToggleSwitch:hover .ToggleSwitch-knob",".ToggleSwitch:active .ToggleSwitch-knob",".ToggleSwitch-track",".ToggleSwitch-track:focus",".ToggleSwitch-track:focus-visible",".ToggleSwitch-track::before",".ToggleSwitch-track",".ToggleSwitch-track *",".ToggleSwitch-track[aria-checked=true][aria-disabled=true]",".ToggleSwitch-track[aria-checked=true][aria-disabled=true]:hover",".ToggleSwitch-track[aria-checked=true][aria-disabled=true]:active",".ToggleSwitch-track[aria-checked=true][aria-disabled=true]:hover .ToggleSwitch-knob",".ToggleSwitch-track[aria-checked=true][aria-disabled=true]:active .ToggleSwitch-knob",".ToggleSwitch-track[aria-checked=true][aria-disabled=true] .ToggleSwitch-knob",".ToggleSwitch-track[aria-checked=true]",".ToggleSwitch-track[aria-checked=true]:hover",".ToggleSwitch-track[aria-checked=true]:active",".ToggleSwitch-track[aria-checked=true] .ToggleSwitch-knob",".ToggleSwitch-track[aria-checked=true] .ToggleSwitch-lineIcon",".ToggleSwitch-track[aria-checked=true] .ToggleSwitch-circleIcon",".ToggleSwitch-track[aria-disabled=true]",".ToggleSwitch-track[aria-disabled=true]:hover .ToggleSwitch-knob",".ToggleSwitch-track[aria-disabled=true]:active .ToggleSwitch-knob",".ToggleSwitch-track[aria-disabled=true] .ToggleSwitch-knob",".ToggleSwitch-track[aria-disabled=true] .ToggleSwitch-knob:hover",".ToggleSwitch-track[aria-disabled=true] .ToggleSwitch-knob:active",".ToggleSwitch-track[aria-disabled=true] .ToggleSwitch-lineIcon",".ToggleSwitch-track[aria-disabled=true] .ToggleSwitch-circleIcon",".ToggleSwitch-icons",".ToggleSwitch-lineIcon",".ToggleSwitch-circleIcon",".ToggleSwitch-knob",".ToggleSwitch-knob",".ToggleSwitch-status",".ToggleSwitch--small .ToggleSwitch-status",".ToggleSwitch--small .ToggleSwitch-track",".ToggleSwitch--disabled .ToggleSwitch-status",".ToggleSwitch-statusOn",".ToggleSwitch-statusOff",".ToggleSwitch--statusAtEnd",".ToggleSwitch--statusAtEnd .ToggleSwitch-status"],"specificity":{"max":50,"average":24.071428571428573}},"declarations":{"total":104,"unique":78,"uniqueToTotalRatio":0.75,"properties":{"align-items":["center","center"],"display":["inline-flex","block","flex"],"gap":["8px"],"background-color":["var(--color-btn-hover-bg)","var(--color-btn-active-bg)","var(--color-switch-track-bg)","var(--color-canvas-subtle)","var(--color-canvas-subtle)","var(--color-switch-knob-checked-disabled-bg)","var(--color-switch-knob-checked-disabled-bg)","var(--color-switch-track-checked-bg)","var(--color-switch-track-checked-hover-bg)","var(--color-switch-track-checked-active-bg)","var(--color-switch-knob-checked-bg)","var(--color-canvas-subtle)","var(--color-btn-bg)","var(--color-btn-bg)","var(--color-btn-bg)"],"position":["relative","absolute","absolute","relative"],"width":["64px","100%","100%","50%","48px"],"height":["32px","100%","100%","24px","0","auto"],"padding":["0"],"overflow":["hidden","hidden"],"text-decoration":["none"],"cursor":["pointer","not-allowed"],"-webkit-user-select":["none"],"user-select":["none"],"border":["1px solid var(--color-switch-track-border)","0","1px solid var(--color-switch-track-border)"],"border-radius":["6px","6px"],"transition-timing-function":["cubic-bezier(0.5, 1, 0.89, 1)","cubic-bezier(0.5, 1, 0.89, 1)"],"transition-duration":["80ms","80ms","80ms","80ms"],"transition-property":["background-color,border-color","none","transform","transform","transform"],"-webkit-appearance":["none"],"appearance":["none"],"outline-offset":["0"],"top":["50%","-1px"],"left":["50%"],"min-height":["44px"],"content":["\"\""],"transform":["translateX(-50%) translateY(-50%)","translateX(calc(100% + 1px))","translateX(0%)","translateX(100%)","translateX(-100%)","translateX(0)","translateX(-1px)"],"transition":["none","none","none"],"border-color":["var(--color-border-subtle)","var(--color-switch-track-checked-border)","var(--color-border-subtle)","var(--color-border-default)"],"box-shadow":["none","var(--color-shadow-medium),var(--color-btn-inset-shadow)"],"color":["var(--color-fg-subtle)","var(--color-fg-subtle)","var(--color-accent-fg)","var(--color-fg-default)","var(--color-fg-default)","var(--color-fg-muted)"],"line-height":["0","0","1.5"],"flex":["1 0 50%","1 0 50%"],"bottom":["-1px"],"z-index":["1"],"font-size":["14px","12px"],"text-align":["right","left"],"visibility":["hidden","visible"],"flex-direction":["row-reverse"]}},"mediaQueries":{"total":3,"unique":2,"values":["(pointer: coarse)","(prefers-reduced-motion)","(prefers-reduced-motion)"],"contents":[{"value":"(pointer: coarse)","rules":{"total":1,"size":{"graph":[8],"max":8,"average":8},"selectorByRuleSizes":[{"selector":".ToggleSwitch-track::before","declarations":8}]},"selectors":{"total":1,"type":0,"class":1,"id":0,"pseudoClass":0,"pseudoElement":1,"values":[".ToggleSwitch-track::before"],"specificity":{"max":11,"average":11}},"declarations":{"total":8,"unique":8,"uniqueToTotalRatio":1,"properties":{"position":["absolute"],"top":["50%"],"left":["50%"],"width":["100%"],"height":["100%"],"min-height":["44px"],"content":["\"\""],"transform":["translateX(-50%) translateY(-50%)"]}}},{"value":"(prefers-reduced-motion)","rules":{"total":2,"size":{"graph":[1,1],"max":1,"average":1},"selectorByRuleSizes":[{"selector":",.ToggleSwitch-track *","declarations":1},{"selector":".ToggleSwitch-track","declarations":1}]},"selectors":{"total":2,"type":0,"class":2,"id":0,"pseudoClass":0,"pseudoElement":0,"values":[".ToggleSwitch-track",".ToggleSwitch-track *"],"specificity":{"max":10,"average":10}},"declarations":{"total":2,"unique":1,"uniqueToTotalRatio":0.5,"properties":{"transition":["none","none"]}}},{"value":"(prefers-reduced-motion)","rules":{"total":1,"size":{"graph":[1],"max":1,"average":1},"selectorByRuleSizes":[{"selector":".ToggleSwitch-knob","declarations":1}]},"selectors":{"total":1,"type":0,"class":1,"id":0,"pseudoClass":0,"pseudoElement":0,"values":[".ToggleSwitch-knob"],"specificity":{"max":10,"average":10}},"declarations":{"total":1,"unique":1,"uniqueToTotalRatio":1,"properties":{"transition":["none"]}}}]}}
1
+ {"size":4851,"gzipSize":1040,"humanizedSize":"5KB","humanizedGzipSize":"1KB","rules":{"total":40,"size":{"graph":[1,3,1,1,2,2,18,1,8,1,1,2,1,1,1,2,1,1,3,1,1,4,1,2,1,1,1,5,6,6,13,1,5,1,2,1,2,2,1,1],"max":18,"average":2.725},"selectorByRuleSizes":[{"selector":".ToggleSwitch-track","declarations":18},{"selector":".ToggleSwitch-knob","declarations":13},{"selector":".ToggleSwitch-track::before","declarations":8},{"selector":".ToggleSwitch-circleIcon","declarations":6},{"selector":".ToggleSwitch-lineIcon","declarations":6},{"selector":".ToggleSwitch-status","declarations":5},{"selector":".ToggleSwitch-icons","declarations":5},{"selector":".ToggleSwitch-track[aria-disabled=true]","declarations":4},{"selector":".ToggleSwitch-track[aria-checked=true] .ToggleSwitch-knob","declarations":3},{"selector":".ToggleSwitch","declarations":3},{"selector":".ToggleSwitch-statusOff","declarations":2},{"selector":".ToggleSwitch-statusOn","declarations":2},{"selector":".ToggleSwitch--small .ToggleSwitch-track","declarations":2},{"selector":".ToggleSwitch-track[aria-disabled=true] .ToggleSwitch-knob","declarations":2},{"selector":".ToggleSwitch-track[aria-checked=true]","declarations":2},{"selector":".ToggleSwitch-track[aria-checked=true][aria-disabled=true]","declarations":2},{"selector":".ToggleSwitch--checked .ToggleSwitch-statusOff","declarations":2},{"selector":".ToggleSwitch--checked .ToggleSwitch-statusOn","declarations":2},{"selector":".ToggleSwitch--statusAtEnd .ToggleSwitch-status","declarations":1},{"selector":".ToggleSwitch--statusAtEnd","declarations":1},{"selector":".ToggleSwitch--disabled .ToggleSwitch-status","declarations":1},{"selector":".ToggleSwitch--small .ToggleSwitch-status","declarations":1},{"selector":".ToggleSwitch-knob","declarations":1},{"selector":".ToggleSwitch-track[aria-disabled=true] .ToggleSwitch-circleIcon","declarations":1},{"selector":".ToggleSwitch-track[aria-disabled=true] .ToggleSwitch-lineIcon","declarations":1},{"selector":".ToggleSwitch-track[aria-disabled=true] .ToggleSwitch-knob:hover,.ToggleSwitch-track[aria-disabled=true] .ToggleSwitch-knob:active","declarations":1},{"selector":".ToggleSwitch-track[aria-disabled=true]:hover .ToggleSwitch-knob,.ToggleSwitch-track[aria-disabled=true]:active .ToggleSwitch-knob","declarations":1},{"selector":".ToggleSwitch-track[aria-checked=true] .ToggleSwitch-circleIcon","declarations":1},{"selector":".ToggleSwitch-track[aria-checked=true] .ToggleSwitch-lineIcon","declarations":1},{"selector":".ToggleSwitch-track[aria-checked=true]:active","declarations":1},{"selector":".ToggleSwitch-track[aria-checked=true]:hover","declarations":1},{"selector":".ToggleSwitch-track[aria-checked=true][aria-disabled=true] .ToggleSwitch-knob","declarations":1},{"selector":".ToggleSwitch-track[aria-checked=true][aria-disabled=true]:hover .ToggleSwitch-knob,.ToggleSwitch-track[aria-checked=true][aria-disabled=true]:active .ToggleSwitch-knob","declarations":1},{"selector":".ToggleSwitch-track[aria-checked=true][aria-disabled=true]:hover,.ToggleSwitch-track[aria-checked=true][aria-disabled=true]:active","declarations":1},{"selector":".ToggleSwitch-track *","declarations":1},{"selector":".ToggleSwitch-track","declarations":1},{"selector":".ToggleSwitch-track:focus,.ToggleSwitch-track:focus-visible","declarations":1},{"selector":".ToggleSwitch:active .ToggleSwitch-knob","declarations":1},{"selector":".ToggleSwitch:hover .ToggleSwitch-knob","declarations":1},{"selector":".ToggleSwitch.ToggleSwitch","declarations":1}]},"selectors":{"total":45,"type":0,"class":45,"id":0,"pseudoClass":14,"pseudoElement":1,"values":[".ToggleSwitch.ToggleSwitch",".ToggleSwitch",".ToggleSwitch:hover .ToggleSwitch-knob",".ToggleSwitch:active .ToggleSwitch-knob",".ToggleSwitch--checked .ToggleSwitch-statusOn",".ToggleSwitch--checked .ToggleSwitch-statusOff",".ToggleSwitch-track",".ToggleSwitch-track:focus",".ToggleSwitch-track:focus-visible",".ToggleSwitch-track::before",".ToggleSwitch-track",".ToggleSwitch-track *",".ToggleSwitch-track[aria-checked=true][aria-disabled=true]",".ToggleSwitch-track[aria-checked=true][aria-disabled=true]:hover",".ToggleSwitch-track[aria-checked=true][aria-disabled=true]:active",".ToggleSwitch-track[aria-checked=true][aria-disabled=true]:hover .ToggleSwitch-knob",".ToggleSwitch-track[aria-checked=true][aria-disabled=true]:active .ToggleSwitch-knob",".ToggleSwitch-track[aria-checked=true][aria-disabled=true] .ToggleSwitch-knob",".ToggleSwitch-track[aria-checked=true]",".ToggleSwitch-track[aria-checked=true]:hover",".ToggleSwitch-track[aria-checked=true]:active",".ToggleSwitch-track[aria-checked=true] .ToggleSwitch-knob",".ToggleSwitch-track[aria-checked=true] .ToggleSwitch-lineIcon",".ToggleSwitch-track[aria-checked=true] .ToggleSwitch-circleIcon",".ToggleSwitch-track[aria-disabled=true]",".ToggleSwitch-track[aria-disabled=true]:hover .ToggleSwitch-knob",".ToggleSwitch-track[aria-disabled=true]:active .ToggleSwitch-knob",".ToggleSwitch-track[aria-disabled=true] .ToggleSwitch-knob",".ToggleSwitch-track[aria-disabled=true] .ToggleSwitch-knob:hover",".ToggleSwitch-track[aria-disabled=true] .ToggleSwitch-knob:active",".ToggleSwitch-track[aria-disabled=true] .ToggleSwitch-lineIcon",".ToggleSwitch-track[aria-disabled=true] .ToggleSwitch-circleIcon",".ToggleSwitch-icons",".ToggleSwitch-lineIcon",".ToggleSwitch-circleIcon",".ToggleSwitch-knob",".ToggleSwitch-knob",".ToggleSwitch-status",".ToggleSwitch--small .ToggleSwitch-status",".ToggleSwitch--small .ToggleSwitch-track",".ToggleSwitch--disabled .ToggleSwitch-status",".ToggleSwitch-statusOn",".ToggleSwitch-statusOff",".ToggleSwitch--statusAtEnd",".ToggleSwitch--statusAtEnd .ToggleSwitch-status"],"specificity":{"max":50,"average":23.8}},"declarations":{"total":109,"unique":78,"uniqueToTotalRatio":0.7155963302752294,"properties":{"display":["inline-flex","inline-flex","block","flex"],"align-items":["center","center"],"gap":["8px"],"background-color":["var(--color-btn-hover-bg)","var(--color-btn-active-bg)","var(--color-switch-track-bg)","var(--color-canvas-subtle)","var(--color-canvas-subtle)","var(--color-switch-knob-checked-disabled-bg)","var(--color-switch-knob-checked-disabled-bg)","var(--color-switch-track-checked-bg)","var(--color-switch-track-checked-hover-bg)","var(--color-switch-track-checked-active-bg)","var(--color-switch-knob-checked-bg)","var(--color-canvas-subtle)","var(--color-btn-bg)","var(--color-btn-bg)","var(--color-btn-bg)"],"height":["auto","0","32px","100%","100%","24px","0","auto"],"visibility":["visible","hidden","hidden","visible"],"position":["relative","absolute","absolute","relative"],"width":["64px","100%","100%","50%","48px"],"padding":["0"],"overflow":["hidden","hidden"],"text-decoration":["none"],"cursor":["pointer","not-allowed"],"-webkit-user-select":["none"],"user-select":["none"],"border":["1px solid var(--color-switch-track-border)","0","1px solid var(--color-switch-track-border)"],"border-radius":["6px","6px"],"transition-timing-function":["cubic-bezier(0.5, 1, 0.89, 1)","cubic-bezier(0.5, 1, 0.89, 1)"],"transition-duration":["80ms","80ms","80ms","80ms"],"transition-property":["background-color,border-color","none","transform","transform","transform"],"-webkit-appearance":["none"],"appearance":["none"],"outline-offset":["0"],"top":["50%","-1px"],"left":["50%"],"min-height":["44px"],"content":["\"\""],"transform":["translateX(-50%) translateY(-50%)","translateX(calc(100% + 1px))","translateX(0%)","translateX(100%)","translateX(-100%)","translateX(0)","translateX(-1px)"],"transition":["none","none","none"],"border-color":["var(--color-border-subtle)","var(--color-switch-track-checked-border)","var(--color-border-subtle)","var(--color-border-default)"],"box-shadow":["none","var(--color-shadow-medium),var(--color-btn-inset-shadow)"],"color":["var(--color-fg-subtle)","var(--color-fg-subtle)","var(--color-accent-fg)","var(--color-fg-default)","var(--color-fg-default)","var(--color-fg-muted)"],"line-height":["0","0","1.5"],"flex":["1 0 50%","1 0 50%"],"bottom":["-1px"],"z-index":["1"],"font-size":["14px","12px"],"text-align":["right","left"],"flex-direction":["row-reverse"]}},"mediaQueries":{"total":3,"unique":2,"values":["(pointer: coarse)","(prefers-reduced-motion)","(prefers-reduced-motion)"],"contents":[{"value":"(pointer: coarse)","rules":{"total":1,"size":{"graph":[8],"max":8,"average":8},"selectorByRuleSizes":[{"selector":".ToggleSwitch-track::before","declarations":8}]},"selectors":{"total":1,"type":0,"class":1,"id":0,"pseudoClass":0,"pseudoElement":1,"values":[".ToggleSwitch-track::before"],"specificity":{"max":11,"average":11}},"declarations":{"total":8,"unique":8,"uniqueToTotalRatio":1,"properties":{"position":["absolute"],"top":["50%"],"left":["50%"],"width":["100%"],"height":["100%"],"min-height":["44px"],"content":["\"\""],"transform":["translateX(-50%) translateY(-50%)"]}}},{"value":"(prefers-reduced-motion)","rules":{"total":2,"size":{"graph":[1,1],"max":1,"average":1},"selectorByRuleSizes":[{"selector":",.ToggleSwitch-track *","declarations":1},{"selector":".ToggleSwitch-track","declarations":1}]},"selectors":{"total":2,"type":0,"class":2,"id":0,"pseudoClass":0,"pseudoElement":0,"values":[".ToggleSwitch-track",".ToggleSwitch-track *"],"specificity":{"max":10,"average":10}},"declarations":{"total":2,"unique":1,"uniqueToTotalRatio":0.5,"properties":{"transition":["none","none"]}}},{"value":"(prefers-reduced-motion)","rules":{"total":1,"size":{"graph":[1],"max":1,"average":1},"selectorByRuleSizes":[{"selector":".ToggleSwitch-knob","declarations":1}]},"selectors":{"total":1,"type":0,"class":1,"id":0,"pseudoClass":0,"pseudoElement":0,"values":[".ToggleSwitch-knob"],"specificity":{"max":10,"average":10}},"declarations":{"total":1,"unique":1,"uniqueToTotalRatio":1,"properties":{"transition":["none"]}}}]}}
@@ -1,2 +1,2 @@
1
- .ToggleSwitch{align-items:center;display:inline-flex;gap:8px}.ToggleSwitch:hover .ToggleSwitch-knob{background-color:var(--color-btn-hover-bg)}.ToggleSwitch:active .ToggleSwitch-knob{background-color:var(--color-btn-active-bg)}.ToggleSwitch-track{position:relative;display:block;width:64px;height:32px;padding:0;overflow:hidden;text-decoration:none;cursor:pointer;-webkit-user-select:none;user-select:none;background-color:var(--color-switch-track-bg);border:1px solid var(--color-switch-track-border);border-radius:6px;transition-timing-function:cubic-bezier(0.5, 1, 0.89, 1);transition-duration:80ms;transition-property:background-color,border-color;-webkit-appearance:none;appearance:none}.ToggleSwitch-track:focus,.ToggleSwitch-track:focus-visible{outline-offset:0}@media(pointer: coarse){.ToggleSwitch-track::before{position:absolute;top:50%;left:50%;width:100%;height:100%;min-height:44px;content:"";transform:translateX(-50%) translateY(-50%)}}@media(prefers-reduced-motion){.ToggleSwitch-track{transition:none}.ToggleSwitch-track *{transition:none}}.ToggleSwitch-track[aria-checked=true][aria-disabled=true]{background-color:var(--color-canvas-subtle);border-color:var(--color-border-subtle)}.ToggleSwitch-track[aria-checked=true][aria-disabled=true]:hover,.ToggleSwitch-track[aria-checked=true][aria-disabled=true]:active{background-color:var(--color-canvas-subtle)}.ToggleSwitch-track[aria-checked=true][aria-disabled=true]:hover .ToggleSwitch-knob,.ToggleSwitch-track[aria-checked=true][aria-disabled=true]:active .ToggleSwitch-knob{background-color:var(--color-switch-knob-checked-disabled-bg)}.ToggleSwitch-track[aria-checked=true][aria-disabled=true] .ToggleSwitch-knob{background-color:var(--color-switch-knob-checked-disabled-bg)}.ToggleSwitch-track[aria-checked=true]{background-color:var(--color-switch-track-checked-bg);border-color:var(--color-switch-track-checked-border)}.ToggleSwitch-track[aria-checked=true]:hover{background-color:var(--color-switch-track-checked-hover-bg)}.ToggleSwitch-track[aria-checked=true]:active{background-color:var(--color-switch-track-checked-active-bg)}.ToggleSwitch-track[aria-checked=true] .ToggleSwitch-knob{background-color:var(--color-switch-knob-checked-bg);border:0;transform:translateX(calc(100% + 1px))}.ToggleSwitch-track[aria-checked=true] .ToggleSwitch-lineIcon{transform:translateX(0%)}.ToggleSwitch-track[aria-checked=true] .ToggleSwitch-circleIcon{transform:translateX(100%)}.ToggleSwitch-track[aria-disabled=true]{cursor:not-allowed;background-color:var(--color-canvas-subtle);border-color:var(--color-border-subtle);transition-property:none}.ToggleSwitch-track[aria-disabled=true]:hover .ToggleSwitch-knob,.ToggleSwitch-track[aria-disabled=true]:active .ToggleSwitch-knob{background-color:var(--color-btn-bg)}.ToggleSwitch-track[aria-disabled=true] .ToggleSwitch-knob{border-color:var(--color-border-default);box-shadow:none}.ToggleSwitch-track[aria-disabled=true] .ToggleSwitch-knob:hover,.ToggleSwitch-track[aria-disabled=true] .ToggleSwitch-knob:active{background-color:var(--color-btn-bg)}.ToggleSwitch-track[aria-disabled=true] .ToggleSwitch-lineIcon{color:var(--color-fg-subtle)}.ToggleSwitch-track[aria-disabled=true] .ToggleSwitch-circleIcon{color:var(--color-fg-subtle)}.ToggleSwitch-icons{display:flex;align-items:center;width:100%;height:100%;overflow:hidden}.ToggleSwitch-lineIcon{line-height:0;color:var(--color-accent-fg);transition-duration:80ms;transition-property:transform;transform:translateX(-100%);flex:1 0 50%}.ToggleSwitch-circleIcon{line-height:0;color:var(--color-fg-default);transition-duration:80ms;transition-property:transform;transform:translateX(0);flex:1 0 50%}.ToggleSwitch-knob{position:absolute;top:-1px;bottom:-1px;z-index:1;width:50%;background-color:var(--color-btn-bg);border:1px solid var(--color-switch-track-border);border-radius:6px;box-shadow:var(--color-shadow-medium),var(--color-btn-inset-shadow);transition-timing-function:cubic-bezier(0.5, 1, 0.89, 1);transition-duration:80ms;transition-property:transform;transform:translateX(-1px)}@media(prefers-reduced-motion){.ToggleSwitch-knob{transition:none}}.ToggleSwitch-status{position:relative;font-size:14px;line-height:1.5;color:var(--color-fg-default);text-align:right}.ToggleSwitch--small .ToggleSwitch-status{font-size:12px}.ToggleSwitch--small .ToggleSwitch-track{width:48px;height:24px}.ToggleSwitch--disabled .ToggleSwitch-status{color:var(--color-fg-muted)}.ToggleSwitch-statusOn{height:0;visibility:hidden}.ToggleSwitch-statusOff{height:auto;visibility:visible}.ToggleSwitch--statusAtEnd{flex-direction:row-reverse}.ToggleSwitch--statusAtEnd .ToggleSwitch-status{text-align:left}
1
+ .ToggleSwitch.ToggleSwitch{display:inline-flex}.ToggleSwitch{align-items:center;display:inline-flex;gap:8px}.ToggleSwitch:hover .ToggleSwitch-knob{background-color:var(--color-btn-hover-bg)}.ToggleSwitch:active .ToggleSwitch-knob{background-color:var(--color-btn-active-bg)}.ToggleSwitch--checked .ToggleSwitch-statusOn{height:auto;visibility:visible}.ToggleSwitch--checked .ToggleSwitch-statusOff{height:0;visibility:hidden}.ToggleSwitch-track{position:relative;display:block;width:64px;height:32px;padding:0;overflow:hidden;text-decoration:none;cursor:pointer;-webkit-user-select:none;user-select:none;background-color:var(--color-switch-track-bg);border:1px solid var(--color-switch-track-border);border-radius:6px;transition-timing-function:cubic-bezier(0.5, 1, 0.89, 1);transition-duration:80ms;transition-property:background-color,border-color;-webkit-appearance:none;appearance:none}.ToggleSwitch-track:focus,.ToggleSwitch-track:focus-visible{outline-offset:0}@media(pointer: coarse){.ToggleSwitch-track::before{position:absolute;top:50%;left:50%;width:100%;height:100%;min-height:44px;content:"";transform:translateX(-50%) translateY(-50%)}}@media(prefers-reduced-motion){.ToggleSwitch-track{transition:none}.ToggleSwitch-track *{transition:none}}.ToggleSwitch-track[aria-checked=true][aria-disabled=true]{background-color:var(--color-canvas-subtle);border-color:var(--color-border-subtle)}.ToggleSwitch-track[aria-checked=true][aria-disabled=true]:hover,.ToggleSwitch-track[aria-checked=true][aria-disabled=true]:active{background-color:var(--color-canvas-subtle)}.ToggleSwitch-track[aria-checked=true][aria-disabled=true]:hover .ToggleSwitch-knob,.ToggleSwitch-track[aria-checked=true][aria-disabled=true]:active .ToggleSwitch-knob{background-color:var(--color-switch-knob-checked-disabled-bg)}.ToggleSwitch-track[aria-checked=true][aria-disabled=true] .ToggleSwitch-knob{background-color:var(--color-switch-knob-checked-disabled-bg)}.ToggleSwitch-track[aria-checked=true]{background-color:var(--color-switch-track-checked-bg);border-color:var(--color-switch-track-checked-border)}.ToggleSwitch-track[aria-checked=true]:hover{background-color:var(--color-switch-track-checked-hover-bg)}.ToggleSwitch-track[aria-checked=true]:active{background-color:var(--color-switch-track-checked-active-bg)}.ToggleSwitch-track[aria-checked=true] .ToggleSwitch-knob{background-color:var(--color-switch-knob-checked-bg);border:0;transform:translateX(calc(100% + 1px))}.ToggleSwitch-track[aria-checked=true] .ToggleSwitch-lineIcon{transform:translateX(0%)}.ToggleSwitch-track[aria-checked=true] .ToggleSwitch-circleIcon{transform:translateX(100%)}.ToggleSwitch-track[aria-disabled=true]{cursor:not-allowed;background-color:var(--color-canvas-subtle);border-color:var(--color-border-subtle);transition-property:none}.ToggleSwitch-track[aria-disabled=true]:hover .ToggleSwitch-knob,.ToggleSwitch-track[aria-disabled=true]:active .ToggleSwitch-knob{background-color:var(--color-btn-bg)}.ToggleSwitch-track[aria-disabled=true] .ToggleSwitch-knob{border-color:var(--color-border-default);box-shadow:none}.ToggleSwitch-track[aria-disabled=true] .ToggleSwitch-knob:hover,.ToggleSwitch-track[aria-disabled=true] .ToggleSwitch-knob:active{background-color:var(--color-btn-bg)}.ToggleSwitch-track[aria-disabled=true] .ToggleSwitch-lineIcon{color:var(--color-fg-subtle)}.ToggleSwitch-track[aria-disabled=true] .ToggleSwitch-circleIcon{color:var(--color-fg-subtle)}.ToggleSwitch-icons{display:flex;align-items:center;width:100%;height:100%;overflow:hidden}.ToggleSwitch-lineIcon{line-height:0;color:var(--color-accent-fg);transition-duration:80ms;transition-property:transform;transform:translateX(-100%);flex:1 0 50%}.ToggleSwitch-circleIcon{line-height:0;color:var(--color-fg-default);transition-duration:80ms;transition-property:transform;transform:translateX(0);flex:1 0 50%}.ToggleSwitch-knob{position:absolute;top:-1px;bottom:-1px;z-index:1;width:50%;background-color:var(--color-btn-bg);border:1px solid var(--color-switch-track-border);border-radius:6px;box-shadow:var(--color-shadow-medium),var(--color-btn-inset-shadow);transition-timing-function:cubic-bezier(0.5, 1, 0.89, 1);transition-duration:80ms;transition-property:transform;transform:translateX(-1px)}@media(prefers-reduced-motion){.ToggleSwitch-knob{transition:none}}.ToggleSwitch-status{position:relative;font-size:14px;line-height:1.5;color:var(--color-fg-default);text-align:right}.ToggleSwitch--small .ToggleSwitch-status{font-size:12px}.ToggleSwitch--small .ToggleSwitch-track{width:48px;height:24px}.ToggleSwitch--disabled .ToggleSwitch-status{color:var(--color-fg-muted)}.ToggleSwitch-statusOn{height:0;visibility:hidden}.ToggleSwitch-statusOff{height:auto;visibility:visible}.ToggleSwitch--statusAtEnd{flex-direction:row-reverse}.ToggleSwitch--statusAtEnd .ToggleSwitch-status{text-align:left}
2
2
  /*# sourceMappingURL=toggle-switch.css.map */
@@ -1 +1 @@
1
- {"version":3,"sources":["file:///home/runner/work/css/css/src/toggle-switch/index.scss%23sass"],"names":[],"mappings":"AA2iBA,cAAA,kBAAA,CAAA,mBAAA,CAAA,OAAA,CAAA,uCAAA,0CAAA,CAAA,wCAAA,2CAAA,CAAA,oBAAA,iBAAA,CAAA,aAAA,CAAA,UAAA,CAAA,WAAA,CAAA,SAAA,CAAA,eAAA,CAAA,oBAAA,CAAA,cAAA,CAAA,wBAAA,CAAA,gBAAA,CAAA,6CAAA,CAAA,iDAAA,CAAA,iBAAA,CAAA,wDAAA,CAAA,wBAAA,CAAA,iDAAA,CAAA,uBAAA,CAAA,eAAA,CAAA,4DAAA,gBAAA,CAAA,wBAAA,4BAAA,iBAAA,CAAA,OAAA,CAAA,QAAA,CAAA,UAAA,CAAA,WAAA,CAAA,eAAA,CAAA,UAAA,CAAA,2CAAA,CAAA,CAAA,+BAAA,oBAAA,eAAA,CAAA,sBAAA,eAAA,CAAA,CAAA,2DAAA,2CAAA,CAAA,uCAAA,CAAA,mIAAA,2CAAA,CAAA,yKAAA,6DAAA,CAAA,8EAAA,6DAAA,CAAA,uCAAA,qDAAA,CAAA,qDAAA,CAAA,6CAAA,2DAAA,CAAA,8CAAA,4DAAA,CAAA,0DAAA,oDAAA,CAAA,QAAA,CAAA,sCAAA,CAAA,8DAAA,wBAAA,CAAA,gEAAA,0BAAA,CAAA,wCAAA,kBAAA,CAAA,2CAAA,CAAA,uCAAA,CAAA,wBAAA,CAAA,mIAAA,oCAAA,CAAA,2DAAA,wCAAA,CAAA,eAAA,CAAA,mIAAA,oCAAA,CAAA,+DAAA,4BAAA,CAAA,iEAAA,4BAAA,CAAA,oBAAA,YAAA,CAAA,kBAAA,CAAA,UAAA,CAAA,WAAA,CAAA,eAAA,CAAA,uBAAA,aAAA,CAAA,4BAAA,CAAA,wBAAA,CAAA,6BAAA,CAAA,2BAAA,CAAA,YAAA,CAAA,yBAAA,aAAA,CAAA,6BAAA,CAAA,wBAAA,CAAA,6BAAA,CAAA,uBAAA,CAAA,YAAA,CAAA,mBAAA,iBAAA,CAAA,QAAA,CAAA,WAAA,CAAA,SAAA,CAAA,SAAA,CAAA,oCAAA,CAAA,iDAAA,CAAA,iBAAA,CAAA,mEAAA,CAAA,wDAAA,CAAA,wBAAA,CAAA,6BAAA,CAAA,0BAAA,CAAA,+BAAA,mBAAA,eAAA,CAAA,CAAA,qBAAA,iBAAA,CAAA,cAAA,CAAA,eAAA,CAAA,6BAAA,CAAA,gBAAA,CAAA,0CAAA,cAAA,CAAA,yCAAA,UAAA,CAAA,WAAA,CAAA,6CAAA,2BAAA,CAAA,uBAAA,QAAA,CAAA,iBAAA,CAAA,wBAAA,WAAA,CAAA,kBAAA,CAAA,2BAAA,0BAAA,CAAA,gDAAA,eAAA","file":"toggle-switch.css"}
1
+ {"version":3,"sources":["file:///home/runner/work/css/css/src/toggle-switch/index.scss%23sass"],"names":[],"mappings":"AA6iBA,2BAAA,mBAAA,CAAA,cAAA,kBAAA,CAAA,mBAAA,CAAA,OAAA,CAAA,uCAAA,0CAAA,CAAA,wCAAA,2CAAA,CAAA,8CAAA,WAAA,CAAA,kBAAA,CAAA,+CAAA,QAAA,CAAA,iBAAA,CAAA,oBAAA,iBAAA,CAAA,aAAA,CAAA,UAAA,CAAA,WAAA,CAAA,SAAA,CAAA,eAAA,CAAA,oBAAA,CAAA,cAAA,CAAA,wBAAA,CAAA,gBAAA,CAAA,6CAAA,CAAA,iDAAA,CAAA,iBAAA,CAAA,wDAAA,CAAA,wBAAA,CAAA,iDAAA,CAAA,uBAAA,CAAA,eAAA,CAAA,4DAAA,gBAAA,CAAA,wBAAA,4BAAA,iBAAA,CAAA,OAAA,CAAA,QAAA,CAAA,UAAA,CAAA,WAAA,CAAA,eAAA,CAAA,UAAA,CAAA,2CAAA,CAAA,CAAA,+BAAA,oBAAA,eAAA,CAAA,sBAAA,eAAA,CAAA,CAAA,2DAAA,2CAAA,CAAA,uCAAA,CAAA,mIAAA,2CAAA,CAAA,yKAAA,6DAAA,CAAA,8EAAA,6DAAA,CAAA,uCAAA,qDAAA,CAAA,qDAAA,CAAA,6CAAA,2DAAA,CAAA,8CAAA,4DAAA,CAAA,0DAAA,oDAAA,CAAA,QAAA,CAAA,sCAAA,CAAA,8DAAA,wBAAA,CAAA,gEAAA,0BAAA,CAAA,wCAAA,kBAAA,CAAA,2CAAA,CAAA,uCAAA,CAAA,wBAAA,CAAA,mIAAA,oCAAA,CAAA,2DAAA,wCAAA,CAAA,eAAA,CAAA,mIAAA,oCAAA,CAAA,+DAAA,4BAAA,CAAA,iEAAA,4BAAA,CAAA,oBAAA,YAAA,CAAA,kBAAA,CAAA,UAAA,CAAA,WAAA,CAAA,eAAA,CAAA,uBAAA,aAAA,CAAA,4BAAA,CAAA,wBAAA,CAAA,6BAAA,CAAA,2BAAA,CAAA,YAAA,CAAA,yBAAA,aAAA,CAAA,6BAAA,CAAA,wBAAA,CAAA,6BAAA,CAAA,uBAAA,CAAA,YAAA,CAAA,mBAAA,iBAAA,CAAA,QAAA,CAAA,WAAA,CAAA,SAAA,CAAA,SAAA,CAAA,oCAAA,CAAA,iDAAA,CAAA,iBAAA,CAAA,mEAAA,CAAA,wDAAA,CAAA,wBAAA,CAAA,6BAAA,CAAA,0BAAA,CAAA,+BAAA,mBAAA,eAAA,CAAA,CAAA,qBAAA,iBAAA,CAAA,cAAA,CAAA,eAAA,CAAA,6BAAA,CAAA,gBAAA,CAAA,0CAAA,cAAA,CAAA,yCAAA,UAAA,CAAA,WAAA,CAAA,6CAAA,2BAAA,CAAA,uBAAA,QAAA,CAAA,iBAAA,CAAA,wBAAA,WAAA,CAAA,kBAAA,CAAA,2BAAA,0BAAA,CAAA,gDAAA,eAAA","file":"toggle-switch.css"}
@@ -158,5 +158,7 @@
158
158
 
159
159
  .btn-large-mktg {
160
160
  // stylelint-disable-next-line primer/spacing
161
- padding: 20px 30px 23px !important;
161
+ padding: 16px 30px 20px !important;
162
+ // stylelint-disable-next-line primer/typography
163
+ font-size: 1.25rem;
162
164
  }
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@primer/css",
3
- "version": "20.2.0",
3
+ "version": "20.2.1",
4
4
  "description": "The CSS implementation of GitHub's Primer Design System",
5
5
  "homepage": "https://primer.style/css",
6
6
  "author": "GitHub, Inc.",
@@ -1,3 +1,9 @@
1
+ // Catalyst in dotcom applies a display: block to all web component elements. This
2
+ // rule overrides it so the status label and toggle switch are laid out correctly.
3
+ .ToggleSwitch.ToggleSwitch {
4
+ display: inline-flex;
5
+ }
6
+
1
7
  .ToggleSwitch {
2
8
  align-items: center;
3
9
  display: inline-flex;
@@ -16,6 +22,18 @@
16
22
  }
17
23
  }
18
24
 
25
+ .ToggleSwitch--checked {
26
+ .ToggleSwitch-statusOn {
27
+ height: auto;
28
+ visibility: visible;
29
+ }
30
+
31
+ .ToggleSwitch-statusOff {
32
+ height: 0;
33
+ visibility: hidden;
34
+ }
35
+ }
36
+
19
37
  .ToggleSwitch-track {
20
38
  position: relative;
21
39
  display: block;