skilld-labs / ui-patterns-kaizen

Development for https://www.drupal.org/project/ui_suite
3 stars 0 forks source link

Components creation #19

Closed iberdinsky-skilld closed 1 year ago

iberdinsky-skilld commented 1 year ago
  1. All components generated files (css,js,images etc) grouped in /assets directory
  2. Fixed patters + Tested on drupal /patterns page preview
  3. Postcss sources .src.css -> renamed to .pcss.css Reasons: same in core and less conflicts in vite builds.
  4. Created 2 independent sliders with same Glide js script. But with usage of js modules. It is ready to go already https://caniuse.com/es6-module . Not aggregated by drupal. But seems some actions happend in this direction: https://www.drupal.org/node/3312139 Also we will not have lot of vendor scripts styles in theme. Sliders works on both SB and Drupal now.
  5. Updated components build vite config. Now it serves components dependencies into same /assets directory with vendor.* prefix so they became lintignored. also can be minified because of ^4

Image from Gyazo

Nothing in window.Glide

Image from Gyazo

Update

Added 5 independent Glide sliders inside one theme. They work same in Storybook and Drupal.

  1. Using Js modules.
  2. Using full bundled css/js.
  3. Using Window.OSlider.Glide namespace.
  4. Using Window.caesarTheme.Glide namespace.
  5. Using Webcomponents(Lit). Best option ever! JS/CSS is encapsulated. Core css variables onboarded.

Moved component sources to ./src directory. And builded result will appear in component directory in SDC style