ColbyCommunications / colby-college-theme

Theme for redesigned colby.edu site
MIT License
0 stars 0 forks source link

Removing <code> tags from Accordions #64

Closed bwaltz closed 1 year ago

bwaltz commented 1 year ago

@gregoryspragginsjr We're finding that lists in Accordions are getting styles from the <code> element that is surrounding things:

Screen Shot 2022-12-08 at 2 09 24 PM

You can see the lists inside are displaying as monospaced.

Can we remove the <code> elements? https://github.com/ColbyCommunications/colby-college-theme/blob/master/src/twig/components/accordion/accordion.twig#L48

When I try to delete them it screws everything up on my local:

Screen Shot 2022-12-08 at 2 07 19 PM

Screen Shot 2022-12-08 at 2 12 29 PM

gregoryspragginsjr commented 1 year ago

@bwaltz I can take a look here. The <code> tag is required here to prevent the error message your seeing (encoding error). There should be a workaround.

bwaltz commented 1 year ago

@gregoryspragginsjr checking in on this one. Do you have any thoughts?

gregoryspragginsjr commented 1 year ago

Hey @bwaltz sorry about the delay on these; been on sick leave. You should see an update for this and a few things in the next day or so. The code tag unfortunately is necessary in this context as you can see from removing it. It'll just need some additional styles.

gregoryspragginsjr commented 1 year ago

Okay @bwaltz I've applied a small change here that should remedy this issue. I did notice that you guys have made a fair number of changes, migrating some of the tailwind utility classes in the wysiwyg twig file into scss and utilizing apply. The only way to to remedy this issue in particular regarding the necessary code tag stylings is to apply some type of specificity to override via either:

  1. > applications to direct children
  2. !important overrides to all styles within your set ul on line 86 in styles.scss
  3. Add another classname for specificity

I've applied the first approach to your css but feel free to change this.