woocommerce/plugins/woocommerce-admin/client/quick-links/style.scss

63 lines
1.5 KiB
SCSS

.woocommerce-page .woocommerce-quick-links {
$background-color: $white;
background-color: $background-color;
.components-card__body.is-size-large {
padding: 0;
}
}
.woocommerce-page .woocommerce-quick-links__list {
margin: 0;
padding: 0;
.woocommerce-list__item {
// Ideally, we'd get these from `@wordpress/base-styles`.
// However, currently we are on an old version of `@wordpress/base-styles`,
// and updating that causes compatibility issues with the version of
// `@wordpress/components` that we are using, and updating that introduces
// breaking changes that we would need to address elsewhere in the
// `woocommerce-admin` codebase.
//
// https://github.com/woocommerce/woocommerce-admin/issues/4383
$chevron-color: #1e1e1e; // $dark-gray-primary
$background-color: $white;
$background-color-hover: #f8f9f9; // $light-gray-100
$border-color: #e7e8e9; // $light-gray-tertiary
$foreground-color: theme(button); // $theme-color
$foreground-color-hover: color($foreground-color shade(20%));
background-color: $background-color;
&:not(:first-child) {
border-top: 1px solid $border-color;
}
&:hover {
background-color: $background-color-hover;
.woocommerce-list__item-title {
color: $foreground-color-hover;
}
.woocommerce-list__item-before > svg {
fill: $foreground-color-hover;
}
}
.woocommerce-list__item-title {
color: $foreground-color;
}
.woocommerce-list__item-before > svg {
fill: $foreground-color;
}
.woocommerce-list__item-after > svg {
fill: $chevron-color;
}
}
}