Skip to content

ACAS-916: Update all html/jade and coffee script usage to bootstrap 3 css#1219

Open
brianbolt wants to merge 65 commits into
masterfrom
ACAS-913-bootstrap3-update-bb
Open

ACAS-916: Update all html/jade and coffee script usage to bootstrap 3 css#1219
brianbolt wants to merge 65 commits into
masterfrom
ACAS-913-bootstrap3-update-bb

Conversation

@brianbolt

@brianbolt brianbolt commented Nov 19, 2025

Copy link
Copy Markdown
Contributor

Description

  • In 2025-3 we updated bootstrap javascript to bootstrap 3 but mistakenly left the bootstrap 2 css in the code base. This led us to believe we updated bootstrap successfully to bootstrap 3 when in fact most of the classes were still using bootstrap2.
  • Additionally jQuery file upload was pretty broken because updated it but missed updating the file upload template we were using. This broke the progress bar which I reimplemented and shows a nice progress as part of the upload now.
  • These changes are to migrate bootstrap 2 classes to bootstrap 3 and is a significant change.
  • The main issues I faced:
    • Forms had completed messed up/no bootstrap styling.
    • Modal dialogue interface changed in bootstrap 3 so dismissing modals and showing them were in a bad place.
    • Some of the custom styling elements like tooltips were broken and need re-implementation.
  • I used a ton of AI coding to to fix this but tried to do it in a structured way. Some examples:
    • Experiment Editor, Protocol Editor and Project editor all use a very similar layout so I spent a lot of time on just experiment editor, made sure it was in a good place and then asked copilot to apply the change to all the editors. I did a very similar thing for all the browsers. Noting that as part of the editor changes, I decided that it was easy to create a responsive 2 column, more compact layout and so I checked in those changes here.
    • CurveCurator which was a big mix of css and bootstrap 2 features to get it nice and compact took a decent amount of work to get back in shape but its now pretty responsive and can be shrunk down.
    • CmpdReg bulkloader also had some significant layout changes and like Experiment/Protocol/Project Editors I took the opportunity to create a 2 column layout which is responsive to going down to a small or wide screen.
    • The Single Reg UI seems to be unaffected by any of this so I didn't change anything about it except a seperate PR around the iframed Lot Inventory module.
    • Module menus collapsing feature which isn't widely used was broken so I fixed that.

Related Issue

ACAS-913
ACAS-914
ACAS-916

How Has This Been Tested?

  • I did basic testing of the modules as I opened and saved a number of items.
  • I verified Dose Response + Curve Curator worked
  • Tried to focus on modal showing and hiding since that seemed to be a significant functionality issue in some cases.
  • I ran a CmpdReg restandardization, Code tables...etc.
  • I verified required fields styling seemed to be working including tool tips.
  • I verified uploading a large 8GB file shows a nice progress bar.
  • I verified that when made collapsible, the module menus behaved well.
  • A lot of the tests I did involved dragging the screen to be smaller to make sure it was responsive.

@brianbolt brianbolt changed the title ACAS-813: Update all html/jade and coffee script usage to bootstrap 3 css ACAS-913: Update all html/jade and coffee script usage to bootstrap 3 css Nov 19, 2025
@brianbolt brianbolt changed the title ACAS-913: Update all html/jade and coffee script usage to bootstrap 3 css ACAS-916: Update all html/jade and coffee script usage to bootstrap 3 css Nov 19, 2025
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2 participants