Integrate SDDS base theme heading component with XB

Created on 7 October 2024, 4 months ago

Problem/Motivation

Test+tweak base theme heading component to work with XB.

Steps to reproduce

Proposed resolution

Test+tweak base theme heading component to work with XB.

Remaining tasks

See above.

User interface changes

Component will work with XB.

API changes

Data model changes

πŸ“Œ Task
Status

Active

Version

1.0

Component

Code

Created by

πŸ‡ΊπŸ‡ΈUnited States Kristen Pol Santa Cruz, CA, USA

Live updates comments and jobs are added and updated live.
Sign in to follow issues

Comments & Activities

  • Issue created by @Kristen Pol
  • There's a weird glitch where sometimes when the text content is edited the heading shrinks, but the size prop stays the same.

  • πŸ‡ΊπŸ‡ΈUnited States Kristen Pol Santa Cruz, CA, USA

    It would be good to do a side-by-side comparison with Storybook to see if it matches:

    https://uikit.civictheme.io/

    And ideally record the testing of all the props so we can see where the issues are to determine if the issues are on our end or on the XB end.

  • I compared with storybook, everything seems the same besides the dark theme css and a weird glitch, see attached...

  • πŸ‡ΊπŸ‡ΈUnited States Kristen Pol Santa Cruz, CA, USA

    Talked with Jacob and the dark theme color is white for here and blue for Storybook but this is just based on the color scheme for this theme so this is okay as we don't have dark theme defined.

    For the other issue, this happens:

    1. Defaults to level 1 for the heading text
    2. Change the text and the size goes to level 2
    3. But toggling the levels does change it

    This could be similar to how the image is reverting to the default when you change a different property. I don't think we should make a separate issue but this video could also be added to the issue created related to:

    https://www.drupal.org/project/demo_design_system/issues/3479196#comment... πŸ“Œ Integrate SDDS base theme image component with XB Active

  • πŸ‡ΊπŸ‡ΈUnited States Kristen Pol Santa Cruz, CA, USA

    Actually, this is the code:

        level:
          type: integer
          title: Level
          description: 'Level: 1, 2, 3, 4, 5, 6. The default is 2.'
          default: 2
          enum:
            - 1
            - 2
            - 3
            - 4
            - 5
            - 6
          examples:
            - 1
    

    So this shows an interesting bug that is probably also related to the image reset bug. In this case, when the component is added, it uses level 1 because that's the "examples" value, but when changing the text, it switches to the "default" of level 2.

    Talking with Jacob and he's said that when you change anything, it shouldn't go back to looking at either of these, which seems right to me.

    It would be great to add this to the image reset bug... as a more general bug... e.g. "Prop values change to defaults or examples when changing other props".

Production build 0.71.5 2024