Steve-Dee-Designs
/
woocommerce
mirror of https://github.com/woocommerce/woocommerce.git
1
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

Fix style of tooltip

This commit is contained in:
Dan Q 2023-09-22 11:05:42 +01:00 committed by raicem
parent 99838028cf
commit 9be2708c9e
2 changed files with 43 additions and 5 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

29
plugins/woocommerce-admin/client/marketplace/components/my-subscriptions/my-subscriptions.scss
View File

@ -0,0 +1,29 @@
/* Tooltip doesn't look exactly like a standard <Tooltip> */
.woocommerce-marketplace__my-subscriptions {
.components-tooltip .components-popover__content {
background: var(--wc-content-bg);
border: 1px solid var(--wp-admin-theme-color);
border-radius: 4px;
color: var(--wc-secondary-text);
text-align: left;
& > * {
margin: 8px 0;
}
h3 {
font-size: 1.1em;
}
.woocommerce-marketplace__my-subscriptions__tooltip-external-link:after {
background: url('data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20width%3D%2224%22%20height%3D%2224%22%20aria-hidden%3D%22true%22%20focusable%3D%22false%22%3E%3Cpath%20d%3D%22M19.5%204.5h-7V6h4.44l-5.97%205.97%201.06%201.06L18%207.06v4.44h1.5v-7Zm-13%201a2%202%200%200%200-2%202v10a2%202%200%200%200%202%202h10a2%202%200%200%200%202-2v-3H17v3a.5.5%200%200%201-.5.5h-10a.5.5%200%200%201-.5-.5v-10a.5.5%200%200%201%20.5-.5h3V5.5h-3Z%22%20fill%3D%22%230073aa%22%3E%3C%2Fpath%3E%3C%2Fsvg%3E');
background-position: 0 3px;
background-repeat: no-repeat;
background-size: contain;
content: '';
display: inline-block;
height: 15px;
width: 15px;
}
}
}

19
plugins/woocommerce-admin/client/marketplace/components/my-subscriptions/my-subscriptions.tsx
View File

@ -112,11 +112,20 @@ export default function MySubscriptions(): JSX.Element {
<Tooltip
text={
<>
<h3>Still don&apos;t see your subscriptions?</h3>
<p>
To see all your subscriptions go to your
account on WooCommerce.com.
</p>
<h3>
{ __(
"Still don't see your subscription?",
'woocommerce'
) }
</h3>
<p
dangerouslySetInnerHTML={ {
__html: __(
'To see all your subscriptions go to <a href="https://woocommerce.com/my-account/" target="_blank" class="woocommerce-marketplace__my-subscriptions__tooltip-external-link">your account</a> on WooCommerce.com.',
'woocommerce'
),
} }
/>
</>
}
>