@primer/react
Version:
An implementation of GitHub's Primer Design System using React
1 lines • 1.52 kB
Source Map (JSON)
{"version":3,"sources":["../src/ProgressBar/ProgressBar.module.css"],"names":[],"mappings":"AAAA,yCACE,GACE,kBACF,CAEA,GACE,eACF,CACF,CAEA,uCAGE,mCAAoC,CAFpC,2BAaF,CATE,8CACE,2DAIE,qBAAsB,CACtB,kCAAmC,CAFnC,4CAAuB,CAFvB,8DAAqE,CACrE,cAIF,CACF,CAGF,4CAIE,uEAA4C,CAC5C,gDAAwC,CAJxC,YAAa,CAKb,OAAQ,CAJR,eAqBF,CAfE,kFACE,mBACF,CAEA,oFACE,UACF,CAEA,kFACE,UACF,CAEA,kFACE,WACF","file":"ProgressBar-430cdef7.css","sourcesContent":["@keyframes shimmer {\n from {\n mask-position: 200%;\n }\n\n to {\n mask-position: 0%;\n }\n}\n\n.ProgressBarItem {\n width: var(--progress-width);\n /* stylelint-disable-next-line primer/colors */\n background-color: var(--progress-bg);\n\n @media (prefers-reduced-motion: no-preference) {\n &[data-animated='true'] {\n mask-image: linear-gradient(75deg, #000 30%, rgba(0, 0, 0, 0.65) 80%);\n mask-size: 200%;\n animation-name: shimmer;\n animation-duration: 1s;\n animation-iteration-count: infinite;\n }\n }\n}\n\n.ProgressBarContainer {\n display: flex;\n overflow: hidden;\n /* stylelint-disable-next-line primer/colors */\n background-color: var(--borderColor-default);\n border-radius: var(--borderRadius-small);\n gap: 2px;\n\n &:where([data-progress-display='inline']) {\n display: inline-flex;\n }\n\n &:where([data-progress-bar-size='default']) {\n height: 8px;\n }\n\n &:where([data-progress-bar-size='small']) {\n height: 5px;\n }\n\n &:where([data-progress-bar-size='large']) {\n height: 10px;\n }\n}\n"]}