search

Telefonica / mistica-design

Mística Design System (only design)
https://brandfactory.telefonica.com/mistica
20 stars 4 forks source link

Align content in Accordion when asset is visible #1755

Open yceballost opened 2 months ago

yceballost commented 2 months ago

Discussed in https://github.com/Telefonica/mistica-design/discussions/1738

Originally posted by **msagrilo** April 19, 2024 ### Goal O objetivo é mudar o alinhamento do texto do accordion, quando ele está aberto. ### Context Quando temos a versão grouped accordion, a hierarquia de leitura fica ruim. ### Impact Trazer um conforto visual na leitura. ### Discussion Questions Fiz uma mini poc para ajudar na percepção. ### Additional considerations _No response_ ### Do you have a visual proposal? https://www.figma.com/file/12wZyia8Y0vbx8fFpiP9Pm/Accordion-Evolution?type=design&node-id=2015%3A550&mode=design&t=BsB94RXFGdFilS5N-1

Tasks

aweell commented 1 month ago

There are two aspects that are concerning about this approach.

  1. The size of the asset could compromise the legibility of the text in small devices
  2. Since the asset size is something that we cannot control, align the asset when the title is centered in the header area and at the same time reserve that space in the left of the content panel is something tricky. At least in Figma i couldn't find a way to solve this problem.

Here's the branch with the changes: https://www.figma.com/design/WCkDDzlXE16R6yXaljxddj/branch/vzs1YCZ3yMTj0tKyc8KlvG/M%C3%ADstica-Mobile?m=auto&node-id=25050-313&t=SCgyFq5coBP9qwmU-1