npm - spoko-design-system - Versions diffs - 0.2.80 → 0.2.82 - Mend

spoko-design-system 0.2.80 → 0.2.82

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (155) hide show

package/.github/dependabot.yml +11 -11
package/.github/todo.yml +3 -3
package/.github/workflows/deploy.yml +39 -39
package/.stackblitzrc +5 -5
package/.vscode/extensions.json +5 -5
package/.vscode/launch.json +11 -11
package/.vscode/settings.json +5 -5
package/LICENSE +21 -21
package/README.md +113 -113
package/astro-i18next.config.mjs +17 -17
package/astro-i18next.config.ts +10 -10
package/astro.config.mjs +147 -147
package/dev-dist/sw.js +91 -91
package/dev-dist/workbox-c676b6d3.js +3391 -3391
package/index.ts +65 -65
package/package.json +30 -30
package/public/fonts/lg.svg +53 -53
package/public/fonts/vwhead-bold-demo.html +549 -549
package/public/fonts/vwhead-regular-demo.html +549 -549
package/public/fonts/vwtext-bold-demo.html +549 -549
package/public/fonts/vwtext-regular-demo.html +549 -549
package/public/github.svg +3 -3
package/public/grid_dot.svg +4 -4
package/public/linkedin.svg +44 -44
package/public/locales/en/translation.json +8 -8
package/public/locales/pl/translation.json +8 -8
package/public/make-scrollable-code-focusable.js +3 -3
package/public/pagefind.yml +3 -3
package/public/polo.blue.svg +29 -29
package/public/spoko.space.svg +71 -71
package/public/twitter.svg +46 -46
package/renovate.json +6 -6
package/sandbox.config.json +11 -11
package/src/MyComponent.astro +8 -8
package/src/components/Badge.vue +19 -19
package/src/components/Badges.vue +21 -21
package/src/components/Breadcrumbs.vue +107 -107
package/src/components/Button.vue +55 -55
package/src/components/ButtonCopy.vue +36 -36
package/src/components/Card.astro +27 -27
package/src/components/Carousel.astro +26 -26
package/src/components/Category/CategoriesCarousel.astro +101 -101
package/src/components/Category/CategoriesSidebar.astro +186 -186
package/src/components/Category/CategoryDetails.astro +82 -82
package/src/components/Category/CategoryLink.vue +23 -23
package/src/components/Category/CategorySection.astro +69 -69
package/src/components/Category/CategorySidebarToggler.vue +9 -9
package/src/components/Category/CategoryTile.astro +49 -49
package/src/components/Category/SubCategoryLink.vue +29 -29
package/src/components/CategoryLink.astro +18 -18
package/src/components/Copyright.astro +12 -12
package/src/components/Date.astro +7 -7
package/src/components/Faq.astro +33 -33
package/src/components/FaqItem.astro +96 -96
package/src/components/FeaturesList.vue +41 -41
package/src/components/FuckRussia.vue +62 -62
package/src/components/HandDrive.astro +29 -29
package/src/components/Header/Header.astro +210 -210
package/src/components/Header/SkipToContent.astro +1 -1
package/src/components/Headline.vue +48 -48
package/src/components/Image.astro +30 -30
package/src/components/Jumbatron.vue +40 -40
package/src/components/LeftSidebar.astro +53 -53
package/src/components/MainColors.vue +23 -23
package/src/components/MainInput.vue +15 -15
package/src/components/Modal.astro +27 -27
package/src/components/PageContent.astro +5 -5
package/src/components/PartNumber.vue +27 -27
package/src/components/PostHeader.astro +103 -103
package/src/components/PrCode.vue +141 -141
package/src/components/Product/ProductButton.vue +18 -18
package/src/components/Product/ProductCarousel.astro +35 -35
package/src/components/Product/ProductCodes.vue +174 -174
package/src/components/Product/ProductEngineType.vue +42 -42
package/src/components/Product/ProductImage.astro +40 -40
package/src/components/Product/ProductLink.astro +101 -101
package/src/components/Product/ProductLink.vue +59 -59
package/src/components/Product/ProductLinkInfo.astro +37 -37
package/src/components/Product/ProductNumber.astro +61 -61
package/src/components/ProductCarousel.astro +38 -38
package/src/components/ProductCodes.vue +39 -39
package/src/components/ProductDetailName.vue +52 -52
package/src/components/ProductDetailsList.vue +65 -65
package/src/components/ProductTile.astro +48 -48
package/src/components/Quote.vue +23 -23
package/src/components/ReloadPrompt.astro +50 -50
package/src/components/SlimBanner.vue +72 -72
package/src/components/Table.vue +32 -32
package/src/components/TableOfContents.astro +15 -15
package/src/components/Translations.vue +23 -23
package/src/components/flags/FlagPL.vue +3 -3
package/src/components/flags/FlagUA.vue +2 -2
package/src/components/layout/Container.astro +7 -7
package/src/components/layout/Header.astro +80 -80
package/src/config.ts +56 -56
package/src/design.config.ts +81 -81
package/src/env.d.ts +1 -1
package/src/layouts/Layout.astro +60 -60
package/src/layouts/MainLayout.astro +81 -81
package/src/layouts/partials/FooterCommon.astro +4 -4
package/src/layouts/partials/HeadCommon.astro +44 -44
package/src/layouts/partials/HeadSEO.astro +41 -41
package/src/pages/components/badges.mdx +57 -57
package/src/pages/components/breadcrumbs.mdx +139 -139
package/src/pages/components/buttons.mdx +236 -236
package/src/pages/components/card.mdx +294 -294
package/src/pages/components/carousel.mdx +62 -62
package/src/pages/components/copyright.mdx +42 -42
package/src/pages/components/details-list.mdx +115 -115
package/src/pages/components/features-list.mdx +37 -37
package/src/pages/components/flags.mdx +49 -49
package/src/pages/components/fuck-russia.mdx +39 -39
package/src/pages/components/hand-drive.mdx +38 -38
package/src/pages/components/headline.mdx +152 -152
package/src/pages/components/icons.astro +48 -48
package/src/pages/components/image.mdx +513 -513
package/src/pages/components/input.mdx +45 -45
package/src/pages/components/jumbatron.mdx +95 -95
package/src/pages/components/modal.mdx +64 -64
package/src/pages/components/post-header.mdx +60 -60
package/src/pages/components/pr-code.mdx +65 -65
package/src/pages/components/product-number.mdx +58 -58
package/src/pages/components/product-tile.mdx +51 -51
package/src/pages/components/quote.mdx +33 -33
package/src/pages/components/slimbanner.mdx +35 -35
package/src/pages/components/table.mdx +108 -108
package/src/pages/core/colors.mdx +10 -10
package/src/pages/core/grid.mdx +89 -89
package/src/pages/core/introduction.mdx +77 -77
package/src/pages/core/shadows.astro +20 -20
package/src/pages/core/typography.astro +47 -47
package/src/pages/index.astro +126 -126
package/src/pages/patterns/introduction.mdx +60 -60
package/src/pwa.ts +12 -12
package/src/styles/_variables.scss +70 -70
package/src/styles/base/base.css +184 -184
package/src/styles/base/grid.css +92 -92
package/src/styles/base/typography.css +70 -70
package/src/styles/content.css +73 -73
package/src/styles/main.css +7 -7
package/src/types/Product.ts +31 -31
package/src/types/astro.d.ts +3 -3
package/src/utils/product/getPriceFormatted.ts +15 -15
package/src/utils/product/getProductChecklist.ts +17 -17
package/src/utils/product/useFormatProductNumber.ts +41 -41
package/src/utils/seo/getShorterDescription.ts +14 -14
package/src/utils/text/formatDate.ts +5 -5
package/src/utils/text/formatLocaleNumber.ts +6 -6
package/src/utils/text/formatPad.ts +12 -12
package/src/utils/text/getNumberFormatted.ts +33 -33
package/src/utils/text/getTranslatedLink.ts +5 -5
package/src/utils/text.ts +28 -28
package/tailwind.config.cjs +8 -8
package/tsconfig.json +28 -28
package/uno.config.ts +256 -256

package/src/pages/components/badges.mdx CHANGED Viewed

@@ -1,57 +1,57 @@
----
-title: "Badges"
-layout: "../../layouts/MainLayout.astro"
----
-import Badges from '../../components/Badges.vue'
-# Product badges
-Extra product badges (labels).
-## Badges - GTI
-<div class="component-preview">
-    <div class="relative min-h-19">
-            <Badges badges={['GTI', 'Motorsport', 'Lorem Ipsum']} class="top-2" />
-    </div>
-</div>
-```js
-<div class="relative min-h-10">
-    <Badges badges={['GTI', 'Motorsport', 'Lorem Ipsum']} class="top-2" />
-</div>
-```
-## Badge on image
-<div class="component-preview">
-<div class="relative">
-    <img src="https://placehold.co/300x200" alt="image alt" />
-    <Badges badges={['Motorsport']} class="top-2" />
-</div>
-</div>
-```js
-<div class="relative">
-    <img src="https://placehold.co/300x200" alt="image alt" />
-    <Badges badges={['Motorsport']} class="top-2" />
-</div>
-```
-## Few badges on image
-<div class="component-preview">
-<div class="relative">
-    <img src="https://placehold.co/300x200" alt="image alt" />
-    <Badges badges={['Motorsport', 'Lorem ipsum', 'GTI']} class="top-2" />
-</div>
-</div>
-```js
-<div class="relative">
-    <img src="https://placehold.co/300x200" alt="image alt" />
-    <Badges badges={['Motorsport', 'Lorem ipsum', 'GTI']} class="top-2" />
-</div>
-```
+---
+title: "Badges"
+layout: "../../layouts/MainLayout.astro"
+---
+import Badges from '../../components/Badges.vue'
+# Product badges
+Extra product badges (labels).
+## Badges - GTI
+<div class="component-preview">
+    <div class="relative min-h-19">
+            <Badges badges={['GTI', 'Motorsport', 'Lorem Ipsum']} class="top-2" />
+    </div>
+</div>
+```js
+<div class="relative min-h-10">
+    <Badges badges={['GTI', 'Motorsport', 'Lorem Ipsum']} class="top-2" />
+</div>
+```
+## Badge on image
+<div class="component-preview">
+<div class="relative">
+    <img src="https://placehold.co/300x200" alt="image alt" />
+    <Badges badges={['Motorsport']} class="top-2" />
+</div>
+</div>
+```js
+<div class="relative">
+    <img src="https://placehold.co/300x200" alt="image alt" />
+    <Badges badges={['Motorsport']} class="top-2" />
+</div>
+```
+## Few badges on image
+<div class="component-preview">
+<div class="relative">
+    <img src="https://placehold.co/300x200" alt="image alt" />
+    <Badges badges={['Motorsport', 'Lorem ipsum', 'GTI']} class="top-2" />
+</div>
+</div>
+```js
+<div class="relative">
+    <img src="https://placehold.co/300x200" alt="image alt" />
+    <Badges badges={['Motorsport', 'Lorem ipsum', 'GTI']} class="top-2" />
+</div>
+```

package/src/pages/components/breadcrumbs.mdx CHANGED Viewed

@@ -1,139 +1,139 @@
----
-title: "Breadcrumbs"
-layout: "../../layouts/MainLayout.astro"
----
-import Breadcrumbs from '../../components/Breadcrumbs.vue'
-# Breadcrumbs
-Breadcrumbs component with BreadcrumbList Microdata.
-Structured Data for Breadcrumbs that produce a Rich Snippet (in this case breadcrumbs) in search results that are clickable, too!
-#
-https://schema.org/BreadcrumbList
-https://schema.org/ListItem
-## Show back
-<div class="component-preview">
-    <Breadcrumbs
-      breadcrumbs={ [ {"name": "Level1", "path": "#level2"}, {"name": "Level 2", "path": "#level2"}, {"name": "Level 3", "path": "#level3"} ] }
-      product-number="6R0XXXXXX"
-      class="py-1 order-0 px-1 max-w-full flex bg-white"
-      show-back
-      text-back="Back"
-    />
-</div>
-```js
-<Breadcrumbs
-  breadcrumbs={
-    [
-      {"name": "Level1", "path": "level1"},
-      {"name": "Level 2", "path": "level2"},
-      {"name": "Level 3", "path": "level3"}
-    ]
-  }
-  product-number="6R0XXXXXX"
-  class="py-1 order-0 px-1 max-w-full flex bg-white"
-  show-back
-  text-back="Back"
-/>
-```
-## Show home
-<div class="component-preview">
-    <Breadcrumbs
-      breadcrumbs={ [ {"name": "Level1", "path": "#level2"}, {"name": "Level 2", "path": "#level2"}, {"name": "Level 3", "path": "#level3"} ] }
-      product-number="6R0XXXXXX"
-      class="py-1 order-0 px-1 max-w-full flex bg-white"
-      show-home
-    />
-</div>
-```js
-<Breadcrumbs
-  breadcrumbs={
-    [
-      {"name": "Level1", "path": "level 1"},
-      {"name": "Level 2", "path": "level2"},
-      {"name": "Level 3", "path": "level3"}
-    ]
-  }
-  product-number="6R0XXXXXX"
-  class="py-1 order-0 px-1 max-w-full flex bg-white"
-  show-home
-/>
-```
-## Simply
-<div class="component-preview">
-    <Breadcrumbs
-      breadcrumbs={ [ {"name": "Level1", "path": "#level2"}, {"name": "Level 2", "path": "#level2"}, {"name": "Level 3", "path": "#level3"} ] }
-      product-number="6R0XXXXXX"
-      class="py-1 order-0 px-1 max-w-full flex bg-white"
-    />
-</div>
-```js
-<Breadcrumbs
-  breadcrumbs={
-    [
-      {"name": "Level1", "path": "level 1"},
-      {"name": "Level 2", "path": "level2"},
-      {"name": "Level 3", "path": "level3"}
-    ]
-  }
-  product-number="6R0XXXXXX"
-  class="py-1 order-0 px-1 max-w-full flex bg-white"
-  show-back
-  text-back="Back"
-/>
-```
-### Schema support:
-- https://developers.google.com/search/docs/appearance/structured-data/breadcrumb?hl=en
-#### Example
-- https://validator.schema.org/?hl=en-US#url=https%3A%2F%2Fcatalog.polo.blue%2FN10733102%2F
-| @type            | BreadcrumbList                                                                    |
-| ---------------- | --------------------------------------------------------------------------------- |
-| **itemListElement**  |                                                                                   |
-| **@type**          | ListItem                                                                          |
-| **name**             | Electrical, Lighting, Telematics                                                  |
-| **position**         | 1                                                                                 |
-| **item**             |                                                                                   |
-| **@type**            | Thing                                                                             |
-| **@id**              | https://catalog.polo.blue/electrical-lighting-telematics/                         |
-| **itemListElement**  |                                                                                   |
-| **@type**            | ListItem                                                                          |
-| **name**             | Exterior Lighting                                                                 |
-| **position**         | 2                                                                                 |
-| **item**             |                                                                                   |
-| **@type**            | Thing                                                                             |
-| **@id**              | https://catalog.polo.blue/electrical-lighting-telematics/exterior-lighting/       |
-| **itemListElement**  |                                                                                   |
-| **@type**            | ListItem                                                                          |
-| **name**             | Bulbs                                                                             |
-| **position**         | 3                                                                                 |
-| **item**             |                                                                                   |
-| **@type**            | Thing                                                                             |
-| **@id**              | https://catalog.polo.blue/electrical-lighting-telematics/exterior-lighting/bulbs/ |
-| **itemListElement**  |                                                                                   |
-| **@type**            | ListItem                                                                          |
-| **name**             | Bulb carrier with bulb; silver lens                                               |
-| **position**         | 4                                                                                 |
+---
+title: "Breadcrumbs"
+layout: "../../layouts/MainLayout.astro"
+---
+import Breadcrumbs from '../../components/Breadcrumbs.vue'
+# Breadcrumbs
+Breadcrumbs component with BreadcrumbList Microdata.
+Structured Data for Breadcrumbs that produce a Rich Snippet (in this case breadcrumbs) in search results that are clickable, too!
+#
+https://schema.org/BreadcrumbList
+https://schema.org/ListItem
+## Show back
+<div class="component-preview">
+    <Breadcrumbs
+      breadcrumbs={ [ {"name": "Level1", "path": "#level2"}, {"name": "Level 2", "path": "#level2"}, {"name": "Level 3", "path": "#level3"} ] }
+      product-number="6R0XXXXXX"
+      class="py-1 order-0 px-1 max-w-full flex bg-white"
+      show-back
+      text-back="Back"
+    />
+</div>
+```js
+<Breadcrumbs
+  breadcrumbs={
+    [
+      {"name": "Level1", "path": "level1"},
+      {"name": "Level 2", "path": "level2"},
+      {"name": "Level 3", "path": "level3"}
+    ]
+  }
+  product-number="6R0XXXXXX"
+  class="py-1 order-0 px-1 max-w-full flex bg-white"
+  show-back
+  text-back="Back"
+/>
+```
+## Show home
+<div class="component-preview">
+    <Breadcrumbs
+      breadcrumbs={ [ {"name": "Level1", "path": "#level2"}, {"name": "Level 2", "path": "#level2"}, {"name": "Level 3", "path": "#level3"} ] }
+      product-number="6R0XXXXXX"
+      class="py-1 order-0 px-1 max-w-full flex bg-white"
+      show-home
+    />
+</div>
+```js
+<Breadcrumbs
+  breadcrumbs={
+    [
+      {"name": "Level1", "path": "level 1"},
+      {"name": "Level 2", "path": "level2"},
+      {"name": "Level 3", "path": "level3"}
+    ]
+  }
+  product-number="6R0XXXXXX"
+  class="py-1 order-0 px-1 max-w-full flex bg-white"
+  show-home
+/>
+```
+## Simply
+<div class="component-preview">
+    <Breadcrumbs
+      breadcrumbs={ [ {"name": "Level1", "path": "#level2"}, {"name": "Level 2", "path": "#level2"}, {"name": "Level 3", "path": "#level3"} ] }
+      product-number="6R0XXXXXX"
+      class="py-1 order-0 px-1 max-w-full flex bg-white"
+    />
+</div>
+```js
+<Breadcrumbs
+  breadcrumbs={
+    [
+      {"name": "Level1", "path": "level 1"},
+      {"name": "Level 2", "path": "level2"},
+      {"name": "Level 3", "path": "level3"}
+    ]
+  }
+  product-number="6R0XXXXXX"
+  class="py-1 order-0 px-1 max-w-full flex bg-white"
+  show-back
+  text-back="Back"
+/>
+```
+### Schema support:
+- https://developers.google.com/search/docs/appearance/structured-data/breadcrumb?hl=en
+#### Example
+- https://validator.schema.org/?hl=en-US#url=https%3A%2F%2Fcatalog.polo.blue%2FN10733102%2F
+| @type            | BreadcrumbList                                                                    |
+| ---------------- | --------------------------------------------------------------------------------- |
+| **itemListElement**  |                                                                                   |
+| **@type**          | ListItem                                                                          |
+| **name**             | Electrical, Lighting, Telematics                                                  |
+| **position**         | 1                                                                                 |
+| **item**             |                                                                                   |
+| **@type**            | Thing                                                                             |
+| **@id**              | https://catalog.polo.blue/electrical-lighting-telematics/                         |
+| **itemListElement**  |                                                                                   |
+| **@type**            | ListItem                                                                          |
+| **name**             | Exterior Lighting                                                                 |
+| **position**         | 2                                                                                 |
+| **item**             |                                                                                   |
+| **@type**            | Thing                                                                             |
+| **@id**              | https://catalog.polo.blue/electrical-lighting-telematics/exterior-lighting/       |
+| **itemListElement**  |                                                                                   |
+| **@type**            | ListItem                                                                          |
+| **name**             | Bulbs                                                                             |
+| **position**         | 3                                                                                 |
+| **item**             |                                                                                   |
+| **@type**            | Thing                                                                             |
+| **@id**              | https://catalog.polo.blue/electrical-lighting-telematics/exterior-lighting/bulbs/ |
+| **itemListElement**  |                                                                                   |
+| **@type**            | ListItem                                                                          |
+| **name**             | Bulb carrier with bulb; silver lens                                               |
+| **position**         | 4                                                                                 |