@primer/css 21.0.7 → 21.0.8-rc.41e7fb87
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.
- package/CHANGELOG.md +6 -0
- package/dist/alerts.css +1 -1
- package/dist/alerts.css.map +1 -1
- package/dist/autocomplete.css +1 -1
- package/dist/autocomplete.css.map +1 -1
- package/dist/avatars.css +1 -1
- package/dist/avatars.css.map +1 -1
- package/dist/blankslate.css +1 -1
- package/dist/blankslate.css.map +1 -1
- package/dist/box.css +1 -1
- package/dist/box.css.map +1 -1
- package/dist/breadcrumb.css +1 -1
- package/dist/breadcrumb.css.map +1 -1
- package/dist/color-modes.css +1 -1
- package/dist/color-modes.css.map +1 -1
- package/dist/core.css +1 -1
- package/dist/core.css.map +1 -1
- package/dist/dropdown.css +1 -1
- package/dist/dropdown.css.map +1 -1
- package/dist/forms.css +1 -1
- package/dist/forms.css.map +1 -1
- package/dist/labels.css +1 -1
- package/dist/labels.css.map +1 -1
- package/dist/layout.css +1 -1
- package/dist/layout.css.map +1 -1
- package/dist/links.css +1 -1
- package/dist/links.css.map +1 -1
- package/dist/meta.json +55 -55
- package/dist/navigation.css +1 -1
- package/dist/navigation.css.map +1 -1
- package/dist/overlay.css +1 -1
- package/dist/overlay.css.map +1 -1
- package/dist/popover.css +1 -1
- package/dist/popover.css.map +1 -1
- package/dist/primer.css +3 -3
- package/dist/primer.css.map +1 -1
- package/dist/primitives.css +1 -1
- package/dist/primitives.css.map +1 -1
- package/dist/product.css +1 -1
- package/dist/product.css.map +1 -1
- package/dist/progress.css +1 -1
- package/dist/progress.css.map +1 -1
- package/dist/stats/alerts.json +1 -1
- package/dist/stats/autocomplete.json +1 -1
- package/dist/stats/avatars.json +1 -1
- package/dist/stats/blankslate.json +1 -1
- package/dist/stats/box.json +1 -1
- package/dist/stats/breadcrumb.json +1 -1
- package/dist/stats/color-modes.json +1 -1
- package/dist/stats/core.json +1 -1
- package/dist/stats/dropdown.json +1 -1
- package/dist/stats/forms.json +1 -1
- package/dist/stats/labels.json +1 -1
- package/dist/stats/layout.json +1 -1
- package/dist/stats/links.json +1 -1
- package/dist/stats/navigation.json +1 -1
- package/dist/stats/overlay.json +1 -1
- package/dist/stats/popover.json +1 -1
- package/dist/stats/primer.json +1 -1
- package/dist/stats/product.json +1 -1
- package/dist/stats/progress.json +1 -1
- package/dist/stats/subhead.json +1 -1
- package/dist/stats/timeline.json +1 -1
- package/dist/stats/toggle-switch.json +1 -1
- package/dist/stats/truncate.json +1 -1
- package/dist/subhead.css +1 -1
- package/dist/subhead.css.map +1 -1
- package/dist/timeline.css +1 -1
- package/dist/timeline.css.map +1 -1
- package/dist/toggle-switch.css +1 -1
- package/dist/toggle-switch.css.map +1 -1
- package/dist/truncate.css +1 -1
- package/dist/truncate.css.map +1 -1
- package/migrations/v16.md +300 -0
- package/migrations/v18.md +80 -0
- package/package.json +36 -36
package/dist/stats/subhead.json
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"size":
|
|
1
|
+
{"size":596,"gzipSize":308,"humanizedSize":"596B","humanizedGzipSize":"308B","rules":{"total":7,"size":{"graph":[6,1,4,2,4,4,1],"max":6,"average":3.142857142857143},"selectorByRuleSizes":[{"selector":".Subhead","declarations":6},{"selector":".Subhead-actions","declarations":4},{"selector":".Subhead-description","declarations":4},{"selector":".Subhead-heading","declarations":4},{"selector":".Subhead-heading--danger","declarations":2},{"selector":".Subhead-actions+.Subhead-description","declarations":1},{"selector":".Subhead--spacious","declarations":1}]},"selectors":{"total":7,"type":0,"class":7,"id":0,"pseudoClass":0,"pseudoElement":0,"values":[".Subhead",".Subhead--spacious",".Subhead-heading",".Subhead-heading--danger",".Subhead-description",".Subhead-actions",".Subhead-actions+.Subhead-description"],"specificity":{"max":20,"average":11.428571428571429}},"declarations":{"total":22,"unique":21,"uniqueToTotalRatio":0.9545454545454546,"properties":{"border-bottom":["max(1px, 0.0625rem) solid var(--color-border-muted)"],"display":["flex"],"flex-flow":["row wrap"],"justify-content":["flex-end","flex-end"],"margin-bottom":["1rem"],"padding-bottom":["0.5rem"],"margin-top":["2.5rem","0.25rem"],"flex":["1 1 auto","1 100%"],"font-size":["24px","0.875rem"],"font-weight":["400","600"],"order":["0","2","1"],"color":["var(--color-danger-fg)","var(--color-fg-muted)"],"align-self":["center"],"margin":["0.25rem 0 0.25rem 0.25rem"]}},"mediaQueries":{"total":0,"unique":0,"values":[],"contents":[]}}
|
package/dist/stats/timeline.json
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"size":
|
|
1
|
+
{"size":1544,"gzipSize":565,"humanizedSize":"2KB","humanizedGzipSize":"565B","rules":{"total":11,"size":{"graph":[4,8,2,14,3,5,3,9,2,1,6],"max":14,"average":5.181818181818182},"selectorByRuleSizes":[{"selector":".TimelineItem-badge","declarations":14},{"selector":".TimelineItem-break","declarations":9},{"selector":".TimelineItem:before","declarations":8},{"selector":".TimelineItem--condensed .TimelineItem-badge","declarations":6},{"selector":".TimelineItem-body","declarations":5},{"selector":".TimelineItem","declarations":4},{"selector":".TimelineItem-avatar","declarations":3},{"selector":".TimelineItem-badge--success","declarations":3},{"selector":".TimelineItem--condensed","declarations":2},{"selector":".TimelineItem:target .TimelineItem-badge","declarations":2},{"selector":".TimelineItem--condensed:last-child","declarations":1}]},"selectors":{"total":11,"type":0,"class":11,"id":0,"pseudoClass":2,"pseudoElement":1,"values":[".TimelineItem",".TimelineItem:before",".TimelineItem:target .TimelineItem-badge",".TimelineItem-badge",".TimelineItem-badge--success",".TimelineItem-body",".TimelineItem-avatar",".TimelineItem-break",".TimelineItem--condensed",".TimelineItem--condensed:last-child",".TimelineItem--condensed .TimelineItem-badge"],"specificity":{"max":30,"average":13.727272727272727}},"declarations":{"total":57,"unique":47,"uniqueToTotalRatio":0.8245614035087719,"properties":{"display":["flex","block","flex"],"margin-left":["1rem","calc(2rem/-2 + 1px)","-56px"],"padding":["1rem 0"],"position":["relative","absolute","relative","absolute","relative"],"background-color":["var(--color-border-muted)","var(--color-timeline-badge-bg)","var(--color-success-fg)","var(--color-canvas-default)","var(--color-canvas-default)"],"bottom":["0"],"content":["\"\""],"left":["0","-72px"],"top":["0"],"width":["max(2px, 0.125rem)","2rem"],"border-color":["var(--color-accent-fg)"],"box-shadow":["0 0 .2em var(--color-accent-muted)"],"align-items":["center"],"border":["max(2px, 0.125rem) solid var(--color-canvas-default)","max(1px, 0.0625rem) solid rgba(0,0,0,0)","0","0"],"border-radius":["50%"],"color":["var(--color-fg-muted)","var(--color-fg-on-emphasis)","var(--color-fg-muted)","var(--color-fg-muted)"],"flex-shrink":["0"],"height":["2rem","1.5rem","1rem"],"justify-content":["center"],"margin-right":["0.5rem"],"z-index":["1","1","1"],"flex":["auto"],"margin-top":["0.25rem","0.5rem"],"max-width":["100%"],"min-width":["0"],"border-top":["max(4px, 0.25rem) solid var(--color-border-default)"],"margin":["0"],"margin-bottom":["calc(1rem*-1)","0.5rem"],"padding-bottom":["0","1rem"],"padding-top":["0.25rem"]}},"mediaQueries":{"total":0,"unique":0,"values":[],"contents":[]}}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"size":
|
|
1
|
+
{"size":4010,"gzipSize":1003,"humanizedSize":"4KB","humanizedGzipSize":"1003B","rules":{"total":35,"size":{"graph":[1,2,2,2,17,1,1,1,8,1,3,2,1,1,3,1,1,4,2,1,5,2,4,2,12,1,5,3,1,2,1,2,2,1,1],"max":17,"average":2.8285714285714287},"selectorByRuleSizes":[{"selector":".ToggleSwitch-track","declarations":17},{"selector":".ToggleSwitch-knob","declarations":12},{"selector":".ToggleSwitch-track:before","declarations":8},{"selector":".ToggleSwitch-status","declarations":5},{"selector":".ToggleSwitch-icons","declarations":5},{"selector":".ToggleSwitch-circleIcon,.ToggleSwitch-lineIcon","declarations":4},{"selector":".ToggleSwitch-track[disabled]","declarations":4},{"selector":".ToggleSwitch-statusIcon","declarations":3},{"selector":".ToggleSwitch-track[aria-pressed=true] .ToggleSwitch-knob","declarations":3},{"selector":".ToggleSwitch-track[aria-pressed=true][disabled]","declarations":3},{"selector":".ToggleSwitch-statusOff","declarations":2},{"selector":".ToggleSwitch-statusOn","declarations":2},{"selector":".ToggleSwitch--small .ToggleSwitch-track","declarations":2},{"selector":".ToggleSwitch-circleIcon","declarations":2},{"selector":".ToggleSwitch-lineIcon","declarations":2},{"selector":".ToggleSwitch-track[disabled] .ToggleSwitch-knob","declarations":2},{"selector":".ToggleSwitch-track[aria-pressed=true]","declarations":2},{"selector":".ToggleSwitch--checked .ToggleSwitch-statusOff","declarations":2},{"selector":".ToggleSwitch--checked .ToggleSwitch-statusOn","declarations":2},{"selector":".ToggleSwitch","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[disabled] .ToggleSwitch-circleIcon,.ToggleSwitch-track[disabled] .ToggleSwitch-lineIcon","declarations":1},{"selector":".ToggleSwitch-track[aria-pressed=true] .ToggleSwitch-circleIcon","declarations":1},{"selector":".ToggleSwitch-track[aria-pressed=true] .ToggleSwitch-lineIcon","declarations":1},{"selector":".ToggleSwitch-track[aria-pressed=true]:not([disabled]):active","declarations":1},{"selector":".ToggleSwitch-track[aria-pressed=true]:not([disabled]):hover","declarations":1},{"selector":".ToggleSwitch-track,.ToggleSwitch-track *","declarations":1},{"selector":".ToggleSwitch-track:active","declarations":1},{"selector":".ToggleSwitch-track:hover","declarations":1},{"selector":".ToggleSwitch-track:focus,.ToggleSwitch-track:focus-visible","declarations":1},{"selector":".ToggleSwitch,.ToggleSwitch.ToggleSwitch","declarations":1}]},"selectors":{"total":40,"type":0,"class":40,"id":0,"pseudoClass":6,"pseudoElement":1,"values":[".ToggleSwitch",".ToggleSwitch.ToggleSwitch",".ToggleSwitch",".ToggleSwitch--checked .ToggleSwitch-statusOn",".ToggleSwitch--checked .ToggleSwitch-statusOff",".ToggleSwitch-track",".ToggleSwitch-track:focus",".ToggleSwitch-track:focus-visible",".ToggleSwitch-track:hover",".ToggleSwitch-track:active",".ToggleSwitch-track:before",".ToggleSwitch-track",".ToggleSwitch-track *",".ToggleSwitch-track[aria-pressed=true][disabled]",".ToggleSwitch-track[aria-pressed=true]",".ToggleSwitch-track[aria-pressed=true]:not([disabled]):hover",".ToggleSwitch-track[aria-pressed=true]:not([disabled]):active",".ToggleSwitch-track[aria-pressed=true] .ToggleSwitch-knob",".ToggleSwitch-track[aria-pressed=true] .ToggleSwitch-lineIcon",".ToggleSwitch-track[aria-pressed=true] .ToggleSwitch-circleIcon",".ToggleSwitch-track[disabled]",".ToggleSwitch-track[disabled] .ToggleSwitch-knob",".ToggleSwitch-track[disabled] .ToggleSwitch-circleIcon",".ToggleSwitch-track[disabled] .ToggleSwitch-lineIcon",".ToggleSwitch-icons",".ToggleSwitch-lineIcon",".ToggleSwitch-circleIcon",".ToggleSwitch-lineIcon",".ToggleSwitch-circleIcon",".ToggleSwitch-knob",".ToggleSwitch-knob",".ToggleSwitch-status",".ToggleSwitch-statusIcon",".ToggleSwitch--small .ToggleSwitch-status",".ToggleSwitch--small .ToggleSwitch-track",".ToggleSwitch--disabled .ToggleSwitch-status",".ToggleSwitch-statusOn",".ToggleSwitch-statusOff",".ToggleSwitch--statusAtEnd",".ToggleSwitch--statusAtEnd .ToggleSwitch-status"],"specificity":{"max":40,"average":18.275}},"declarations":{"total":99,"unique":78,"uniqueToTotalRatio":0.7878787878787878,"properties":{"display":["inline-flex","block","flex","flex"],"align-items":["center","center"],"gap":["0.5rem"],"height":["auto","0","2rem","100%","100%","1.5rem","0","auto"],"visibility":["visible","hidden","hidden","visible"],"appearance":["none"],"background-color":["var(--color-switch-track-bg)","var(--color-switch-track-hover-bg)","var(--color-switch-track-active-bg)","var(--color-switch-track-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-switch-track-disabled-bg)","var(--color-switch-knob-bg)"],"border":["max(1px, 0.0625rem) solid var(--color-switch-track-border)","max(1px, 0.0625rem) solid var(--color-switch-knob-border)"],"border-radius":["6px","6px"],"cursor":["pointer","not-allowed"],"overflow":["hidden","hidden"],"padding":["0"],"position":["relative","absolute","absolute","relative"],"text-decoration":["none"],"transition-duration":["80ms","80ms","80ms"],"transition-property":["background-color,border-color","none","transform","transform"],"transition-timing-function":["cubic-bezier(0.5, 1, 0.89, 1)","cubic-bezier(0.5, 1, 0.89, 1)"],"-webkit-user-select":["none"],"user-select":["none"],"width":["4rem","100%","100%","50%","1rem","3rem"],"outline-offset":["1px"],"content":["\"\""],"left":["50%"],"min-height":["44px"],"top":["50%","0"],"transform":["translateX(-50%) translateY(-50%)","translateX(100%)","translateX(0)","translateX(100%)","translateX(-100%)","translateX(0)"],"transition":["none","none"],"border-color":["rgba(0,0,0,0)","rgba(0, 0, 0, 0)","var(--color-switch-knob-checked-border)","rgba(0,0,0,0)","var(--color-border-default)"],"color":["var(--color-switch-track-checked-disabled-fg)","var(--color-switch-track-disabled-fg)","var(--color-switch-track-checked-fg)","var(--color-switch-track-fg)","var(--color-fg-default)","var(--color-fg-muted)"],"box-shadow":["none","var(--color-shadow-medium),var(--color-btn-inset-shadow)"],"flex":["1 0 50%"],"line-height":["0","1.5"],"bottom":["0"],"z-index":["1"],"font-size":["0.875rem","0.75rem"],"text-align":["right","left"],"margin-top":[".063rem"],"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":{"content":["\"\""],"height":["100%"],"left":["50%"],"min-height":["44px"],"position":["absolute"],"top":["50%"],"transform":["translateX(-50%) translateY(-50%)"],"width":["100%"]}}},{"value":"(prefers-reduced-motion)","rules":{"total":1,"size":{"graph":[1],"max":1,"average":1},"selectorByRuleSizes":[{"selector":".ToggleSwitch-track,.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":1,"unique":1,"uniqueToTotalRatio":1,"properties":{"transition":["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"]}}}]}}
|
package/dist/stats/truncate.json
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"size":
|
|
1
|
+
{"size":1148,"gzipSize":342,"humanizedSize":"1KB","humanizedGzipSize":"342B","rules":{"total":8,"size":{"graph":[3,3,1,3,6,1,1,3],"max":6,"average":2.625},"selectorByRuleSizes":[{"selector":".Truncate>.Truncate-text","declarations":6},{"selector":".Truncate>.Truncate-text.Truncate-text--expandable:active,.Truncate>.Truncate-text.Truncate-text--expandable:focus,.Truncate>.Truncate-text.Truncate-text--expandable:hover","declarations":3},{"selector":".Truncate","declarations":3},{"selector":".css-truncate .css-truncate-target,.css-truncate.css-truncate-target","declarations":3},{"selector":".css-truncate .css-truncate-overflow,.css-truncate .css-truncate-target,.css-truncate.css-truncate-overflow,.css-truncate.css-truncate-target","declarations":3},{"selector":".Truncate>.Truncate-text.Truncate-text--primary","declarations":1},{"selector":".Truncate>.Truncate-text+.Truncate-text","declarations":1},{"selector":".css-truncate.expandable.css-truncate-target:hover,.css-truncate.expandable.zeroclipboard-is-hover .css-truncate-target,.css-truncate.expandable.zeroclipboard-is-hover.css-truncate-target,.css-truncate.expandable:hover .css-truncate-target","declarations":1}]},"selectors":{"total":17,"type":0,"class":17,"id":0,"pseudoClass":5,"pseudoElement":0,"values":[".css-truncate .css-truncate-overflow",".css-truncate .css-truncate-target",".css-truncate.css-truncate-overflow",".css-truncate.css-truncate-target",".css-truncate .css-truncate-target",".css-truncate.css-truncate-target",".css-truncate.expandable.css-truncate-target:hover",".css-truncate.expandable.zeroclipboard-is-hover .css-truncate-target",".css-truncate.expandable.zeroclipboard-is-hover.css-truncate-target",".css-truncate.expandable:hover .css-truncate-target",".Truncate",".Truncate>.Truncate-text",".Truncate>.Truncate-text+.Truncate-text",".Truncate>.Truncate-text.Truncate-text--primary",".Truncate>.Truncate-text.Truncate-text--expandable:active",".Truncate>.Truncate-text.Truncate-text--expandable:focus",".Truncate>.Truncate-text.Truncate-text--expandable:hover"],"specificity":{"max":40,"average":28.823529411764707}},"declarations":{"total":21,"unique":17,"uniqueToTotalRatio":0.8095238095238095,"properties":{"overflow":["hidden","hidden"],"text-overflow":["ellipsis","ellipsis"],"white-space":["nowrap","nowrap"],"display":["inline-block","inline-flex"],"max-width":["125px","10000px","100%","-moz-fit-content","fit-content","100%"],"vertical-align":["top"],"min-width":["0","1ch"],"margin-left":["0.25rem"],"flex-basis":["200%"],"cursor":["pointer"],"flex-shrink":["0"]}},"mediaQueries":{"total":0,"unique":0,"values":[],"contents":[]}}
|
package/dist/subhead.css
CHANGED
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
:root{--h00-size-mobile: 2.5rem;--h0-size-mobile: 2rem;--h1-size-mobile: 1.625rem;--h2-size-mobile: 1.375rem;--h3-size-mobile: 1.125rem;--h00-size: 3rem;--h0-size: 2.5rem;--h1-size: 2rem;--h2-size: 1.5rem;--h3-size: 1.25rem;--h4-size: 1rem;--h5-size: 0.875rem;--h6-size: 0.75rem;--body-font-size: 0.875rem;--font-size-small: 0.75rem}.Subhead{border-bottom:var(--borderWidth-thin, 1px) solid var(--color-border-muted);display:flex;flex-flow:row wrap;justify-content:flex-end;margin-bottom:var(--stack-gap-normal,
|
|
1
|
+
:root{--h00-size-mobile: 2.5rem;--h0-size-mobile: 2rem;--h1-size-mobile: 1.625rem;--h2-size-mobile: 1.375rem;--h3-size-mobile: 1.125rem;--h00-size: 3rem;--h0-size: 2.5rem;--h1-size: 2rem;--h2-size: 1.5rem;--h3-size: 1.25rem;--h4-size: 1rem;--h5-size: 0.875rem;--h6-size: 0.75rem;--body-font-size: 0.875rem;--font-size-small: 0.75rem}.Subhead{border-bottom:var(--borderWidth-thin, max(1px, 0.0625rem)) solid var(--borderColor-muted, var(--color-border-muted));display:flex;flex-flow:row wrap;justify-content:flex-end;margin-bottom:var(--stack-gap-normal, 1rem);padding-bottom:var(--stack-padding-condensed, 0.5rem)}.Subhead--spacious{margin-top:var(--base-size-40, 2.5rem)}.Subhead-heading{flex:1 1 auto;font-size:24px;font-weight:var(--base-text-weight-normal, 400);order:0}.Subhead-heading--danger{color:var(--fgColor-danger, var(--color-danger-fg));font-weight:var(--base-text-weight-semibold, 600)}.Subhead-description{color:var(--fgColor-muted, var(--color-fg-muted));flex:1 100%;font-size:var(--text-body-size-medium, 0.875rem);order:2}.Subhead-actions{align-self:center;justify-content:flex-end;margin:var(--base-size-4, 0.25rem) 0 var(--base-size-4, 0.25rem) var(--base-size-4, 0.25rem);order:1}.Subhead-actions+.Subhead-description{margin-top:var(--base-size-4, 0.25rem)}
|
|
2
2
|
/*# sourceMappingURL=subhead.css.map */
|
package/dist/subhead.css.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["file:///home/runner/work/css/css/src/subhead/index.scss%23sass"],"names":[],"mappings":"AAyRA,MAAA,yBAGE,CAAA,sBAAA,CAAA,0BAAA,CAAA,0BAAA,CAAA,0BAAA,CAAA,gBAAA,CAAA,iBAAA,CAAA,eAAA,CAAA,iBAAA,CAAA,kBAAA,CAAA,eAAA,CAAA,mBAAA,CAAA,kBAAA,CAAA,0BAAA,CAAA,0BAAA,CAAA,SAAA,
|
|
1
|
+
{"version":3,"sources":["file:///home/runner/work/css/css/src/subhead/index.scss%23sass"],"names":[],"mappings":"AAyRA,MAAA,yBAGE,CAAA,sBAAA,CAAA,0BAAA,CAAA,0BAAA,CAAA,0BAAA,CAAA,gBAAA,CAAA,iBAAA,CAAA,eAAA,CAAA,iBAAA,CAAA,kBAAA,CAAA,eAAA,CAAA,mBAAA,CAAA,kBAAA,CAAA,0BAAA,CAAA,0BAAA,CAAA,SAAA,oHAAA,CAAA,YAAA,CAAA,kBAAA,CAAA,wBAAA,CAAA,2CAAA,CAAA,qDAAA,CAAA,mBAAA,sCAAA,CAAA,iBAAA,aAAA,CAAA,cAAA,CAAA,+CAAA,CAAA,OAAA,CAAA,yBAAA,mDAAA,CAAA,iDAAA,CAAA,qBAAA,iDAAA,CAAA,WAAA,CAAA,gDAAA,CAAA,OAAA,CAAA,iBAAA,iBAAA,CAAA,wBAAA,CAAA,4FAAA,CAAA,OAAA,CAAA,sCAAA,sCAAA","file":"subhead.css"}
|
package/dist/timeline.css
CHANGED
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
:root{--h00-size-mobile: 2.5rem;--h0-size-mobile: 2rem;--h1-size-mobile: 1.625rem;--h2-size-mobile: 1.375rem;--h3-size-mobile: 1.125rem;--h00-size: 3rem;--h0-size: 2.5rem;--h1-size: 2rem;--h2-size: 1.5rem;--h3-size: 1.25rem;--h4-size: 1rem;--h5-size: 0.875rem;--h6-size: 0.75rem;--body-font-size: 0.875rem;--font-size-small: 0.75rem}.TimelineItem{display:flex;margin-left:var(--stack-gap-normal,
|
|
1
|
+
:root{--h00-size-mobile: 2.5rem;--h0-size-mobile: 2rem;--h1-size-mobile: 1.625rem;--h2-size-mobile: 1.375rem;--h3-size-mobile: 1.125rem;--h00-size: 3rem;--h0-size: 2.5rem;--h1-size: 2rem;--h2-size: 1.5rem;--h3-size: 1.25rem;--h4-size: 1rem;--h5-size: 0.875rem;--h6-size: 0.75rem;--body-font-size: 0.875rem;--font-size-small: 0.75rem}.TimelineItem{display:flex;margin-left:var(--stack-gap-normal, 1rem);padding:var(--stack-padding-normal, 1rem) 0;position:relative}.TimelineItem:before{background-color:var(--borderColor-muted, var(--color-border-muted));bottom:0;content:"";display:block;left:0;position:absolute;top:0;width:var(--borderWidth-thick, max(2px, 0.125rem))}.TimelineItem:target .TimelineItem-badge{border-color:var(--borderColor-accent-emphasis, var(--color-accent-fg));box-shadow:0 0 .2em var(--borderColor-accent-muted, var(--color-accent-muted))}.TimelineItem-badge{align-items:center;background-color:var(--timelineBadge-bgColor, var(--color-timeline-badge-bg));border:var(--borderWidth-thick, max(2px, 0.125rem)) solid var(--bgColor-default, var(--color-canvas-default));border-radius:50%;color:var(--fgColor-muted, var(--color-fg-muted));display:flex;flex-shrink:0;height:var(--control-medium-size, 2rem);justify-content:center;margin-left:calc(var(--control-medium-size, 2rem)/-2 + 1px);margin-right:var(--controlStack-medium-gap-condensed, 0.5rem);position:relative;width:var(--control-medium-size, 2rem);z-index:1}.TimelineItem-badge--success{background-color:var(--bgColor-success-emphasis, var(--color-success-fg));border:var(--borderWidth-thin, max(1px, 0.0625rem)) solid rgba(0,0,0,0);color:var(--fgColor-onEmphasis, var(--color-fg-on-emphasis))}.TimelineItem-body{color:var(--fgColor-muted, var(--color-fg-muted));flex:auto;margin-top:var(--base-size-4, 0.25rem);max-width:100%;min-width:0}.TimelineItem-avatar{left:-72px;position:absolute;z-index:1}.TimelineItem-break{background-color:var(--bgColor-default, var(--color-canvas-default));border:0;border-top:var(--borderWidth-thicker, max(4px, 0.25rem)) solid var(--borderColor-default, var(--color-border-default));height:var(--stack-gap-spacious, 1.5rem);margin:0;margin-bottom:calc(var(--stack-gap-normal, 1rem)*-1);margin-left:-56px;position:relative;z-index:1}.TimelineItem--condensed{padding-bottom:0;padding-top:var(--base-size-4, 0.25rem)}.TimelineItem--condensed:last-child{padding-bottom:var(--stack-gap-normal, 1rem)}.TimelineItem--condensed .TimelineItem-badge{background-color:var(--bgColor-default, var(--color-canvas-default));border:0;color:var(--fgColor-muted, var(--color-fg-muted));height:var(--base-size-16, 1rem);margin-bottom:var(--base-size-8, 0.5rem);margin-top:var(--base-size-8, 0.5rem)}
|
|
2
2
|
/*# sourceMappingURL=timeline.css.map */
|
package/dist/timeline.css.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["file:///home/runner/work/css/css/src/timeline/index.scss%23sass"],"names":[],"mappings":"AAwRA,MAAA,yBAGE,CAAA,sBAAA,CAAA,0BAAA,CAAA,0BAAA,CAAA,0BAAA,CAAA,gBAAA,CAAA,iBAAA,CAAA,eAAA,CAAA,iBAAA,CAAA,kBAAA,CAAA,eAAA,CAAA,mBAAA,CAAA,kBAAA,CAAA,0BAAA,CAAA,0BAAA,CAAA,cAAA,YAAA,CAAA,yCAAA,CAAA,2CAAA,CAAA,iBAAA,CAAA,qBAAA,
|
|
1
|
+
{"version":3,"sources":["file:///home/runner/work/css/css/src/timeline/index.scss%23sass"],"names":[],"mappings":"AAwRA,MAAA,yBAGE,CAAA,sBAAA,CAAA,0BAAA,CAAA,0BAAA,CAAA,0BAAA,CAAA,gBAAA,CAAA,iBAAA,CAAA,eAAA,CAAA,iBAAA,CAAA,kBAAA,CAAA,eAAA,CAAA,mBAAA,CAAA,kBAAA,CAAA,0BAAA,CAAA,0BAAA,CAAA,cAAA,YAAA,CAAA,yCAAA,CAAA,2CAAA,CAAA,iBAAA,CAAA,qBAAA,oEAAA,CAAA,QAAA,CAAA,UAAA,CAAA,aAAA,CAAA,MAAA,CAAA,iBAAA,CAAA,KAAA,CAAA,kDAAA,CAAA,yCAAA,uEAAA,CAAA,8EAAA,CAAA,oBAAA,kBAAA,CAAA,6EAAA,CAAA,6GAAA,CAAA,iBAAA,CAAA,iDAAA,CAAA,YAAA,CAAA,aAAA,CAAA,uCAAA,CAAA,sBAAA,CAAA,2DAAA,CAAA,6DAAA,CAAA,iBAAA,CAAA,sCAAA,CAAA,SAAA,CAAA,6BAAA,yEAAA,CAAA,uEAAA,CAAA,4DAAA,CAAA,mBAAA,iDAAA,CAAA,SAAA,CAAA,sCAAA,CAAA,cAAA,CAAA,WAAA,CAAA,qBAAA,UAAA,CAAA,iBAAA,CAAA,SAAA,CAAA,oBAAA,oEAAA,CAAA,QAAA,CAAA,sHAAA,CAAA,wCAAA,CAAA,QAAA,CAAA,oDAAA,CAAA,iBAAA,CAAA,iBAAA,CAAA,SAAA,CAAA,yBAAA,gBAAA,CAAA,uCAAA,CAAA,oCAAA,4CAAA,CAAA,6CAAA,oEAAA,CAAA,QAAA,CAAA,iDAAA,CAAA,gCAAA,CAAA,wCAAA,CAAA,qCAAA","file":"timeline.css"}
|
package/dist/toggle-switch.css
CHANGED
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
:root{--h00-size-mobile: 2.5rem;--h0-size-mobile: 2rem;--h1-size-mobile: 1.625rem;--h2-size-mobile: 1.375rem;--h3-size-mobile: 1.125rem;--h00-size: 3rem;--h0-size: 2.5rem;--h1-size: 2rem;--h2-size: 1.5rem;--h3-size: 1.25rem;--h4-size: 1rem;--h5-size: 0.875rem;--h6-size: 0.75rem;--body-font-size: 0.875rem;--font-size-small: 0.75rem}.ToggleSwitch,.ToggleSwitch.ToggleSwitch{display:inline-flex}.ToggleSwitch{align-items:center;gap:var(--controlStack-medium-gap-condensed,
|
|
1
|
+
:root{--h00-size-mobile: 2.5rem;--h0-size-mobile: 2rem;--h1-size-mobile: 1.625rem;--h2-size-mobile: 1.375rem;--h3-size-mobile: 1.125rem;--h00-size: 3rem;--h0-size: 2.5rem;--h1-size: 2rem;--h2-size: 1.5rem;--h3-size: 1.25rem;--h4-size: 1rem;--h5-size: 0.875rem;--h6-size: 0.75rem;--body-font-size: 0.875rem;--font-size-small: 0.75rem}.ToggleSwitch,.ToggleSwitch.ToggleSwitch{display:inline-flex}.ToggleSwitch{align-items:center;gap:var(--controlStack-medium-gap-condensed, 0.5rem)}.ToggleSwitch--checked .ToggleSwitch-statusOn{height:auto;visibility:visible}.ToggleSwitch--checked .ToggleSwitch-statusOff{height:0;visibility:hidden}.ToggleSwitch-track{appearance:none;background-color:var(--controlTrack-bgColor-rest, var(--color-switch-track-bg));border:var(--borderWidth-thin, max(1px, 0.0625rem)) solid var(--controlTrack-borderColor-rest, var(--color-switch-track-border));border-radius:var(--borderRadius-medium, 6px);cursor:pointer;display:block;height:var(--control-medium-size, 2rem);overflow:hidden;padding:0;position:relative;text-decoration:none;transition-duration:80ms;transition-property:background-color,border-color;transition-timing-function:cubic-bezier(0.5, 1, 0.89, 1);-webkit-user-select:none;user-select:none;width:var(--base-size-64, 4rem)}.ToggleSwitch-track:focus,.ToggleSwitch-track:focus-visible{outline-offset:1px}.ToggleSwitch-track:hover{background-color:var(--controlTrack-bgColor-hover, var(--color-switch-track-hover-bg))}.ToggleSwitch-track:active{background-color:var(--controlTrack-bgColor-active, var(--color-switch-track-active-bg))}@media(pointer: coarse){.ToggleSwitch-track:before{content:"";height:100%;left:50%;min-height:44px;position:absolute;top:50%;transform:translateX(-50%) translateY(-50%);width:100%}}@media(prefers-reduced-motion){.ToggleSwitch-track,.ToggleSwitch-track *{transition:none}}.ToggleSwitch-track[aria-pressed=true][disabled]{background-color:var(--controlTrack-bgColor-disabled, var(--color-switch-track-disabled-bg));border-color:rgba(0,0,0,0);color:var(--control-checked-fgColor-disabled, var(--color-switch-track-checked-disabled-fg))}.ToggleSwitch-track[aria-pressed=true]{background-color:var(--control-checked-bgColor-rest, var(--color-switch-track-checked-bg));border-color:var(--borderColor-transparent, rgba(0, 0, 0, 0))}.ToggleSwitch-track[aria-pressed=true]:not([disabled]):hover{background-color:var(--control-checked-bgColor-hover, var(--color-switch-track-checked-hover-bg))}.ToggleSwitch-track[aria-pressed=true]:not([disabled]):active{background-color:var(--control-checked-bgColor-active, var(--color-switch-track-checked-active-bg))}.ToggleSwitch-track[aria-pressed=true] .ToggleSwitch-knob{background-color:var(--controlKnob-bgColor-checked, var(--color-switch-knob-checked-bg));border-color:var(--controlKnob-borderColor-checked, var(--color-switch-knob-checked-border));transform:translateX(100%)}.ToggleSwitch-track[aria-pressed=true] .ToggleSwitch-lineIcon{transform:translateX(0)}.ToggleSwitch-track[aria-pressed=true] .ToggleSwitch-circleIcon{transform:translateX(100%)}.ToggleSwitch-track[disabled]{background-color:var(--controlTrack-bgColor-disabled, var(--color-switch-track-disabled-bg));border-color:rgba(0,0,0,0);cursor:not-allowed;transition-property:none}.ToggleSwitch-track[disabled] .ToggleSwitch-knob{border-color:var(--borderColor-default, var(--color-border-default));box-shadow:none}.ToggleSwitch-track[disabled] .ToggleSwitch-circleIcon,.ToggleSwitch-track[disabled] .ToggleSwitch-lineIcon{color:var(--controlTrack-fgColor-disabled, var(--color-switch-track-disabled-fg))}.ToggleSwitch-icons{align-items:center;display:flex;height:100%;overflow:hidden;width:100%}.ToggleSwitch-lineIcon{color:var(--control-checked-fgColor-rest, var(--color-switch-track-checked-fg));transform:translateX(-100%)}.ToggleSwitch-circleIcon,.ToggleSwitch-lineIcon{flex:1 0 50%;line-height:0;transition-duration:80ms;transition-property:transform}.ToggleSwitch-circleIcon{color:var(--controlTrack-fgColor-rest, var(--color-switch-track-fg));transform:translateX(0)}.ToggleSwitch-knob{background-color:var(--controlKnob-bgColor-rest, var(--color-switch-knob-bg));border:var(--borderWidth-thin, max(1px, 0.0625rem)) solid var(--controlKnob-borderColor-rest, var(--color-switch-knob-border));border-radius:var(--borderRadius-medium, 6px);bottom:0;box-shadow:var(--shadow-resting-medium, var(--color-shadow-medium)),var(--button-default-shadow-inset, var(--color-btn-inset-shadow));position:absolute;top:0;transition-duration:80ms;transition-property:transform;transition-timing-function:cubic-bezier(0.5, 1, 0.89, 1);width:50%;z-index:1}@media(prefers-reduced-motion){.ToggleSwitch-knob{transition:none}}.ToggleSwitch-status{color:var(--fgColor-default, var(--color-fg-default));font-size:var(--text-body-size-medium, 0.875rem);line-height:1.5;position:relative;text-align:right}.ToggleSwitch-statusIcon{display:flex;margin-top:.063rem;width:var(--base-size-16, 1rem)}.ToggleSwitch--small .ToggleSwitch-status{font-size:var(--text-body-size-small, 0.75rem)}.ToggleSwitch--small .ToggleSwitch-track{height:var(--control-xsmall-size, 1.5rem);width:var(--base-size-48, 3rem)}.ToggleSwitch--disabled .ToggleSwitch-status{color:var(--fgColor-muted, 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":"AAwRA,MAAA,yBAGE,CAAA,sBAAA,CAAA,0BAAA,CAAA,0BAAA,CAAA,0BAAA,CAAA,gBAAA,CAAA,iBAAA,CAAA,eAAA,CAAA,iBAAA,CAAA,kBAAA,CAAA,eAAA,CAAA,mBAAA,CAAA,kBAAA,CAAA,0BAAA,CAAA,0BAAA,CAAA,yCAAA,mBAAA,CAAA,cAAA,kBAAA,CAAA,
|
|
1
|
+
{"version":3,"sources":["file:///home/runner/work/css/css/src/toggle-switch/index.scss%23sass"],"names":[],"mappings":"AAwRA,MAAA,yBAGE,CAAA,sBAAA,CAAA,0BAAA,CAAA,0BAAA,CAAA,0BAAA,CAAA,gBAAA,CAAA,iBAAA,CAAA,eAAA,CAAA,iBAAA,CAAA,kBAAA,CAAA,eAAA,CAAA,mBAAA,CAAA,kBAAA,CAAA,0BAAA,CAAA,0BAAA,CAAA,yCAAA,mBAAA,CAAA,cAAA,kBAAA,CAAA,oDAAA,CAAA,8CAAA,WAAA,CAAA,kBAAA,CAAA,+CAAA,QAAA,CAAA,iBAAA,CAAA,oBAAA,eAAA,CAAA,+EAAA,CAAA,gIAAA,CAAA,6CAAA,CAAA,cAAA,CAAA,aAAA,CAAA,uCAAA,CAAA,eAAA,CAAA,SAAA,CAAA,iBAAA,CAAA,oBAAA,CAAA,wBAAA,CAAA,iDAAA,CAAA,wDAAA,CAAA,wBAAA,CAAA,gBAAA,CAAA,+BAAA,CAAA,4DAAA,kBAAA,CAAA,0BAAA,sFAAA,CAAA,2BAAA,wFAAA,CAAA,wBAAA,2BAAA,UAAA,CAAA,WAAA,CAAA,QAAA,CAAA,eAAA,CAAA,iBAAA,CAAA,OAAA,CAAA,2CAAA,CAAA,UAAA,CAAA,CAAA,+BAAA,0CAAA,eAAA,CAAA,CAAA,iDAAA,4FAAA,CAAA,0BAAA,CAAA,4FAAA,CAAA,uCAAA,0FAAA,CAAA,6DAAA,CAAA,6DAAA,iGAAA,CAAA,8DAAA,mGAAA,CAAA,0DAAA,wFAAA,CAAA,4FAAA,CAAA,0BAAA,CAAA,8DAAA,uBAAA,CAAA,gEAAA,0BAAA,CAAA,8BAAA,4FAAA,CAAA,0BAAA,CAAA,kBAAA,CAAA,wBAAA,CAAA,iDAAA,oEAAA,CAAA,eAAA,CAAA,4GAAA,iFAAA,CAAA,oBAAA,kBAAA,CAAA,YAAA,CAAA,WAAA,CAAA,eAAA,CAAA,UAAA,CAAA,uBAAA,+EAAA,CAAA,2BAAA,CAAA,gDAAA,YAAA,CAAA,aAAA,CAAA,wBAAA,CAAA,6BAAA,CAAA,yBAAA,oEAAA,CAAA,uBAAA,CAAA,mBAAA,6EAAA,CAAA,8HAAA,CAAA,6CAAA,CAAA,QAAA,CAAA,qIAAA,CAAA,iBAAA,CAAA,KAAA,CAAA,wBAAA,CAAA,6BAAA,CAAA,wDAAA,CAAA,SAAA,CAAA,SAAA,CAAA,+BAAA,mBAAA,eAAA,CAAA,CAAA,qBAAA,qDAAA,CAAA,gDAAA,CAAA,eAAA,CAAA,iBAAA,CAAA,gBAAA,CAAA,yBAAA,YAAA,CAAA,kBAAA,CAAA,+BAAA,CAAA,0CAAA,8CAAA,CAAA,yCAAA,yCAAA,CAAA,+BAAA,CAAA,6CAAA,iDAAA,CAAA,uBAAA,QAAA,CAAA,iBAAA,CAAA,wBAAA,WAAA,CAAA,kBAAA,CAAA,2BAAA,0BAAA,CAAA,gDAAA,eAAA","file":"toggle-switch.css"}
|
package/dist/truncate.css
CHANGED
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
:root{--h00-size-mobile: 2.5rem;--h0-size-mobile: 2rem;--h1-size-mobile: 1.625rem;--h2-size-mobile: 1.375rem;--h3-size-mobile: 1.125rem;--h00-size: 3rem;--h0-size: 2.5rem;--h1-size: 2rem;--h2-size: 1.5rem;--h3-size: 1.25rem;--h4-size: 1rem;--h5-size: 0.875rem;--h6-size: 0.75rem;--body-font-size: 0.875rem;--font-size-small: 0.75rem}.css-truncate .css-truncate-overflow,.css-truncate .css-truncate-target,.css-truncate.css-truncate-overflow,.css-truncate.css-truncate-target{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.css-truncate .css-truncate-target,.css-truncate.css-truncate-target{display:inline-block;max-width:125px;vertical-align:top}.css-truncate.expandable.css-truncate-target:hover,.css-truncate.expandable.zeroclipboard-is-hover .css-truncate-target,.css-truncate.expandable.zeroclipboard-is-hover.css-truncate-target,.css-truncate.expandable:hover .css-truncate-target{max-width:10000px !important}.Truncate{display:inline-flex;max-width:100%;min-width:0}.Truncate>.Truncate-text{max-width:-moz-fit-content;max-width:fit-content;min-width:1ch;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.Truncate>.Truncate-text+.Truncate-text{margin-left:var(--control-small-gap,
|
|
1
|
+
:root{--h00-size-mobile: 2.5rem;--h0-size-mobile: 2rem;--h1-size-mobile: 1.625rem;--h2-size-mobile: 1.375rem;--h3-size-mobile: 1.125rem;--h00-size: 3rem;--h0-size: 2.5rem;--h1-size: 2rem;--h2-size: 1.5rem;--h3-size: 1.25rem;--h4-size: 1rem;--h5-size: 0.875rem;--h6-size: 0.75rem;--body-font-size: 0.875rem;--font-size-small: 0.75rem}.css-truncate .css-truncate-overflow,.css-truncate .css-truncate-target,.css-truncate.css-truncate-overflow,.css-truncate.css-truncate-target{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.css-truncate .css-truncate-target,.css-truncate.css-truncate-target{display:inline-block;max-width:125px;vertical-align:top}.css-truncate.expandable.css-truncate-target:hover,.css-truncate.expandable.zeroclipboard-is-hover .css-truncate-target,.css-truncate.expandable.zeroclipboard-is-hover.css-truncate-target,.css-truncate.expandable:hover .css-truncate-target{max-width:10000px !important}.Truncate{display:inline-flex;max-width:100%;min-width:0}.Truncate>.Truncate-text{max-width:-moz-fit-content;max-width:fit-content;min-width:1ch;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.Truncate>.Truncate-text+.Truncate-text{margin-left:var(--control-small-gap, 0.25rem)}.Truncate>.Truncate-text.Truncate-text--primary{flex-basis:200%}.Truncate>.Truncate-text.Truncate-text--expandable:active,.Truncate>.Truncate-text.Truncate-text--expandable:focus,.Truncate>.Truncate-text.Truncate-text--expandable:hover{cursor:pointer;flex-shrink:0;max-width:100% !important}
|
|
2
2
|
/*# sourceMappingURL=truncate.css.map */
|
package/dist/truncate.css.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["file:///home/runner/work/css/css/src/truncate/index.scss%23sass"],"names":[],"mappings":"AAwRA,MAAA,yBAGE,CAAA,sBAAA,CAAA,0BAAA,CAAA,0BAAA,CAAA,0BAAA,CAAA,gBAAA,CAAA,iBAAA,CAAA,eAAA,CAAA,iBAAA,CAAA,kBAAA,CAAA,eAAA,CAAA,mBAAA,CAAA,kBAAA,CAAA,0BAAA,CAAA,0BAAA,CAAA,8IAAA,eAAA,CAAA,sBAAA,CAAA,kBAAA,CAAA,qEAAA,oBAAA,CAAA,eAAA,CAAA,kBAAA,CAAA,gPAAA,4BAAA,CAAA,UAAA,mBAAA,CAAA,cAAA,CAAA,WAAA,CAAA,yBAAA,0BAAA,CAAA,qBAAA,CAAA,aAAA,CAAA,eAAA,CAAA,sBAAA,CAAA,kBAAA,CAAA,wCAAA,
|
|
1
|
+
{"version":3,"sources":["file:///home/runner/work/css/css/src/truncate/index.scss%23sass"],"names":[],"mappings":"AAwRA,MAAA,yBAGE,CAAA,sBAAA,CAAA,0BAAA,CAAA,0BAAA,CAAA,0BAAA,CAAA,gBAAA,CAAA,iBAAA,CAAA,eAAA,CAAA,iBAAA,CAAA,kBAAA,CAAA,eAAA,CAAA,mBAAA,CAAA,kBAAA,CAAA,0BAAA,CAAA,0BAAA,CAAA,8IAAA,eAAA,CAAA,sBAAA,CAAA,kBAAA,CAAA,qEAAA,oBAAA,CAAA,eAAA,CAAA,kBAAA,CAAA,gPAAA,4BAAA,CAAA,UAAA,mBAAA,CAAA,cAAA,CAAA,WAAA,CAAA,yBAAA,0BAAA,CAAA,qBAAA,CAAA,aAAA,CAAA,eAAA,CAAA,sBAAA,CAAA,kBAAA,CAAA,wCAAA,6CAAA,CAAA,gDAAA,eAAA,CAAA,4KAAA,cAAA,CAAA,aAAA,CAAA,yBAAA","file":"truncate.css"}
|
|
@@ -0,0 +1,300 @@
|
|
|
1
|
+
Primer v16.0.0 introduces the idea of _color modes_ and _functional variables_. A color mode defines a set of colors in the Primer system that differs from that of other color modes. Currently, Primer ships with a light mode and a dark mode.
|
|
2
|
+
|
|
3
|
+
Because colors differ in each color mode, it doesn't make sense to try to make an element a specific color; instead, Primer now applies colors based on the function of an element using functional variables. As a result, the Sass color variables that existed in Primer prior to version 16.0.0 have been replaced with functional CSS variables. These variables have different values depending on the current color mode. For a list of the new functional CSS color variables, see [the color system page](/support/color-system). The color utility classes have also been updated to match; see [the color utilities page](/utilities/colors) for more information.
|
|
4
|
+
|
|
5
|
+
## Components
|
|
6
|
+
|
|
7
|
+
Most components don't need to be updated and should work without making changes. However some components that use presentational class names now use functional class names.
|
|
8
|
+
|
|
9
|
+
### Buttons
|
|
10
|
+
|
|
11
|
+
| `v15` | `v16` |
|
|
12
|
+
| ----------- | ----- |
|
|
13
|
+
| `.btn-blue` | n/a |
|
|
14
|
+
|
|
15
|
+
### Counters
|
|
16
|
+
|
|
17
|
+
| [`v15`](https://primer.style/css/components/labels#counters) | `v16` |
|
|
18
|
+
| ------------------------------------------------------------ | --------------------- |
|
|
19
|
+
| `.Counter--gray` | `.Counter--primary` |
|
|
20
|
+
| `.Counter--gray-light` | `.Counter--secondary` |
|
|
21
|
+
|
|
22
|
+
### Dropdown
|
|
23
|
+
|
|
24
|
+
| [`v15`](https://primer.style/css/components/dropdown#dark) | `v16` |
|
|
25
|
+
| ---------------------------------------------------------- | ----- |
|
|
26
|
+
| `.dropdown-menu-dark` | n/a |
|
|
27
|
+
|
|
28
|
+
### Labels
|
|
29
|
+
|
|
30
|
+
| [`v15`](https://primer.style/css/components/labels) | `v16` |
|
|
31
|
+
| --------------------------------------------------- | ------------------- |
|
|
32
|
+
| `.Label--gray-darker` | `.Label--primary` |
|
|
33
|
+
| `.Label--gray` | `.Label--secondary` |
|
|
34
|
+
| `.Label--blue` | `.Label--info` |
|
|
35
|
+
| `.Label--green` | `.Label--success` |
|
|
36
|
+
| `.Label--yellow` | `.Label--warning` |
|
|
37
|
+
| `.Label--red` | `.Label--danger` |
|
|
38
|
+
| `.Label--orange` | n/a |
|
|
39
|
+
| `.Label--purple` | n/a |
|
|
40
|
+
| `.Label--pink` | n/a |
|
|
41
|
+
|
|
42
|
+
### States
|
|
43
|
+
|
|
44
|
+
| [`v15`](https://primer.style/css/components/labels#states) | `v16` |
|
|
45
|
+
| ---------------------------------------------------------- | ---------------- |
|
|
46
|
+
| n/a | `.State--draft` |
|
|
47
|
+
| `.State--green` | `.State--open` |
|
|
48
|
+
| `.State--purple` | `.State--merged` |
|
|
49
|
+
| `.State--red` | `.State--closed` |
|
|
50
|
+
|
|
51
|
+
## Utility classes
|
|
52
|
+
|
|
53
|
+
See [color utility classes](/utilities/colors) for a list of all the functional color utility classes.
|
|
54
|
+
|
|
55
|
+
### Text
|
|
56
|
+
|
|
57
|
+
| [`v15`](https://primer.style/css/utilities/colors#text-color-utilities) | `v16` |
|
|
58
|
+
| ----------------------------------------------------------------------- | ----------------------- |
|
|
59
|
+
| `.text-gray-dark` | `.color-text-primary` |
|
|
60
|
+
| `.text-gray` | `.color-text-secondary` |
|
|
61
|
+
| `.text-gray-light` | `.color-text-tertiary` |
|
|
62
|
+
| `.text-blue` | `.color-text-link` |
|
|
63
|
+
| `.text-green` | `.color-text-success` |
|
|
64
|
+
| `.text-yellow` | `.color-text-warning` |
|
|
65
|
+
| `.text-red` | `.color-text-danger` |
|
|
66
|
+
| `.text-white` | `.color-text-white` |
|
|
67
|
+
| n/a | `.color-text-inverse` |
|
|
68
|
+
| `.text-black` | n/a |
|
|
69
|
+
| `.text-orange` | n/a |
|
|
70
|
+
| `.text-orange-light` | n/a |
|
|
71
|
+
| `.text-purple` | n/a |
|
|
72
|
+
| `.text-pink` | n/a |
|
|
73
|
+
|
|
74
|
+
### Icon
|
|
75
|
+
|
|
76
|
+
| `v15` | `v16` |
|
|
77
|
+
| ----- | ----------------------- |
|
|
78
|
+
| n/a | `.color-icon-primary` |
|
|
79
|
+
| n/a | `.color-icon-secondary` |
|
|
80
|
+
| n/a | `.color-icon-tertiary` |
|
|
81
|
+
| n/a | `.color-icon-info` |
|
|
82
|
+
| n/a | `.color-icon-success` |
|
|
83
|
+
| n/a | `.color-icon-warning` |
|
|
84
|
+
| n/a | `.color-icon-danger` |
|
|
85
|
+
|
|
86
|
+
### Border
|
|
87
|
+
|
|
88
|
+
| [`v15`](https://primer.style/css/utilities/borders#border-color-utilities) | `v16` |
|
|
89
|
+
| -------------------------------------------------------------------------- | ------------------------- |
|
|
90
|
+
| `.border-gray` | `.color-border-primary` |
|
|
91
|
+
| `.border-gray-light` | `.color-border-secondary` |
|
|
92
|
+
| `.border-gray-dark` | `.color-border-tertiary` |
|
|
93
|
+
| `.border-blue` | `.color-border-info` |
|
|
94
|
+
| `.border-green` | `.color-border-success` |
|
|
95
|
+
| `.border-yellow` | `.color-border-warning` |
|
|
96
|
+
| `.border-red` | `.color-border-danger` |
|
|
97
|
+
| `.border-white` | `.color-border-inverse` |
|
|
98
|
+
| `.border-gray-darker` | n/a |
|
|
99
|
+
| `.border-blue-light` | n/a |
|
|
100
|
+
| `.border-red-light` | n/a |
|
|
101
|
+
| `.border-purple` | n/a |
|
|
102
|
+
| `.border-black-fade` | n/a |
|
|
103
|
+
| `.border-white-fade` | n/a |
|
|
104
|
+
| `.border-white-fade-15` | n/a |
|
|
105
|
+
| `.border-white-fade-30` | n/a |
|
|
106
|
+
| `.border-white-fade-50` | n/a |
|
|
107
|
+
| `.border-white-fade-70` | n/a |
|
|
108
|
+
| `.border-white-fade-85` | n/a |
|
|
109
|
+
|
|
110
|
+
### Background
|
|
111
|
+
|
|
112
|
+
| [`v15`](https://primer.style/css/utilities/colors#background-utilities) | `v16` |
|
|
113
|
+
| ----------------------------------------------------------------------- | --------------------------- |
|
|
114
|
+
| `.bg-white` | `.color-bg-primary` |
|
|
115
|
+
| `.bg-gray-light` | `.color-bg-secondary` |
|
|
116
|
+
| `.bg-gray` | `.color-bg-tertiary` |
|
|
117
|
+
| `.bg-gray-dark` | `.color-bg-canvas-inverse` |
|
|
118
|
+
| `.bg-blue-light` | `.color-bg-info` |
|
|
119
|
+
| `.bg-blue` | `.color-bg-info-inverse` |
|
|
120
|
+
| `.bg-green-light` | `.color-bg-success` |
|
|
121
|
+
| `.bg-green` | `.color-bg-success-inverse` |
|
|
122
|
+
| `.bg-yellow-light` | `.color-bg-warning` |
|
|
123
|
+
| `.bg-yellow` | `.color-bg-warning-inverse` |
|
|
124
|
+
| `.bg-red-light` | `.color-bg-danger` |
|
|
125
|
+
| `.bg-red` | `.color-bg-danger-inverse` |
|
|
126
|
+
| n/a | `.color-bg-canvas` |
|
|
127
|
+
| n/a | `.color-bg-canvas-inset` |
|
|
128
|
+
| n/a | `.color-bg-overlay` |
|
|
129
|
+
| `.bg-purple-light` | n/a |
|
|
130
|
+
| `.bg-purple` | n/a |
|
|
131
|
+
| `.bg-yellow-dark` | n/a |
|
|
132
|
+
| `.bg-orange` | n/a |
|
|
133
|
+
| `.bg-pink` | n/a |
|
|
134
|
+
|
|
135
|
+
### Shadow
|
|
136
|
+
|
|
137
|
+
| `v15` | `v16` |
|
|
138
|
+
| ------------------------- | --------------------------- |
|
|
139
|
+
| `.box-shadow` | `.color-shadow-small` |
|
|
140
|
+
| `.box-shadow-medium` | `.color-shadow-medium` |
|
|
141
|
+
| `.box-shadow-large` | `.color-shadow-large` |
|
|
142
|
+
| `.box-shadow-extra-large` | `.color-shadow-extra-large` |
|
|
143
|
+
|
|
144
|
+
### Link
|
|
145
|
+
|
|
146
|
+
The `link` utilities are part of the `Link` component.
|
|
147
|
+
|
|
148
|
+
| [`v15`](https://primer.style/css/utilities/colors##link-colors) | `v16` |
|
|
149
|
+
| --------------------------------------------------------------- | ------------------ |
|
|
150
|
+
| `.link-gray-dark` | `.Link--primary` |
|
|
151
|
+
| `.link-gray` | `.Link--secondary` |
|
|
152
|
+
| `.muted-link` | `.Link--muted` |
|
|
153
|
+
| `.link-hover-blue` | `.Link--onHover` |
|
|
154
|
+
| n/a | `.Link` |
|
|
155
|
+
|
|
156
|
+
## Mixins
|
|
157
|
+
|
|
158
|
+
| `v15` | `v16` |
|
|
159
|
+
| --------------- | ----- |
|
|
160
|
+
| `btn-solid()` | n/a |
|
|
161
|
+
| `btn-inverse()` | n/a |
|
|
162
|
+
| `btn-outline()` | n/a |
|
|
163
|
+
|
|
164
|
+
## Variables
|
|
165
|
+
|
|
166
|
+
See [color system](/support/color-system) for a list of all the functional CSS variables.
|
|
167
|
+
|
|
168
|
+
### Text
|
|
169
|
+
|
|
170
|
+
| `v15` | `v16` |
|
|
171
|
+
| ------------------------------------ | ------------------------------- |
|
|
172
|
+
| `$text-gray-dark` (`$gray-900`) | `var(--color-text-primary)` |
|
|
173
|
+
| `$text-gray` (`$gray-600`) | `var(--color-text-secondary)` |
|
|
174
|
+
| `$text-gray-light` (`$gray-500`) | `var(--color-text-tertiary)` |
|
|
175
|
+
| `$text-blue` (`$blue-500`) | `var(--color-text-link)` |
|
|
176
|
+
| `$text-green` (`$green-600`) | `var(--color-text-success)` |
|
|
177
|
+
| `$text-red` (`$red-600`) | `var(--color-text-danger)` |
|
|
178
|
+
| `$text-yellow` (`$yellow-800`) | `var(--color-text-warning)` |
|
|
179
|
+
| `$text-white` (`$white`) | `var(--color-text-white)` |
|
|
180
|
+
| n/a | `var(--color-text-inverse)` |
|
|
181
|
+
| n/a | `var(--color-text-placeholder)` |
|
|
182
|
+
| n/a | `var(--color-text-disabled)` |
|
|
183
|
+
| `$text-black` (`$black`) | n/a |
|
|
184
|
+
| `$text-orange` (`$orange-900`) | n/a |
|
|
185
|
+
| `$text-orange-light` (`$orange-600`) | n/a |
|
|
186
|
+
| `$text-purple` (`$purple-500`) | n/a |
|
|
187
|
+
| `$text-pink` (`$pink-500`) | n/a |
|
|
188
|
+
|
|
189
|
+
### Icon
|
|
190
|
+
|
|
191
|
+
| `v15` | `v16` |
|
|
192
|
+
| ----- | ----------------------------- |
|
|
193
|
+
| n/a | `var(--color-icon-primary)` |
|
|
194
|
+
| n/a | `var(--color-icon-secondary)` |
|
|
195
|
+
| n/a | `var(--color-icon-tertiary)` |
|
|
196
|
+
| n/a | `var(--color-icon-info)` |
|
|
197
|
+
| n/a | `var(--color-icon-danger)` |
|
|
198
|
+
| n/a | `var(--color-icon-success)` |
|
|
199
|
+
| n/a | `var(--color-icon-warning)` |
|
|
200
|
+
|
|
201
|
+
### Border
|
|
202
|
+
|
|
203
|
+
| `v15` | `v16` |
|
|
204
|
+
| ----------------------------------------------------- | ------------------------------- |
|
|
205
|
+
| `$border-color` (`$gray-200`) | `var(--color-border-primary)` |
|
|
206
|
+
| `$border-gray` (`$gray-200`) | `var(--color-border-primary)` |
|
|
207
|
+
| `$border-gray-light` (`lighten($gray-200, 3%)`) | `var(--color-border-secondary)` |
|
|
208
|
+
| `$border-gray-dark` (`$gray-300`) | `var(--color-border-tertiary)` |
|
|
209
|
+
| `$border-white` (`$white`) | `var(--color-border-inverse)` |
|
|
210
|
+
| `$border-blue` (`$blue-500`) | `var(--color-border-info)` |
|
|
211
|
+
| `$border-green` (`$green-400`) | `var(--color-border-success)` |
|
|
212
|
+
| `$border-red` (`$red-500`) | `var(--color-border-danger)` |
|
|
213
|
+
| `$border-yellow` (`$yellow-600`) | `var(--color-border-warning)` |
|
|
214
|
+
| `$border-gray-darker` (`$gray-700`) | n/a |
|
|
215
|
+
| `$border-blue-light` (`$blue-200`) | n/a |
|
|
216
|
+
| `$border-red-light` (`$red-300`) | n/a |
|
|
217
|
+
| `$border-purple` (`$purple-500`) | n/a |
|
|
218
|
+
| `$border-black-fade` (`$black-fade-15`) | n/a |
|
|
219
|
+
| `$border-white-fade` (`$white-fade-15`) | n/a |
|
|
220
|
+
| `$border-green-light` (`desaturate($green-300, 40%)`) | n/a |
|
|
221
|
+
|
|
222
|
+
### Background
|
|
223
|
+
|
|
224
|
+
| `v15` | `v16` |
|
|
225
|
+
| ----------------------------------- | --------------------------------- |
|
|
226
|
+
| `$bg-white` (`$white`) | `var(--color-bg-primary)` |
|
|
227
|
+
| `$bg-gray-light` (`$gray-000`) | `var(--color-bg-secondary)` |
|
|
228
|
+
| `$bg-gray` (`$gray-100`) | `var(--color-bg-tertiary)` |
|
|
229
|
+
| `$bg-gray-dark` (`$gray-900`) | `var(--color-bg-canvas-inverse)` |
|
|
230
|
+
| `$bg-red` (`$red-500`) | `var(--color-bg-danger-inverse)` |
|
|
231
|
+
| `$bg-red-light` (`$red-000`) | `var(--color-bg-danger)` |
|
|
232
|
+
| `$bg-green` (`$green-500`) | `var(--color-bg-success-inverse)` |
|
|
233
|
+
| `$bg-green-light` (`$green-100`) | `var(--color-bg-success)` |
|
|
234
|
+
| `$bg-blue` (`$blue-500`) | `var(--color-bg-info-inverse)` |
|
|
235
|
+
| `$bg-blue-light` (`$blue-000`) | `var(--color-bg-info)` |
|
|
236
|
+
| `$bg-yellow` (`$yellow-500`) | `var(--color-bg-warning-inverse)` |
|
|
237
|
+
| `$bg-yellow-light` (`$yellow-200`) | `var(--color-bg-warning)` |
|
|
238
|
+
| n/a | `var(--color-bg-canvas)` |
|
|
239
|
+
| n/a | `var(--color-bg-canvas-inset)` |
|
|
240
|
+
| n/a | `var(--color-bg-overlay)` |
|
|
241
|
+
| `$bg-black` (`$black`) | n/a |
|
|
242
|
+
| `$bg-black-fade` (`$black-fade-50`) | n/a |
|
|
243
|
+
| `$bg-orange` (`$orange-700`) | n/a |
|
|
244
|
+
| `$bg-purple` (`$purple-500`) | n/a |
|
|
245
|
+
| `$bg-purple-light` (`$purple-000`) | n/a |
|
|
246
|
+
| `$bg-pink` (`$pink-500`) | n/a |
|
|
247
|
+
| `$bg-yellow-dark` (`$yellow-700`) | n/a |
|
|
248
|
+
|
|
249
|
+
### Shadow
|
|
250
|
+
|
|
251
|
+
| `v15` | `v16` |
|
|
252
|
+
| ------------------------- | --------------------------------- |
|
|
253
|
+
| `$box-shadow` | `var(--color-shadow-small)` |
|
|
254
|
+
| `$box-shadow-medium` | `var(--color-shadow-medium)` |
|
|
255
|
+
| `$box-shadow-large` | `var(--color-shadow-large)` |
|
|
256
|
+
| `$box-shadow-extra-large` | `var(--color-shadow-extra-large)` |
|
|
257
|
+
| `$box-shadow-highlight` | `var(--color-shadow-highlight)` |
|
|
258
|
+
| `$box-shadow-inset` | `var(--color-shadow-inset)` |
|
|
259
|
+
| `$box-shadow-focus` | `var(--color-state-focus-shadow)` |
|
|
260
|
+
|
|
261
|
+
## Color system
|
|
262
|
+
|
|
263
|
+
| `v15` | `v16` |
|
|
264
|
+
| ----------- | --------------------------- |
|
|
265
|
+
| `$black` | `var(--color-scale-black)` |
|
|
266
|
+
| `$white` | `var(--color-scale-white)` |
|
|
267
|
+
| `$gray-000` | `var(--color-scale-gray-0)` |
|
|
268
|
+
| `$gray-100` | `var(--color-scale-gray-1)` |
|
|
269
|
+
| `$gray-200` | `var(--color-scale-gray-2)` |
|
|
270
|
+
| ... | ... |
|
|
271
|
+
| `$pink-700` | `var(--color-scale-pink-7)` |
|
|
272
|
+
| `$pink-800` | `var(--color-scale-pink-8)` |
|
|
273
|
+
| `$pink-900` | `var(--color-scale-pink-9)` |
|
|
274
|
+
|
|
275
|
+
## Auto colors
|
|
276
|
+
|
|
277
|
+
| `v15` | `v16` |
|
|
278
|
+
| ----- | -------------------------- |
|
|
279
|
+
| n/a | `var(--color-auto-black)` |
|
|
280
|
+
| n/a | `var(--color-auto-white)` |
|
|
281
|
+
| n/a | `var(--color-auto-gray-0)` |
|
|
282
|
+
| n/a | `var(--color-auto-gray-1)` |
|
|
283
|
+
| n/a | `var(--color-auto-gray-2)` |
|
|
284
|
+
| ... | ... |
|
|
285
|
+
| n/a | `var(--color-auto-pink-7)` |
|
|
286
|
+
| n/a | `var(--color-auto-pink-8)` |
|
|
287
|
+
| n/a | `var(--color-auto-pink-9)` |
|
|
288
|
+
|
|
289
|
+
Note: The `auto` colors automatically invert based on the color mode. Example:
|
|
290
|
+
|
|
291
|
+
| Variable | In `light` mode | In `dark` mode |
|
|
292
|
+
| -------------------------- | --------------- | -------------- |
|
|
293
|
+
| `var(--color-auto-gray-0)` | light gray | dark gray |
|
|
294
|
+
| `var(--color-auto-gray-9)` | dark gray | light gray |
|
|
295
|
+
|
|
296
|
+
This doesn't work perfectly all the time, so you should use functional variables as much as possible. But in some cases auto colors can still be handy.
|
|
297
|
+
|
|
298
|
+
## Misc
|
|
299
|
+
|
|
300
|
+
A few more selectors and variables were removed. Please refer to [deprecations.js](https://github.com/primer/css/blob/main/deprecations.js) for a complete list.
|
|
@@ -0,0 +1,80 @@
|
|
|
1
|
+
Primer CSS `v18.0.0` replaces color modes V1 with V2. To help with the migration, please refer to the guide below.
|
|
2
|
+
|
|
3
|
+
<Note>
|
|
4
|
+
The functional CSS color variables changed as well. Please refer to the <a href="https://primer.style/primitives/colors#deprecated-variables">deprecated variables section</a>.
|
|
5
|
+
</Note>
|
|
6
|
+
|
|
7
|
+
## Utility classes
|
|
8
|
+
|
|
9
|
+
See [color utility classes](/utilities/colors) for a list of all the functional color utility classes.
|
|
10
|
+
|
|
11
|
+
### Text
|
|
12
|
+
|
|
13
|
+
| `v16` | `v18` |
|
|
14
|
+
| ----------------------- | ----------------------- |
|
|
15
|
+
| `.color-text-primary` | `.color-fg-default` |
|
|
16
|
+
| `.color-text-secondary` | `.color-fg-muted` |
|
|
17
|
+
| `.color-text-tertiary` | `.color-fg-muted` |
|
|
18
|
+
| `.color-text-link` | `.color-fg-accent` |
|
|
19
|
+
| `.color-text-success` | `.color-fg-success` |
|
|
20
|
+
| `.color-text-warning` | `.color-fg-attention` |
|
|
21
|
+
| `.color-text-danger` | `.color-fg-danger` |
|
|
22
|
+
| `.color-text-inverse` | `.color-fg-on-emphasis` |
|
|
23
|
+
| `.color-text-white` | n/a* |
|
|
24
|
+
|
|
25
|
+
* Often `.color-text-white` can be replaced with `.color-fg-on-emphasis`, but there are some cases where that's not ideal. If in doubt, please reach out to the `#primer` team.
|
|
26
|
+
|
|
27
|
+
### Icon
|
|
28
|
+
|
|
29
|
+
| `v16` | `v18` |
|
|
30
|
+
| ----------------------- | --------------------- |
|
|
31
|
+
| `.color-icon-primary` | `.color-fg-default` |
|
|
32
|
+
| `.color-icon-secondary` | `.color-fg-muted` |
|
|
33
|
+
| `.color-icon-tertiary` | `.color-fg-muted` |
|
|
34
|
+
| `.color-icon-info` | `.color-fg-accent` |
|
|
35
|
+
| `.color-icon-danger` | `.color-fg-danger` |
|
|
36
|
+
| `.color-icon-success` | `.color-fg-success` |
|
|
37
|
+
| `.color-icon-warning` | `.color-fg-attention` |
|
|
38
|
+
|
|
39
|
+
### Border
|
|
40
|
+
|
|
41
|
+
| `v16` | `v18` |
|
|
42
|
+
| ------------------------- | ---------------------------------- |
|
|
43
|
+
| `.color-border-primary` | `.color-border-default` |
|
|
44
|
+
| `.color-border-secondary` | `.color-border-muted` |
|
|
45
|
+
| `.color-border-tertiary` | `.color-border-default` |
|
|
46
|
+
| `.color-border-inverse` | n/a |
|
|
47
|
+
| `.color-border-info` | `.color-border-accent-emphasis` |
|
|
48
|
+
| `.color-border-warning` | `.color-border-attention-emphasis` |
|
|
49
|
+
|
|
50
|
+
### Background
|
|
51
|
+
|
|
52
|
+
| `v16` | `v18` |
|
|
53
|
+
| --------------------------- | ------------------------------ |
|
|
54
|
+
| `.color-bg-canvas` | `.color-bg-default` |
|
|
55
|
+
| `.color-bg-canvas-inverse` | `.color-bg-emphasis` |
|
|
56
|
+
| `.color-bg-canvas-inset` | `.color-bg-inset` |
|
|
57
|
+
| `.color-bg-primary` | `.color-bg-default` |
|
|
58
|
+
| `.color-bg-secondary` | `.color-bg-subtle` |
|
|
59
|
+
| `.color-bg-tertiary` | `.color-bg-subtle` |
|
|
60
|
+
| `.color-bg-info` | `.color-bg-accent` |
|
|
61
|
+
| `.color-bg-info-inverse` | `.color-bg-accent-emphasis` |
|
|
62
|
+
| `.color-bg-danger-inverse` | `.color-bg-danger-emphasis` |
|
|
63
|
+
| `.color-bg-success-inverse` | `.color-bg-success-emphasis` |
|
|
64
|
+
| `.color-bg-warning` | `.color-bg-attention` |
|
|
65
|
+
| `.color-bg-warning-inverse` | `.color-bg-attention-emphasis` |
|
|
66
|
+
|
|
67
|
+
## Misc
|
|
68
|
+
|
|
69
|
+
| `v16` | `v18` |
|
|
70
|
+
| --------------- | ------------------- |
|
|
71
|
+
| `.text-inherit` | `.color-fg-inherit` |
|
|
72
|
+
|
|
73
|
+
A few more selectors and variables were removed. Please refer to [deprecations.json](https://github.com/primer/css/blob/main/src/deprecations.json) for a complete list.
|
|
74
|
+
|
|
75
|
+
Note: The `<kbd>` styles also got removed from the markdown bundle. In case you import the `markdown` bundle **without** the `base` bundle, make sure to import the `<kbd>` styles as well:
|
|
76
|
+
|
|
77
|
+
```diff
|
|
78
|
+
@import "@primer/css/markdown/index.scss";
|
|
79
|
+
+ @import "@primer/css/base/kbd.scss";
|
|
80
|
+
```
|