Skip to content
GitLab
Projects Groups Snippets
  • /
  • Help
    • Help
    • Support
    • Community forum
    • Submit feedback
    • Contribute to GitLab
  • Sign in / Register
  • B bootstrap
  • Project information
    • Project information
    • Activity
    • Labels
    • Members
  • Repository
    • Repository
    • Files
    • Commits
    • Branches
    • Tags
    • Contributors
    • Graph
    • Compare
  • Issues 263
    • Issues 263
    • List
    • Boards
    • Service Desk
    • Milestones
  • Merge requests 114
    • Merge requests 114
  • CI/CD
    • CI/CD
    • Pipelines
    • Jobs
    • Schedules
  • Deployments
    • Deployments
    • Environments
    • Releases
  • Packages and registries
    • Packages and registries
    • Package Registry
    • Infrastructure Registry
  • Monitor
    • Monitor
    • Incidents
  • Analytics
    • Analytics
    • Value stream
    • CI/CD
    • Repository
  • Wiki
    • Wiki
  • Snippets
    • Snippets
  • Activity
  • Graph
  • Create a new issue
  • Jobs
  • Commits
  • Issue Boards
Collapse sidebar
  • Bootstrap
  • bootstrap
  • Merge requests
  • !38056

[Draft] Add `$enable-host` to generate a different bootstrap.css for web components

  • Review changes

  • Download
  • Email patches
  • Plain diff
Open Julien Déramond requested to merge main-jd-add-enable-host-to-handle-web-components into main Feb 14, 2023
  • Overview 0
  • Commits 1
  • Pipelines 0
  • Changes 10

Warning Heavily draft

Another possibility to tackle https://github.com/twbs/bootstrap/issues/36688 (Closes #36688)

The principle here is to offer a $enable-host Scss var (false by default). This var is associated with a root mixin allowing to switch between :root and :host:

  • :root when $enable-host is false (default)
  • :host when $enable-host is true

I've added some unit tests to check this behavior.

It differs from https://github.com/twbs/bootstrap/pull/37162 which suggests to use :root, :host that is not really useful for all folks and projects.

The disadvantage here is that it's only available via Sass compilation. But maybe we can consider that this usage with web components is an "expert mode". We also talked about a bootstrap.*.host.*.css with @vprothais but I'm a bit afraid of what it could imply in combination with the regular bootstrap.*.css* files

  • Handle site/content/docs/5.3/customize/css-variables.md modifications (if any needed)
  • Test this new file (with $enable-host set to true) in different use cases amongst https://github.com/twbs/bootstrap/issues/36688#issuecomment-1422236483
  • Add $enable-host in the documentation and explain the impacts for web components

Thoughts??

Assignee
Assign to
Reviewers
Request review from
Time tracking
Source branch: main-jd-add-enable-host-to-handle-web-components