Skip to main content

Classic Launcher

Caast Classic Launcher is generally used on product pages because of it display size. It allow you to show all the incoming lives or your available replays concerning a specific product throught a single display regrouping all the usefull informations.

Settings

You can configure what image orientation Caast should choose if you provide the two image format. You can also decide to not preview the video while the cursor is hovering the card. There is also an option to display or not the reminder

Templating

The Caast launcher can be totally customized via custom template HTML, please refer to the dedicated section if you need this kind of behaviour. You can achieve things like this:

Customized launcher

Style

/*
* -----------------------------------
* Style for Caast Classic Launcher
* -----------------------------------
*/

/*
* A set of css variable used to customize the launcher,
* the values came from our configuration but you can overwrite them locally
*/
:root {
--caast-button-background;
--caast-button-background-darken;
--caast-button-color;
--caast-is-live-color;
--caast-background-image;
}
/*
* Wrapper for injected content
*/
.caast-item[data-caast-type="classic_launcher"] {
}
/*
* Wrapper for widget
*/
.caast-toggler {
}
/*
* Wrapper for widget content
*/
.caast-toggler__content {
}
/*
* Wrapper for the thumbnail content
*/
.caast-toggler__thumbnail {
}
/*
* Widget title
*/
.caast-toggler__title {
}
/*
* Class added to .caast-toggler__title when a live is on
*/
.caast-toggler__title--animated {
}
/*
* Widget description
*/
.caast-toggler__description {
}
/*
* Wrapper for widgets actions like subscribe and launch live
*/
.caast-toggler__actions {
}
/*
* Wrapper for countdown when a llive is about to start
*/
.caast-countdown {
}
/*
* Wrapper for countdown minutes
*/
.caast-countdown__minutes {
}
/*
* Wrapper for countdown seconds
*/
.caast-countdown__seconds {
}
/*
* Widget button
*/
.caast-button {
}
/*
* Class added to .caast-button when loading
*/
.caast-button--loading {
}