@primer/react-brand
Version:
Primer Brand is a GitHub's design system for creating React-based marketing websites and digital experiences.
2 lines (1 loc) • 2.92 kB
CSS
.Primer_Brand__Link-module__Link___lF11y{--visual-width:var(--external-icon-size,var(--arrow-size,0px));--gap:0px;-moz-column-gap:0px;-moz-column-gap:var(--gap);column-gap:0;column-gap:var(--gap);cursor:pointer;justify-content:center;align-items:center;-webkit-text-decoration:none;text-decoration:none;display:inline-flex;position:relative}.Primer_Brand__Link-module__Link--arrow-start___Cyw51,.Primer_Brand__Link-module__Link--arrow-end___esdN8{--gap:var(--base-size-4);--arrow-size:var(--base-size-16);position:relative;top:.05em}.Primer_Brand__Link-module__Link--arrow-start___Cyw51.Primer_Brand__Link-module__Link--large___mTWWi,.Primer_Brand__Link-module__Link--arrow-end___esdN8.Primer_Brand__Link-module__Link--large___mTWWi{--arrow-size:var(--base-size-20)}.Primer_Brand__Link-module__Link--is-external___xsncV{--gap:var(--base-size-4);--external-icon-size:var(--base-size-16)}.Primer_Brand__Link-module__Link--is-external___xsncV.Primer_Brand__Link-module__Link--large___mTWWi{--external-icon-size:var(--base-size-20)}.Primer_Brand__Link-module__Link___lF11y:hover{-webkit-text-decoration:none;text-decoration:none}.Primer_Brand__Link-module__Link___lF11y:after{width:calc(100% - var(--gap) - var(--visual-width));pointer-events:none;content:"";border:var(--brand-borderWidth-thin) solid currentColor;transform-origin:0 0;position:absolute;bottom:-.15em;left:0;transform:scaleX(0)}@media screen and (prefers-reduced-motion:no-preference){.Primer_Brand__Link-module__Link___lF11y:after{transition:transform var(--brand-animation-duration-fast) ease}}.Primer_Brand__Link-module__Link___lF11y:active:after,.Primer_Brand__Link-module__Link___lF11y:hover:after{transform:scaleX(1)}.Primer_Brand__Link-module__Link___lF11y:focus:focus-visible{outline:var(--brand-borderWidth-thick) solid var(--brand-color-focus);outline-offset:var(--base-size-2)}.Primer_Brand__Link-module__Link--default___VRVW0,.Primer_Brand__Link-module__Link--default___VRVW0 span{color:var(--brand-Link-color-default)}.Primer_Brand__Link-module__Link--accent___eC6rQ,.Primer_Brand__Link-module__Link--accent___eC6rQ span{color:var(--brand-Link-color-accent)}.Primer_Brand__Link-module__Link--label___jM8Ty{font-weight:var(--base-text-weight-medium);color:inherit}.Primer_Brand__Link-module__Link--large___mTWWi .Primer_Brand__Link-module__Link--label___jM8Ty{font-size:var(--base-size-20)}.Primer_Brand__Link-module__Link--large___mTWWi .Primer_Brand__Link-module__Link-arrow___yd78i{width:var(--arrow-size);height:var(--arrow-size)}.Primer_Brand__Link-module__Link--arrow-start___Cyw51:after{transform-origin:right 0;left:auto;right:0}@media (prefers-reduced-motion:reduce){.Primer_Brand__Link-module__Link___lF11y,.Primer_Brand__Link-module__Link___lF11y:before,.Primer_Brand__Link-module__Link___lF11y:after,.Primer_Brand__Link-module__Link___lF11y *{scroll-behavior:auto;transition:none;animation:none}}