EightfoldAI / octuple

The Octuple component library
MIT License
16 stars 45 forks source link

Integrating With Other Project's CSS #846

Closed aglenn-hsi closed 3 weeks ago

aglenn-hsi commented 1 month ago

The Octuple.css file is hard to read by mediums other than a browser. Our project first started using parcel to build and parcel gave errors when trying to read octuple.css. We could revert our code and hunt down the error if that’d be useful, but because that file is optimized/ugly, I don’t know how useful that would be.

We moved to webpack to get it to work, but adding any preprocessing is problematic as it errors on the octuple.css library too when it is attempted to be read. We tried to get all of the same versions of packages in the packages.json file, but maybe it’s a problem because the octuple.css is past preprocessing and uglified?

Is there a sample project where octuple has been integrated in with css for a parent project?

dkilgore-eightfold commented 4 weeks ago

@aglenn-hsi Octuple's css should be isolated from the parent project. You may need to configure parcel to ensure Octuple's css is read as an asset, and not compiled by your application.

dkilgore-eightfold commented 4 weeks ago

If you need to spoof Octuple's base styles in it's default_theme module, the recommended approach is to maintain local CSS variables derived from Octuple's. Or scope them in a selector.

aglenn-hsi commented 3 weeks ago

Thanks. I got this work. Though, to use something like for example, the octuple color palette I need to copy it into our project. This should work though.