100vh hero
ADV-DENSITY-HERO. 100vh, Top region. On a short laptop this is the whole first screen.
Density and responsive
Long item lists, vertical tabs at 80vh, a 100vh hero, read-more at 0px and 400px, six-column feature boxes. On a phone, tabs become an accordion and the width tokens still apply. This is also the edit-form stress: many IEF rows in one Legacy widget.
Sixteen accordion items
ADV-DENSITY-ACC-1. Sixteen items. Open-first is on, so item 1 starts expanded.
ADV-DENSITY-ACC-2. Sixteen items. Open-first is on, so item 1 starts expanded.
ADV-DENSITY-ACC-3. Sixteen items. Open-first is on, so item 1 starts expanded.
ADV-DENSITY-ACC-4. Sixteen items. Open-first is on, so item 1 starts expanded.
ADV-DENSITY-ACC-5. Sixteen items. Open-first is on, so item 1 starts expanded.
ADV-DENSITY-ACC-6. Sixteen items. Open-first is on, so item 1 starts expanded.
ADV-DENSITY-ACC-7. Sixteen items. Open-first is on, so item 1 starts expanded.
ADV-DENSITY-ACC-8. Sixteen items. Open-first is on, so item 1 starts expanded.
ADV-DENSITY-ACC-9. Sixteen items. Open-first is on, so item 1 starts expanded.
ADV-DENSITY-ACC-10. Sixteen items. Open-first is on, so item 1 starts expanded.
ADV-DENSITY-ACC-11. Sixteen items. Open-first is on, so item 1 starts expanded.
ADV-DENSITY-ACC-12. Sixteen items. Open-first is on, so item 1 starts expanded.
ADV-DENSITY-ACC-13. Sixteen items. Open-first is on, so item 1 starts expanded.
ADV-DENSITY-ACC-14. Sixteen items. Open-first is on, so item 1 starts expanded.
ADV-DENSITY-ACC-15. Sixteen items. Open-first is on, so item 1 starts expanded.
ADV-DENSITY-ACC-16. Sixteen items. Open-first is on, so item 1 starts expanded.
Ten vertical tabs, 80vh
ADV-DENSITY-TAB-1. Vertical, 80vh. On a phone this parent becomes an accordion. Ten tabs will wrap or scroll on desktop.
ADV-DENSITY-TAB-2. Vertical, 80vh. On a phone this parent becomes an accordion. Ten tabs will wrap or scroll on desktop.
ADV-DENSITY-TAB-3. Vertical, 80vh. On a phone this parent becomes an accordion. Ten tabs will wrap or scroll on desktop.
ADV-DENSITY-TAB-4. Vertical, 80vh. On a phone this parent becomes an accordion. Ten tabs will wrap or scroll on desktop.
ADV-DENSITY-TAB-5. Vertical, 80vh. On a phone this parent becomes an accordion. Ten tabs will wrap or scroll on desktop.
ADV-DENSITY-TAB-6. Vertical, 80vh. On a phone this parent becomes an accordion. Ten tabs will wrap or scroll on desktop.
ADV-DENSITY-TAB-7. Vertical, 80vh. On a phone this parent becomes an accordion. Ten tabs will wrap or scroll on desktop.
ADV-DENSITY-TAB-8. Vertical, 80vh. On a phone this parent becomes an accordion. Ten tabs will wrap or scroll on desktop.
ADV-DENSITY-TAB-9. Vertical, 80vh. On a phone this parent becomes an accordion. Ten tabs will wrap or scroll on desktop.
ADV-DENSITY-TAB-10. Vertical, 80vh. On a phone this parent becomes an accordion. Ten tabs will wrap or scroll on desktop.
Six columns, type 4, square
Six-column type 4. ADV-DENSITY-FB.
Six-column type 4. ADV-DENSITY-FB.
Six-column type 4. ADV-DENSITY-FB.
Six-column type 4. ADV-DENSITY-FB.
Six-column type 4. ADV-DENSITY-FB.
Six-column type 4. ADV-DENSITY-FB.
Read more 0px and 400px
ADV-DENSITY-RM0. Zero collapsed height hides the body until expand.
Second paragraph.
ADV-DENSITY-RM400. Four hundred pixels is the top of the vocab.
Need enough copy to overflow on a desktop column.
Third.
Fourth.
Fifth.
Sixth.
Seventh.
Fifteen logos, no hover
More Advanced Pages
These pages are composition stress tests. They are not the frozen gallery and not the commercial storefront.