[Theme] New theme: FomanticUI [beta]

[princerb]

A new theme - FomanticUI.

Quick try:

docker pull thomasstacey2/fa-fomantic:latest
# remove "-p 6379:6379" if there is redis already running in port 6379
docker run -p 5000:5000 -p 6379:6379 thomasstacey2/fa-fomantic:latest

• Mobile-first & fully responsive
• Modern, clean design
• Backwards compatible with Flask-Admin scripts
• No unnecessary extra libraries
• Custom, lightweight scripts
• Accessible and user-friendly
• Feature-rich UI components

🖼️ Previews

name	mobile	desktop
Model/Listing
Model/Create
Model/Details
Redis Console
File Manager
Footer 🆕

Checklist:

• Core templates: base, actions, layout
• Optional footer menu links 🆕
• Models:
  • List
  • Layout
  • Row actions
  • Editable columns
  • Edit
  • Details
  • Create
  • Inline forms (modal) - edit, details, create
• File Manager
• Redis Console

Other:

• Remove and organize unnecessary js/css libs

Backlogs:

• Fully download and setup FomanticUI
• Leaflet integration
• form_ajax_refs

[princerb]

Due to the interconnection among all the template files, I was not committing the changes in order to keep the history organised. Hope today I will manage to push some completed code 🙂

[princerb]

I am thinking about column editable part.

For now I've implemented this: (available in the docker image above)

But I believe there is better way to do this, rather than adding 200 more lines of JS.

[ElLorans]

@princerb is this ready for review?

[princerb]

@princerb is this ready for review?

Yes now, considering checklist items, but what's pushed should be solid for now.

[samuelhwilliams]

Would you be able to add an example that uses this theme to the repo, if you still have interest+capacity to pursue this? 🙏

[princerb]

Here you go https://github.com/princerb/flask-admin/tree/f-theme-fomanticui/examples/fomanticui
A little too much, but fair to use and test the theme. I generated this a while ago so I could fully try the theme. I'll try to add a decent one later.

[samialfattani]

As you may know, XEditable is no longer suppoerted since no one raise any PR for 10 yrs. If you are interested to fork this repo and enhance it, then I WILL work with you on that project.

[ElLorans]

As you may know, XEditable is no longer suppoerted since no one raise any PR for 10 yrs. If you are interested to fork this repo and enhance it, then I WILL work with you on that project.

There are already many forks, and I do not think it's really necessary. Unless you really want to fork that, I would try to avoid reinventing the wheel.

I am thinking about column editable part.

For now I've implemented this: (available in the docker image above)

But I believe there is better way to do this, rather than adding 200 more lines of JS.

Also, I think princerb already did most of the work.

[samialfattani]

@princerb, i'm just offering my support to let this PR merged sooner

[princerb]

This PR supports both desktop/mobile responsiveness.

📱 See mobile screenshots

General

🔍 Filters

📁 File Manager

🔔 Toasts

☑️ Select Row

📄 Pagination

🪟 Modal View

[samialfattani]

That is a great job, thanx for your effort. However, we had a lot of merges to enhance the UX on Bootstrap4. could you please review those merges and make sure you have covered them as well in this PR?

• Form alert #2738

• insert alert messages on create/edit/upload forms #2734

• fix css class generated by column name #2730

• Fix/popperjs map #2708

• Ability to add menu divider #2696

• fix Menu icon #2666

• import JQuery as a local file

• import semantic.min.css (with its related fonts) and semantic.min.js as local files.

• fix the CSRF token on delete files and directories #2829

[princerb]

hi, thanks for letting me know. Since I set this one as a beta theme, it would be safe to backlog those extra security fixes, but I'll take a look and also it would be so helpful if someone helps with it and review the PR as it's been here for so long and I basically forgot what I did here at that times)). (THere is an image u can pull and try this instantly btw)

[samialfattani]

hi, thanks for letting me know. Since I set this one as a beta theme, it would be safe to backlog those extra security fixes, but I'll take a look and also it would be so helpful if someone helps with it and review the PR as it's been here for so long and I basically forgot what I did here at that times)). (THere is an image u can pull and try this instantly btw)

no problem , i think i can do those changes, could you please add me as a contributor in this repository so i can push the new changes?

[ElLorans]

hi, thanks for letting me know. Since I set this one as a beta theme, it would be safe to backlog those extra security fixes, but I'll take a look and also it would be so helpful if someone helps with it and review the PR as it's been here for so long and I basically forgot what I did here at that times)). (THere is an image u can pull and try this instantly btw)

no problem , i think i can do those changes, could you please add me as a contributor in this repository so i can push the new changes?

Isn't it easier to fork and PR his repo?

[ElLorans]

Suggested change

db.create_all()

[samialfattani]

fixed in #2854

[ElLorans]

Can I try this without the docker image or is that a requirement?

[samialfattani]

hi, thanks for letting me know. Since I set this one as a beta theme, it would be safe to backlog those extra security fixes, but I'll take a look and also it would be so helpful if someone helps with it and review the PR as it's been here for so long and I basically forgot what I did here at that times)). (THere is an image u can pull and try this instantly btw)

no problem , i think i can do those changes, could you please add me as a contributor in this repository so i can push the new changes?

Isn't it easier to fork and PR his repo?

yes sure, but i thought i would be better if we keep moving on this exact branch.