polaris-glints/build/esnext/components/Tag/Tag.css

Glints forked polaris react

.Polaris-Tag_375hg { display: inline-flex; max-width: 100%; align-items: center; min-height: 1.75rem; padding: 0 var(--p-space-2); background-color: var(--p-surface-neutral); border-radius: var(--p-border-radius-1); color: var(--p-text); }

.Polaris-Tag_375hg.Polaris-Tag--disabled_hcuh9 { transition: none; background: var(--p-surface-neutral-disabled); color: var(--p-text-disabled); }

.Polaris-Tag_375hg.Polaris-Tag--disabled_hcuh9 svg { fill: var(--p-icon-disabled); }

.Polaris-Tag_375hg.Polaris-Tag--clickable_1prth { -webkit-appearance: none; appearance: none; margin: 0; padding: 0; background: none; border: none; font-size: inherit; line-height: inherit; color: inherit; cursor: pointer; cursor: pointer; padding: var(--p-space-1) var(--p-space-2); background-color: var(--p-surface-neutral); outline: var(--p-border-width-1) solid transparent; font-size: 0.8125rem; line-height: var(--p-font-line-height-2); position: relative; }

.Polaris-Tag_375hg.Polaris-Tag--clickable_1prth:focus { outline: none; }

.Polaris-Tag_375hg.Polaris-Tag--clickable_1prth:hover { background: var(--p-surface-neutral-hovered); }

.Polaris-Tag_375hg.Polaris-Tag--clickable_1prth::after { content: ''; position: absolute; z-index: 1; top: -0.0625rem; right: -0.0625rem; bottom: -0.0625rem; left: -0.0625rem; display: block; pointer-events: none; box-shadow: 0 0 0 -0.0625rem var(--p-focused); transition: box-shadow var(--p-duration-100) var(--p-ease); border-radius: var(--p-border-radius-1); }

.Polaris-Tag_375hg.Polaris-Tag--clickable_1prth:focus:not(:active)::after { box-shadow: 0 0 0 0.125rem var(--p-focused); outline: var(--p-border-width-1) solid transparent; }

.Polaris-Tag_375hg.Polaris-Tag--clickable_1prth:active { background: var(--p-surface-neutral-pressed); }

.Polaris-Tag_375hg.Polaris-Tag--clickable_1prth:disabled { background: var(--p-surface-neutral-disabled); cursor: default; pointer-events: none; color: var(--p-text-disabled); }

@media (min-width: 30.625em) { .Polaris-Tag_375hg.Polaris-Tag--clickable_1prth { padding: var(--p-space-05) var(--p-space-2); font-size: var(--p-font-size-75); } }

.Polaris-Tag_375hg.Polaris-Tag--removable_1q527 { padding-right: 0; }

.Polaris-Tag_375hg.Polaris-Tag--linkable_1fdmd { padding: 0; }

@media (min-width: 30.625em) { .Polaris-Tag_375hg { min-height: 1.5rem; } }

.Polaris-Tag__TagText_lsfh6 { font-size: 0.8125rem; line-height: var(--p-font-line-height-2); min-height: 1.25rem; padding: var(--p-space-1) 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; vertical-align: middle; }

@media (min-width: 30.625em) { .Polaris-Tag__TagText_lsfh6 { font-size: var(--p-font-size-75); padding: var(--p-space-05) 0; } }

.Polaris-Tag__Button_r99lw { -webkit-appearance: none; appearance: none; margin: 0; padding: 0; background: none; border: none; font-size: inherit; line-height: inherit; color: inherit; cursor: pointer; display: block; flex-shrink: 0; height: 1.25rem; width: 1.25rem; margin: 0 var(--p-space-1); border-radius: var(--p-border-radius-half); position: relative; }

.Polaris-Tag__Button_r99lw svg { fill: var(--p-icon); }

.Polaris-Tag__Button_r99lw:focus { outline: none; }

.Polaris-Tag__Button_r99lw:hover { background: var(--p-surface-neutral-hovered); outline: var(--p-border-width-1) solid transparent; }

.Polaris-Tag__Button_r99lw::after { content: ''; position: absolute; z-index: 1; top: -0.0625rem; right: -0.0625rem; bottom: -0.0625rem; left: -0.0625rem; display: block; pointer-events: none; box-shadow: 0 0 0 -0.0625rem var(--p-focused); transition: box-shadow var(--p-duration-100) var(--p-ease); border-radius: var(--p-border-radius-1); }

.Polaris-Tag__Button_r99lw:focus:not(:active)::after { box-shadow: 0 0 0 0.125rem var(--p-focused); outline: var(--p-border-width-1) solid transparent; }

.Polaris-Tag__Button_r99lw:active { background: var(--p-surface-neutral-pressed); }

.Polaris-Tag__Button_r99lw:disabled { cursor: default; pointer-events: none; }

.Polaris-Tag__Button_r99lw:disabled svg { fill: var(--p-icon-disabled); }

.Polaris-Tag__Button_r99lw.Polaris-Tag--segmented_150jh { margin-left: calc(var(--p-space-1)*-1); }

.Polaris-Tag__Link_yj5sy { display: inline-grid; color: var(--p-text); outline: none; border-radius: var(--p-border-radius-base); text-decoration: none; min-height: 1.25rem; padding: 0 var(--p-space-2); position: relative; }

.Polaris-Tag__Link_yj5sy .Polaris-Tag__LinkText_8qt8f { overflow: hidden; white-space: nowrap; text-overflow: ellipsis; font-size: 0.8125rem; line-height: var(--p-font-line-height-2); padding-top: var(--p-space-1); padding-bottom: var(--p-space-1); }

@media (min-width: 30.625em) { .Polaris-Tag__Link_yj5sy .Polaris-Tag__LinkText_8qt8f { font-size: var(--p-font-size-75); padding-top: var(--p-space-05); padding-bottom: var(--p-space-05); } }

.Polaris-Tag__Link_yj5sy::after { content: ''; position: absolute; z-index: 1; top: -0.0625rem; right: -0.0625rem; bottom: -0.0625rem; left: -0.0625rem; display: block; pointer-events: none; box-shadow: 0 0 0 -0.0625rem var(--p-focused); transition: box-shadow var(--p-duration-100) var(--p-ease); border-radius: var(--p-border-radius-1); }

.Polaris-Tag__Link_yj5sy:focus:not(:active) { text-decoration: underline; }

.Polaris-Tag__Link_yj5sy:focus:not(:active)::after { box-shadow: 0 0 0 0.125rem var(--p-focused); outline: var(--p-border-width-1) solid transparent; }

.Polaris-Tag__Link_yj5sy:hover { background: var(--p-surface-neutral-hovered); text-decoration: underline; }

.Polaris-Tag__Link_yj5sy.Polaris-Tag--segmented_150jh:hover { background: none; }

.Polaris-Tag__Link_yj5sy.Polaris-Tag--segmented_150jh::after { margin-right: var(--p-space-1); }