Django-oscar: Please include support for Bootstrap 4

[ctailo]

Issue Summary

Please include support for Bootstrap 4. Right now, Oscar appears to support Bootstrap 3. Please include support for Bootstrap 4

[SalahAdDin]

All PR are welcome, if you begin it i will help you.

[ctailo]

Thank you. I am very new to programming but I am willing to help. Can you please tell me what I would need to do to include Bootstrap 4?

[ashishnitinpatil]

@ctailo It will be quite a big change due to the amount of templates and static files that would need updating (all the while taking care of design responsiveness on all screen sizes with the changes). But, in summary, you will have to update the relevant static files (less, js, css, images, fonts) for bootstrap with latest stable release from v4, then update all the templates that use bootstrap classes from v3, to v4 classes (or the corresponding changes if that class is deprecated or something entirely new would be better to use).

Although, I'd like to suggest, if you are going to make those changes, it is worth to look at other UI / CSS libraries and see if we can have better alternatives, since the amount of effort needed would be roughly equal.

[SalahAdDin]

@ashishnitinpatil Maybe, tabler?

[gogobook]

How about Bulma ?

[lordvcs]

Please lets stick with bootstrap 4

[ctailo]

Please lets stick with bootstrap 4

I agree with you. I think that bootstrap 4 is the easiest one to work with. I do not know of other frameworks. I am fairly new to programming, so I am not sure that I can commit to doing this by myself. However, if other people want to work on this, I can submit pull requests if I am able to contribute in some way.

[Aiky30]

This is going to be a big undertaking. I will help towards this but I'm unsure just how much of my spare time I can contribute. I guess the place to start is creating a branch that we can all push changes to.

feature/bootstrap-4.0

[ctailo]

This is going to be a big undertaking. I will help towards this but I'm unsure just how much of my spare time I can contribute. I guess the place to start is creating a branch that we can all push changes to.

feature/bootstrap-4.0

Ok. How could this project be managed. Should we list out all of the things that should be done to make this change. As I said before, I am new to programming, so I am not familiar with everything that would be needed to do this.

[Aiky30]

@ctailo I've not made any changes to this project before so I have no idea of the procedure for new features in this repo.

You are correct in stating that we would need to first plan out what will need changing in a list, the list can then be ordered in order of completion. Someone from the core developer side would then need to review each pull request and merge into a new feature branch.

We need a core developer to "own" this feature, we can then do the work regarding listing out and then starting.

@SalahAdDin Do you have any comments to add regarding how we can get this done?

[SalahAdDin]

I think at first we can replace current static files by new version, and after that we can solve any compatibility problem, or we can replace step by step in each module in order to control it in a better way, of course, we must create a new branch for that and a new branch over that branch for each module.

[Aiky30]

I'll start a list here and update it as and when we think of more.

Requirements:

• Static files: css, js, scss build out?
• Template markup and controlling classes. What about any use of features that have been removed in v4?

[ashishnitinpatil]

Hi, I have created a starting template for upgrading to bootstrap4 - feature/bootstrap4-addition-only

Changes done

• Added bootstrap4 static files
• Added gulp tasks to watch / build scss (since Bootstrap4 now uses SCSS, so we'll likely abandon LESS entirely)
• Minor modifications to READMEs
• Basic structure for SCSS for main site as well as dashboard

I have not removed previous bootstrap3 files because I think it'll be easy in development to refer to what the site looked like, before making relevant changes with bootstrap4 upgrade.

Once we finish with the upgrade, we can proceed with following TODOs which are basically for removal of bootstrap3 related files / changes.

TODOs

• Remove unnecessary less files since we now use scss
  
  
  
  • src/oscar/static/oscar/less/*
  
  
• Remove unnecessary bootstrap3 js files
  
  
  
  • src/oscar/static/oscar/js/bootstrap3
  
  
• Remove gulp less task (gulpfile.js/*)
• Note that dashboard is also dependent on bootstrap3
  
  
  
  • if we don't end up upgrading dashboard, we can't remove most of the above
  
  

Since I don't have push permission to official repo, kindly create a branch based on my feature branch to start off this upgrade.

[Abishek05]

Any updates on this yet?

[sasha0]

Me and @samitnuk took over and continued to work on the Bootstrap 4 migration.

There's enough of work to do, but catalogue already looks like this:

[lhenrique00]

A few days ago try to update my django-oscar project to MDBootstrap, where I found the problems in the shopping basket, where to click to remove or add to buy later. No matter what you need, you can count on me.

[sasha0]

Basket summary page:

[lhenrique00]

if you click on "Buy Later" or in "Remove", it works? Because with me don't work, i do not know why css would change the functionality of the page, but it simply did not work the links.

[saitam1]

What is the progress here? Can I already test the code somewhere? I couldn't find any branch regarding this topic

[sasha0]

See PR #3005.

[sasha0]

if you click on "Buy Later" or in "Remove", it works? Because with me don't work, i do not know why css would change the functionality of the page, but it simply did not work the links.

Most of the binding should work, although we're about to finish with visual part and start testing functionality.

[samitnuk]

Couple screenshots from the updated dashboard.

[voronov007]

Looks good. The big job is done, waiting for Oscar version 2.1 that might include Bootstrap 4. Last update was made 31 of may and for now the branch is out-of-date with the base branch...

[FelipeSanchezCalzada]

How is Bootstrap 4 integration? I really need it for the last project I'm working on.
Has it already been reviewed by the authors? The work looks great

[daniel-butler]

do we need any help here to keep this moving?

[ashishnitinpatil]

do we need any help here to keep this moving?

@daniel-butler see discussion on https://github.com/django-oscar/django-oscar/pull/3302