Testing: Lively Classic 1.0

[allanaaa]

Results from testing this new theme.

@nelsonamaya82 @aviannamiller

[allanaaa]

Things look really good so far!

1. On the homepage, the featured records come in plain rectangles, unlike the rest of the theme design. Is that deliberate? I would rather have the usual border radiuses and dashes. I do like the contrast background - wonder if we could tie each record to a separate colour choice.

2. I'm getting some odd button size growth when moused over - only on the active selection:

Screen.Recording.2025-04-07.at.17.23.24.mov

[aviannamiller]

3. The nav menu is truncating list items when there are more than ~9:
   When this overflow of list items occurs, the nav container increases in height, which creates a bit of a cumbersome scrolling experience for viewing main page content.
4. The menu drawer produces a scrollable list where all list items are accessible, however there are a11y issues with the menu drawer toggle (for both open and close) and obscured focus when tabbing. These same issues have also been described for Lively on S (omeka-s-themes/lively#17 and omeka-s-themes/lively#18).
5. The skipnav link is not currently functional. It is linking out to an incorrect ID and should be corrected to href="#main-content".
6. All record tag colors are failing minimum contrast requirements (against #F3F3F3 background). Minimum contrast for UI components is 3:1. Consider creating higher contrast by darkening record tag colors and/or lightening tag backgrounds, or make color (with appropriate contrast against page/container background) fill the entire tag (similar to Freedom).
7. There are a number of semantic issues. The site-title should be coded as <h1>. Page titles would then be <h2> (they are currently tagged as <h1>, except for headings on the main landing page, which are correctly tagged). Resource headings are then also tagged as <h2> but should be <h3> in order to achieve logical semantic ordering. The footer then jumps all the way to <h6>. Skipping heading levels is discouraged, and the footer heading would be more accurately described as <h2>.
8. ul elements (used for Featured Content) have direct children (div) that are not allowed on these elements.
9. #menu-backer element on menu drawer is missing accessible text.
10. There are unnecessary type attributes on JS resources and the style element.

[allanaaa]

11. On item view pages, you call the medium (non-square, regular-ratio) thumbnail in the Files list, but constrain it to a square, which distorts it:
    https://dev.omeka.org/amayer/amayer-c/omeka/items/show/6442