hochschule-darmstadt / openartbrowser

Exploring the world of arts using open data
http://openartbrowser.org/
MIT License
40 stars 10 forks source link

Carousel buttons not aligned properly #551

Closed EeveesEyes closed 3 years ago

EeveesEyes commented 3 years ago

Describe the bug In the new version, the buttons of the carousel are no longer aligned properly.

To Reproduce Steps to reproduce the behavior:

  1. Go to any artwork page (desktop version)
  2. Scroll down to 'Related Artworks'
  3. See error

Expected behavior The buttons should be centered vertically.

Screenshots image

Solution Due to different slide sizes on mobile next and prev button were made to stay on the same height, so "align-items: center" was accidentally overwritten with

.carousel-control-prev, .carousel-control-next {
  ....
  align-items: initial !important;
  margin-top: 10em;
}

in carousel.component.scss. These css lines should have been added to a media query. To solve this bug just add the css lines above to the media query "@media (max-width: 575px)" instead so that these css rules are only applied on mobile.