Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Added support for Bootstrap 5 #2432

Open
wants to merge 1 commit into
base: master
Choose a base branch
from
Open

Conversation

Bjorkor
Copy link

@Bjorkor Bjorkor commented Jun 12, 2024

I wanted bootstrap 5 in my application, but flask-admin did not support it.
I have added bootstrap 5 support.
Use template_mode='bootstrap5' when calling Admin()

app = Flask(__name__) app.config.from_object(Config) db.init_app(app) admin = Admin(app, name='Admin Interface', template_mode='bootstrap5')

Copy link
Contributor

@princerb princerb left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Most layout settings are not corresponding to the design of Bootstrap5.

Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Boolean field is not improved with form-control or with the components of Bootstrap5.

image

Copy link
Contributor

@princerb princerb Jul 15, 2024

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

And also margins/paddings are not well structured.

Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Flash message bug: alerts are not implemented with Bootstrap5

image

Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

And also alert close button won't work.

Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Navbar toggler bug: doesn't collapse or work.

image

Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

When clicking the editable column, it does nothing.

image

Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Console error:

image

@hasansezertasan
Copy link
Member

Related: #2163, #2350, and #2371.

@samuelhwilliams
Copy link
Contributor

This PR pulls in a significant number of new files/amount of new code. Can you help me understand what is copy/paste and what is custom? Can you provide a script that pulls in the copy/paste-able static assets so that it's easier to validate what is provided as-is, and what is custom? This should help identify which areas to review more closely, and which are provided by bootstrap5 (and should theoretically have been critiqued already).

@hasansezertasan
Copy link
Member

Can you provide a script that pulls in the copy/paste-able static assets so that it's easier to validate what is provided as-is, and what is custom? This should help identify which areas to review more closely, and which are provided by bootstrap5 (and should theoretically have been critiqued already).

You can checkout #2444 for such a script @Bjorkor.

@princerb
Copy link
Contributor

Did anyone else try to use this change (Bs5) ?

@samuelhwilliams
Copy link
Contributor

Could you add an example in the examples/ directory that sets it up, so that it can be easily used/verified please?

@paulocoutinhox
Copy link

+1

@Dedoque
Copy link

Dedoque commented Aug 26, 2024

Could you add an example in the examples/ directory that sets it up, so that it can be easily used/verified please?

+1

@LeXofLeviafan
Copy link
Contributor

Use template_mode='bootstrap5' when calling Admin()

app = Flask(__name__)
app.config.from_object(Config)
db.init_app(app)
admin = Admin(app, name='Admin Interface', template_mode='bootstrap5')

template_mode='bootstrap4' got replaced with theme=Bootstrap4Theme() by now.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
Development

Successfully merging this pull request may close these issues.

7 participants