Update docs

packages/docs/.storybook/preview.ts

@@ -38,8 +38,8 @@ const preview: Preview = {
             ],
             'Cart', [
               'cl-cart',
-              'cl-cart (minicart)',
               'cl-cart-link',
+              'cl-cart (minicart)',
               'cl-cart-count',
             ],
             'Checkout', [

packages/docs/stories/cart/cl-cart--minicart.mdx

@@ -6,9 +6,9 @@ import { codes } from '../assets/constants.ts'
 
 # Minicart
 
-The `cl-cart` component acts as a minicart when rendered inside a [**cl-cart-link**](?path=/docs/components-cart-cl-cart-link--docs) one. With this feature, you can offer your customers a familiar UI experience where the cart slides in on click (or as soon as you add an item) and overlays the page, giving them an overview of the cart summary and the possibility to checkout, as shown in the code snippet below.
+The [**cl-cart**](?path=/docs/components-cart-cl-cart--docs) component acts as a minicart when rendered inside a [**cl-cart-link**](?path=/docs/components-cart-cl-cart-link--docs) one. With this feature, you can offer your customers a familiar UI experience where the cart slides in on click (or as soon as you add an item) and overlays the page, giving them an overview of the cart summary and the possibility to checkout, as shown in the code snippet below.
 
-Please note that the minicart provided by the `cl-cart` component is unstyled and hidden by default. You have to write some CSS from scratch in order to make it work as you need. Otherwise, you can import the [**minicart.css**](?path=/docs/getting-started--docs#minicartcss) file into your website, using it as is or as a reference to tweak at your leisure.
+Please note that the minicart is unstyled and hidden by default. You have to write some CSS from scratch in order to make it work as you need. Otherwise, you can import the [**minicart.css**](?path=/docs/getting-started--docs#minicartcss) file into your website, using it as is or as a reference to tweak at your leisure.
 
 <Canvas of={Stories.Basic} />
 

packages/docs/stories/cart/cl-cart-link.mdx

@@ -19,3 +19,7 @@ Instead of a simple text link, you can use any custom icon, as shown in the exam
 
 <Canvas of={Stories.WithIcon} />
 
+### Minicart
+
+You can use the `cl-cart-link` to wrap a [**cl-cart**](?path=/docs/components-cart-cl-cart--docs) one and make it act as a [**minicart**](?path=/docs/components-cart-cl-cart-minicart--docs).
+

packages/docs/stories/cart/cl-cart.mdx

@@ -15,3 +15,7 @@ The component works in the most straightforward way, as shown in the code snippe
 <Canvas of={Stories.Basic} />
 
 Just in case you were wondering — yes, the in-line button was *dropped in* the sentence above using the [**cl-add-to-cart**](?path=/docs/components-add-to-cart-cl-add-to-cart--docs) component. Pretty cool, huh? 😎
+
+### Minicart
+
+You can use the `cl-cart` component inside a [**cl-cart-link**](?path=/docs/components-cart-cl-cart-link--docs) one to make it act as a [**minicart**](?path=/docs/components-cart-cl-cart-minicart--docs).

packages/docs/stories/getting-started.mdx

@@ -39,6 +39,8 @@ Assuming you already have a Commerce Layer account ([sign up](https://dashboard.
 
 ## Styling
 
+To simulate in the following interactive documentation pages how the components would look when importing the CSS files below into your website you can use the toggle switches in the header.
+
 ### `drop-in.css`
 
 The drop-in library is shipped unstyled, so that you can apply your own styles. We provide some simple styling. If you're happy with that or you just want to speed up the set up process just add an additional `link` tag to your HTML code as follows:
@@ -49,13 +51,12 @@ The drop-in library is shipped unstyled, so that you can apply your own styles.
 
 ### `minicart.css`
 
-The [**minicart**](?path=/docs/components-cart-cl-cart--minicart) version of the cart is unstyled and hidden by default. Since its behavior is achieved mostly via CSS, you have to write your own to style it. You can start from scratch, or import a minimal set of styles and take it from there. To do that, just add an additional `link` tag to your HTML code as follows:
+The [**minicart**](?path=/docs/components-cart-cl-cart-minicart--docs) version of the cart is unstyled and hidden by default. Since its behavior is achieved mostly via CSS, you have to write your own to style it. You can start from scratch, or import a minimal set of styles and take it from there. To do that, just add an additional `link` tag to your HTML code as follows:
 
 <Source language='html' dark code={`
 <link href="https://cdn.jsdelivr.net/npm/@commercelayer/drop-in.js@1.3.2/dist/drop-in/minicart.css" rel="stylesheet" />
 `} />
 
-
 ## Need help?
 
 - Join [Commerce Layer's Slack community](https://slack.commercelayer.app).