@shopify/polaris/dist/esnext/components/ActionList/ActionList.css

Shopify’s product component library

.Polaris-ActionList_z4041{ list-style:none; margin:0; padding:0.8rem 0; }

.Polaris-ActionList__Section--withoutTitle_1vpsz:not(:first-child){ border-top:0.1rem solid var(--p-divider, #dfe3e8); margin-top:0.8rem; padding-top:0.8rem; }

.Polaris-ActionList__Actions_17m67{ list-style:none; margin:0; padding:0; border-top:0.1rem solid var(--p-divider, #dfe3e8); }

.Polaris-ActionList__Actions_17m67.Polaris-ActionList--newDesignLanguage_1rik8{ padding:0 0.8rem; border-color:var(--p-surface-neutral); }

.Polaris-ActionList__Title_2qj8j + .Polaris-ActionList__Actions_17m67.Polaris-ActionList--newDesignLanguage_1rik8{ padding-top:0.8rem; }

.Polaris-ActionList_z4041 > .Polaris-ActionList__Section--withoutTitle_1vpsz .Polaris-ActionList__Actions_17m67, .Polaris-ActionList__Section_1b1h1:first-child > .Polaris-ActionList__Section--withoutTitle_1vpsz .Polaris-ActionList__Actions_17m67{ border-top:none; }

.Polaris-ActionList__Title_2qj8j{ font-size:1.3rem; font-weight:600; line-height:1.6rem; text-transform:uppercase; padding:1.2rem 1.6rem; }

@media (min-width: 40em){ .Polaris-ActionList__Title_2qj8j{ font-size:1.2rem; } }

.Polaris-ActionList__Item_yiyol{ -webkit-appearance:none; -moz-appearance:none; appearance:none; margin:0; padding:0; background:none; border:none; font-size:inherit; line-height:inherit; cursor:pointer; color:inherit; text-decoration:none; display:block; width:100%; min-height:4rem; padding:1rem 1.6rem; text-align:left; cursor:pointer; border-radius:0; }

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

.Polaris-ActionList__Item_yiyol:visited{ color:inherit; }

.Polaris-ActionList__Item_yiyol.Polaris-ActionList--active_jeq8y{ background-image:linear-gradient(rgba(179, 188, 245, 0.1), rgba(179, 188, 245, 0.1)); }

.Polaris-ActionList__Item_yiyol:active{ background-image:linear-gradient(rgba(179, 188, 245, 0.1), rgba(179, 188, 245, 0.1)); }

.Polaris-ActionList__Item_yiyol:active:hover{ background-image:linear-gradient(rgba(179, 188, 245, 0.1), rgba(179, 188, 245, 0.1)), linear-gradient(rgba(223, 227, 232, 0.3), rgba(223, 227, 232, 0.3)); }

.Polaris-ActionList__Item_yiyol:active:hover:focus{ box-shadow:inset 0.2rem 0 0 #5c6ac4; background-image:linear-gradient(rgba(179, 188, 245, 0.1), rgba(179, 188, 245, 0.1)), linear-gradient(rgba(223, 227, 232, 0.3), rgba(223, 227, 232, 0.3)), linear-gradient(rgba(223, 227, 232, 0.3), rgba(223, 227, 232, 0.3)); }

.Polaris-ActionList__Item_yiyol:hover{ background-image:linear-gradient(rgba(223, 227, 232, 0.3), rgba(223, 227, 232, 0.3)); }

.Polaris-ActionList__Item_yiyol:hover:focus{ box-shadow:inset 0.2rem 0 0 #5c6ac4; background-image:linear-gradient(rgba(223, 227, 232, 0.3), rgba(223, 227, 232, 0.3)), linear-gradient(rgba(223, 227, 232, 0.3), rgba(223, 227, 232, 0.3)); }

.Polaris-ActionList__Item_yiyol:focus{ box-shadow:inset 0.2rem 0 0 #5c6ac4; background-image:linear-gradient(rgba(223, 227, 232, 0.3), rgba(223, 227, 232, 0.3)); }

.Polaris-ActionList__Item_yiyol.Polaris-ActionList--destructive_zy6o5{ color:#bf0711; }

.Polaris-ActionList__Item_yiyol.Polaris-ActionList--destructive_zy6o5 svg{ fill:#bf0711; }

.Polaris-ActionList__Item_yiyol.Polaris-ActionList--destructive_zy6o5:active{ background-image:linear-gradient(rgba(220, 56, 37, 0.03), rgba(220, 56, 37, 0.03)); }

.Polaris-ActionList__Item_yiyol.Polaris-ActionList--destructive_zy6o5:active:hover{ background-image:linear-gradient(rgba(220, 56, 37, 0.03), rgba(220, 56, 37, 0.03)), linear-gradient(rgba(251, 234, 229, 0.4), rgba(251, 234, 229, 0.4)); }

.Polaris-ActionList__Item_yiyol.Polaris-ActionList--destructive_zy6o5:active:hover:focus{ box-shadow:inset 0.2rem 0 0 #de3618; background-image:linear-gradient(rgba(220, 56, 37, 0.03), rgba(220, 56, 37, 0.03)), linear-gradient(rgba(251, 234, 229, 0.4), rgba(251, 234, 229, 0.4)), linear-gradient(rgba(251, 234, 229, 0.4), rgba(251, 234, 229, 0.4)); }

.Polaris-ActionList__Item_yiyol.Polaris-ActionList--destructive_zy6o5:hover{ background-image:linear-gradient(rgba(251, 234, 229, 0.4), rgba(251, 234, 229, 0.4)); }

.Polaris-ActionList__Item_yiyol.Polaris-ActionList--destructive_zy6o5:hover:focus{ box-shadow:inset 0.2rem 0 0 #de3618; background-image:linear-gradient(rgba(251, 234, 229, 0.4), rgba(251, 234, 229, 0.4)), linear-gradient(rgba(251, 234, 229, 0.4), rgba(251, 234, 229, 0.4)); }

.Polaris-ActionList__Item_yiyol.Polaris-ActionList--destructive_zy6o5:focus{ box-shadow:inset 0.2rem 0 0 #de3618; background-image:linear-gradient(rgba(251, 234, 229, 0.4), rgba(251, 234, 229, 0.4)); }

.Polaris-ActionList__Item_yiyol.Polaris-ActionList--disabled_hcuh9{ background-image:linear-gradient(#f9fafb, #f9fafb); color:#919eab; pointer-events:none; }

.Polaris-ActionList__Item_yiyol.Polaris-ActionList--disabled_hcuh9 .Polaris-ActionList__Prefix_10fbz svg, .Polaris-ActionList__Item_yiyol.Polaris-ActionList--disabled_hcuh9 .Polaris-ActionList__Suffix_10fbu svg{ fill:#919eab; color:white; }

.Polaris-ActionList__Item_yiyol::-moz-focus-inner{ border:none; }

.Polaris-ActionList__Item_yiyol.Polaris-ActionList--newDesignLanguage_1rik8{ padding:1rem 0.8rem; border-radius:var(--p-border-radius-base); border-top:1px solid var(--p-surface); position:relative; }

.Polaris-ActionList__Item_yiyol.Polaris-ActionList--newDesignLanguage_1rik8:hover{ background-image:none; background-color:var(--p-surface-hovered); color:inherit; text-decoration:none; }

@media (-ms-high-contrast: active){ .Polaris-ActionList__Item_yiyol.Polaris-ActionList--newDesignLanguage_1rik8:hover{ outline:1px solid windowText; } }

.Polaris-ActionList__Item_yiyol.Polaris-ActionList--newDesignLanguage_1rik8.Polaris-ActionList--active_jeq8y, .Polaris-ActionList__Item_yiyol.Polaris-ActionList--newDesignLanguage_1rik8:active{ background-image:none; }

.Polaris-ActionList__Item_yiyol.Polaris-ActionList--newDesignLanguage_1rik8.Polaris-ActionList--active_jeq8y svg, .Polaris-ActionList__Item_yiyol.Polaris-ActionList--newDesignLanguage_1rik8:active svg{ fill:var(--p-interactive); }

.Polaris-ActionList__Item_yiyol.Polaris-ActionList--newDesignLanguage_1rik8:active{ background-color:var(--p-surface-pressed); }

.Polaris-ActionList__Item_yiyol.Polaris-ActionList--newDesignLanguage_1rik8.Polaris-ActionList--active_jeq8y{ background-color:var(--p-surface-selected); }

[aria-selected='true'] > .Polaris-ActionList__Item_yiyol.Polaris-ActionList--newDesignLanguage_1rik8::before{ content:''; position:absolute; top:0; bottom:0; left:-0.4rem; height:100%; width:0.3rem; background-color:var(--p-interactive); border-top-right-radius:var(--p-border-radius-base); border-bottom-right-radius:var(--p-border-radius-base); transform:translateX(-100%); }

.Polaris-ActionList__Item_yiyol.Polaris-ActionList--newDesignLanguage_1rik8:active:hover:focus{ box-shadow:none; background-image:none; }

.Polaris-ActionList__Item_yiyol.Polaris-ActionList--newDesignLanguage_1rik8:hover:focus{ box-shadow:none; background-image:none; }

.Polaris-ActionList__Item_yiyol.Polaris-ActionList--newDesignLanguage_1rik8:focus{ box-shadow:none; background-image:none; }

.Polaris-ActionList__Item_yiyol.Polaris-ActionList--newDesignLanguage_1rik8::after{ content:var(--p-non-null-content, none); position:absolute; z-index:1; top:-0.1rem; right:-0.1rem; bottom:-0.1rem; left:-0.1rem; display:block; pointer-events:none; box-shadow:0 0 0 -0.1rem var(--p-focused); transition:box-shadow 100ms var(--p-ease); border-radius:calc(var(--p-border-radius-base) + 0.1rem); }

.Polaris-ActionList__Item_yiyol.Polaris-ActionList--newDesignLanguage_1rik8:focus:not(:active)::after{ box-shadow:0 0 0 0.2rem var(--p-focused); }

@media (-ms-high-contrast: active){ .Polaris-ActionList__Item_yiyol.Polaris-ActionList--newDesignLanguage_1rik8:focus:not(:active)::after{ outline:1px solid windowText; } }

.Polaris-ActionList__Item_yiyol.Polaris-ActionList--newDesignLanguage_1rik8.Polaris-ActionList--destructive_zy6o5{ color:var(--p-interactive-critical); }

.Polaris-ActionList__Item_yiyol.Polaris-ActionList--newDesignLanguage_1rik8.Polaris-ActionList--destructive_zy6o5 svg{ fill:var(--p-icon-critical); }

.Polaris-ActionList__Item_yiyol.Polaris-ActionList--newDesignLanguage_1rik8.Polaris-ActionList--destructive_zy6o5:hover{ background-image:none; background-color:var(--p-surface-critical-subdued-hovered); }

.Polaris-ActionList__Item_yiyol.Polaris-ActionList--newDesignLanguage_1rik8.Polaris-ActionList--destructive_zy6o5.Polaris-ActionList--active_jeq8y, .Polaris-ActionList__Item_yiyol.Polaris-ActionList--newDesignLanguage_1rik8.Polaris-ActionList--destructive_zy6o5:active{ background-image:none; background-color:var(--p-surface-critical-subdued-pressed); }

.Polaris-ActionList__Item_yiyol.Polaris-ActionList--newDesignLanguage_1rik8.Polaris-ActionList--destructive_zy6o5:active:hover:focus{ box-shadow:none; background-image:none; }

.Polaris-ActionList__Item_yiyol.Polaris-ActionList--newDesignLanguage_1rik8.Polaris-ActionList--destructive_zy6o5:hover:focus{ box-shadow:none; background-image:none; }

.Polaris-ActionList__Item_yiyol.Polaris-ActionList--newDesignLanguage_1rik8.Polaris-ActionList--destructive_zy6o5:focus{ box-shadow:none; background-image:none; }

.Polaris-ActionList__Item_yiyol.Polaris-ActionList--newDesignLanguage_1rik8.Polaris-ActionList--disabled_hcuh9{ background-image:none; color:var(--p-text-disabled); }

.Polaris-ActionList__Item_yiyol.Polaris-ActionList--newDesignLanguage_1rik8.Polaris-ActionList--disabled_hcuh9 .Polaris-ActionList__Prefix_10fbz svg, .Polaris-ActionList__Item_yiyol.Polaris-ActionList--newDesignLanguage_1rik8.Polaris-ActionList--disabled_hcuh9 .Polaris-ActionList__Suffix_10fbu svg{ fill:var(--p-icon-disabled); }

.Polaris-ActionList__Content_xd1mk{ display:flex; align-items:center; }

.Polaris-ActionList__Prefix_10fbz{ display:flex; flex:0 0 auto; justify-content:center; align-items:center; height:2rem; width:2rem; border-radius:3px; margin:-1rem 1.6rem -1rem 0; background-size:cover; background-position:center center; }

.Polaris-ActionList__Prefix_10fbz svg{ fill:#454f5b; color:white; }

.Polaris-ActionList__Prefix_10fbz.Polaris-ActionList--newDesignLanguage_1rik8 svg{ fill:var(--p-icon); }

.Polaris-ActionList__Suffix_10fbu{ margin-left:1.6rem; }

.Polaris-ActionList__Suffix_10fbu svg{ fill:#454f5b; color:white; }

.Polaris-ActionList__Suffix_10fbu.Polaris-ActionList--newDesignLanguage_1rik8 svg{ fill:var(--p-icon); }

.Polaris-ActionList__Text_yj3uv{ min-width:0; max-width:100%; flex:1 1 auto; }