theme style broken if importing bootstrap css module in the theme config

[tyzion]

Have you read the Contributing Guidelines on issues?

• I have read the Contributing Guidelines on issues.

Prerequisites

• I'm using the latest version of Docusaurus.
• I have tried the npm run clear or yarn clear command.
• I have tried rm -rf node_modules yarn.lock package-lock.json and re-installing packages.
• I have tried creating a repro with https://new.docusaurus.io.
• I have read the console error message carefully (if applicable).

Description

The only way I've found to add bootstrap css styles to my page was to import the bootstrap css file as a theme customCss property in the docusaurus.config.js, after installing bootstrap with npm. In this way the whole style of docusaurus theme gets broken, like links and the Admonition component.
Is this the right way to use bootstrap css styling?
Because until a few commits ago, everything went well with this configuration

const config = {
...
presets: [
  [
    ...,
    theme: {
      customCss: [
        require.resolve('./node_modules/bootstrap/dist/css/bootstrap.min.css'),
        ...

Reproducible demo

No response

Steps to reproduce

create a new docusaurus project with theme classic
install bootstrap with npm
add it to docusaurus config file as said above
run npm start

Expected behavior

no broken theme styles

Actual behavior

broken docusaurus theme and styles

Your environment

• Docusaurus version used: 2.4.0
• Operating system and version (e.g. Ubuntu 20.04.2 LTS): macos Monterey

Self-service

• I'd be willing to fix this bug myself.

[Josh-Cena]

Hi! Docusaurus uses Infima, which defines some of the same class names as Bootstrap. This is working as intended—you should only be using one set of global stylesheets, since both Infima and Bootstrap invasively inserts global styles. This may be better if one day we address #6032, but for now we don't plan to support co-op of Infima and Bootstrap. (FYI there used to be a Bootstrap theme, but no one maintained it and it was removed. If you feel super passionate, you can fork the classic theme, remove Infima, and refactor everything to make it work with Bootstrap.)

[tyzion]

Hi! thanks for the answer!

I think that we used the previous bootstrap version, then, because until a while ago it all worked and updating the package.json broke everything.
I don't think I have the time to try refactor everything 🤣
And I'll surely look into #6032

[pellyadolfo]

most webs in showcase have very simple landing pages because of the Infima constraint

https://docusaurus.io/showcase