Uploaded image for project: 'Planet4'
  1. Planet4
  2. PLANET-6034

Remove Bootstrap 5 new XXL breakpoint

XMLWordPrintable

    • Icon: Task Task
    • Resolution: Released
    • Icon: Must have Must have
    • 2.52.2
    • 3
    • Styling/Theme
    • Sprint #158
    • pluto

      Bootstrap 5 adds a new larger XXL breakpoint for screens over 1400px. This was known during development, but we missed some implications that make it not work well with our design.

      Some issues noted by mfatome in https://greenpeace-gpi.slack.com/archives/G015K63081W/p1617103389024800 :

      • too little white space around content
      • Take Action covers got smaller and wider
      • overlap bug for Carousel Header in L versions and too little margins for the XL version (between the arrows and the text)

      Probably the best short term step is to restore the behavior of the previous breakpoints. We can try to exclude the new breakpoint, or in some other way render it inactive (e.g. increase the minwidth to a high value). https://getbootstrap.com/docs/5.0/layout/breakpoints/ 

      An option to disable the XXL breakpoint: https://stackoverflow.com/a/65518671

            nroussos Nikos Roussos
            pvincent Pieter Vincent
            Votes:
            0 Vote for this issue
            Watchers:
            1 Start watching this issue

              Created:
              Updated:
              Resolved: