This page serves as a testing ground for qards and we use it to showcase various features and also test it with cypress.
Well, you're looking at it. It has a title and subtitle.
The hero (name subject to change as I'm not sure it's the right one) is like a heading. It is being used to separate chapters and its title will be included in the Table of contents that follows every post.
One or multiple images that will be inserted accordingly
A gallery can contain a single picture or multiple ones. When multiple images are linked, the gallery will create a slider for them. Each image will also open (when clicked) in a full page modal for preview (not currently supported).
An audio playlist can contain one or multiple audio files
Accordions of collapsed content
Sections of code that you want to present
Simple widget that supports all major video platforms and embeds from their source
A rare footage of a very young Mike Tyson sparring Jimmy Clark in 1983
Callouts visually highlight important content for the user. They can contain a title, an icon and a message.
Timezone aware countdowns to events
Sometimes you want to inform your users of certain events. Dealing with dates, events and timezones has always been a struggle. This widget renders a countdown to a specified date and it shows the remaining time and event date in the user's timezone which is detected by the browser. Everything is clear and confusion-free.
Reference another post within a card
Using references you can link to other posts. A card is automatically created with the post title, excerpt and post cover (if exists). The card is meant to refer to other posts and keep your readers engaged.
An image that supports various settings: layout, alt text, lightbox
Quote test: These data indicate that low serum testosterone levels are associated with an adverse metabolic profile and suggest a novel unifying mechanism for the previously independent observations that low testosterone levels and impaired mitochondrial function promote insulin resistance in men.
Testing snippets for internal use
These snippets serve as a testing ground for qards. . This is an external link; the HTML should have nofollow, noopener, noreferrer and open the link in a _blank page.