search

mbari-org / SeafloorMappingDB

Make MBARI seafloor mapping datasets more accessible and useful
GNU General Public License v3.0
3 stars 6 forks source link

Adding a leaflet-measure.css file for finer-tuning of the Measurement… #266

Closed ksalamy closed 2 weeks ago

ksalamy commented 3 weeks ago

Issue #257. Adding a leaflet-measure.css file for finer-tuning of the Measurement App. Further updates will be added to this file as needed.

MBARIMike commented 3 weeks ago

I see in https://github.com/mbari-org/SeafloorMappingDB/pull/266/commits/ba8f970138eb9da81484a3146de825df0025e6a6 that 13 files were modified with ids added to several elements to adjust various CSS attributes attempting to fix the problem of some elements being hidden by other elements. These are too many changes to approve by simple visual inspection of the code changes. It'll be a few days before I can spin up a test environment for the web page rendering and based on previous experience there is no assurance that I can visually identify correct rendering of all the pages. This approach of adding more CSS attributes to fix problems leads to a lot more code (primarily CSS) that needs to be understood and maintained. Perhaps there is another approach that can fix the problems without adding more CSS code. I confess to not being an expert in CSS, but maybe the layout problems were caused by many changes in the project's CSS in earlier commits like https://github.com/mbari-org/SeafloorMappingDB/commit/d61b3cffbe491cd9382ab0328bcbd4a400de5c37 and https://github.com/mbari-org/SeafloorMappingDB/commit/b66f8fe9f700f97afb21108bd6836ea43895d8e6. I understand that it's a drastic ask, but could all of these changes be reverted, going back to a more vanilla cookiecutter-django project design and then judiciously adding back required changes?

ksalamy commented 3 weeks ago

Mike, I know you are not a fan of CSS. To be honest I am not certain if I am all that comfortable with Django or crispy forms. However, I have spent a considerable amount of time working to understand both and getting CSS to play nicely with them on the project. What you are asking is a significant ask given all of that. I had understood my role in SMDB involved the front end (UI) which involves CSS (love it or hate it) and yours was the backend control code. If you feel my recent changes and use of CSS are not in line with the project’s goals, then I think it might be a good time to sit down with Kevin to discuss how to address these style differences and clarify our project tool usage. He is available tomorrow between 11-12 so we can speak with him together after our discussion of the existing precruise web form in my office at 11. See you then. Karen

MBARIMike commented 2 weeks ago

I tested these changes and see that the Expedition and Compilation detail pages display better with the top of them not being hidden behind the header. Thanks!

There is another problem (that has existed before) with the responsive layout of the form used for filtering data. This is most obvious in the Missions view that has a wide row of multiple filtering options. The "Filter" and "Clear" buttons should always be visible no matter size of the browser's window. They are both visible if the window is at least 1731 pixels wide, e.g.:

Screenshot 2024-11-01 at 10 41 06 AM

If the window is less than 1714 pixels wide the Clear button disappears and the Filter button becomes wider:

Screenshot 2024-11-01 at 10 41 46 AM

If the window is narrowed to be less than 1648 pixels then both the Filer and Clear buttons disappear:

Screenshot 2024-11-01 at 10 42 13 AM

I could merge this PR so that this problem can be worked on under another Issue, or we can leave this PR open to collect the new commits that fixes this problem. Either way is fine with me.

ksalamy commented 2 weeks ago

I will add an issue to address the Responsive View of the Missions Page. Thanks.