AMARA Global CSS — Scope & Modules Test

If this page looks like AMARA (cards, spacing, typography, buttons), your global styleguide is active. If it looks plain, your global CSS is not applied on this page.

Test focus: .am-root scope · typography · cards · grids · buttons · hero · accordion · tabs · icon list · media images

Back to AMARA Check availability Contact

1) Cards + Typography

Expected result

This area should be inside a clean card (border, rounded corners, shadow), with comfortable padding.

Inline link test: this should look like an AMARA link (underline style from the styleguide).

List spacing should look intentional.
Line-length should feel readable (not ultra-wide).
Heading spacing should not “stick” to the card.

2) Grid (2 columns on desktop)

Grid card A

This should be one column on mobile, two columns on desktop.

Secondary

Grid card B

Spacing should feel consistent. Buttons should be styled.

Primary

3) Grid-3 (3 tiles on desktop)

Tile

Frigiliana

If this is stacked in 3 columns on desktop, your grid-3 CSS works.

Tile

Nerja

Cards should have equal height behavior if your patch is active.

Tile

Tarifa

On mobile this should stack to 1 column.

4) Hero System (no crop, no card frame)

Expected: hero image should be full-width (edge-to-edge), not cropped/zoomed, and not inside a card.

5) Accordion

Accordion item 1

If this panel opens nicely with clean borders + chevron, accordion CSS works.

Accordion item 2

Spacing inside should feel consistent with AMARA rhythm.

6) Tabs

Address WiFi Parking Emergency

Address panel — if you see a floating panel box, tabs CSS works.

WiFi panel — this should animate in and look like a modal panel.

Parking panel — if this shows cleanly, your #amara-tabs system is active.

Emergency panel — test done.

7) Editorial Icon List (tests “black blob” bug)

Icons should be small and clean

If you see a huge black shape, the icon-scope protection is not applied.

Text should align nicely

Spacing, alignment, and typography should feel premium.

8) Media Image (no crop / correct radius)

Expected: image should not be cropped/zoomed; should have a soft radius (if your .am-media img safeguard is active).

Result

If this page looks styled, your global CSS works — and any “unstyled” page is caused by missing .am-root scope, broken HTML wrapper, or using the wrong widget type.

Back to AMARA Check availability

Styleguide Test

Diese Testseite folgt der englischen Version.

Bitte auf EN wechseln — EN ist die Referenz.