search

bcgov / invasivesbc

Inventory and database repository for the creation, treatment, and report on BC Invasive plants and animals.
Apache License 2.0
13 stars 4 forks source link

[INV-3637] PARTIAL** Mobile Friendly changes #3652

Closed LocalNewsTV closed 2 weeks ago

LocalNewsTV commented 2 weeks ago

Overview

This is partial work towards the completion of #3637

This PR includes the following proposed change(s):

Viewport was set to Galaxy S20

  1. Widen the header to better use screen space
    • Flip Network icons horizontal instead of stacked. They're too large to fit in pre-existing header size.
    • switch outer div to header given its a header
    • CSS cleanup
  2. Refactor Map Buttons to not overflow out and disappear
    • CSS Adjustments only
  3. Recordset lists
    • Break /Records into sub components
    • Split into two main subcomponents
    • In Mobile widths, stack them to avoid compression
    • Editing a recordset name doesn't toggle them all into edit mode
    • Reduce logic complexity in what is supposed to render and when

Pictures

  1. Widening Header

New

image

Old

image

  1. Map Buttons

New

image

Old

This as far left as you can scroll, given context, buttons become unusable, rightmost button is eclipsed by map details

image

  1. Recordsets

Old

image image

New

image

LocalNewsTV commented 2 weeks ago

Both Sonarcloud issues are pre-existing prior to this work

sonarcloud[bot] commented 2 weeks ago

Quality Gate Failed Quality Gate failed

Failed conditions
0.0% Coverage on New Code (required ≥ 80%)
B Reliability Rating on New Code (required ≥ A)

See analysis details on SonarCloud

Catch issues before they fail your Quality Gate with our IDE extension SonarLint