Skip to main content

Class names

Written by AdOpt Support
Updated over 5 months ago

Component: controller

class button

controller-button-class.png

styles: {
  web: { controller: { button: { ...props } } },
  mobile: { controller: { button: { ...props } } }
}

Component: card

class container

card-container-class.png

styles: {
  web: { card: { container: { ...props } } },
  mobile: { card: { container: { ...props } } }
}

class content

card-content-class.png

styles: {
  web: { card: { content: { ...props } } },
  mobile: { card: { content: { ...props } } }
}

class textContainer

card-text-container-class.png

styles: {
  web: { card: { textContainer: { ...props } } },
  mobile: { card: { textContainer: { ...props } } }
}

class titleRow

card-title-row-class.png

styles: {
  web: { card: { titleRow: { ...props } } },
  mobile: { card: { titleRow: { ...props } } }
}

class title

card-title-class.jpg

styles: {
  web: { card: { title: { ...props } } },
  mobile: { card: { title: { ...props } } }
}

class adoptLink

card-adopt-link-class.png

styles: {
  web: { card: { adoptLink: { ...props } } },
  mobile: { card: { adoptLink: { ...props } } }
}

class textsRow

card-texts-row-class.png

styles: {
  web: { card: { textsRow: { ...props } } },
  mobile: { card: { textsRow: { ...props } } }
}

class textRowContent

card-text-row-content-class.png

styles: {
  web: { card: { textRowContent: { ...props } } },
  mobile: { card: { textRowContent: { ...props } } }
}

class textRowLinks

card-text-row-links-class.png

styles: {
  web: { card: { textRowLinks: { ...props } } },
  mobile: { card: { textRowLinks: { ...props } } }
}

class buttonsContainer

card-buttons-container-class.png

styles: {
  web: { card: { buttonsContainer: { ...props } } },
  mobile: { card: { buttonsContainer: { ...props } } }
}

class preferencesButton or class rejectAllLink (CCPA)

card-preferences-button-class.png

styles: {
  web: { card: { preferencesButton: { ...props }, /* ou */ rejectAllLink: { ...props } } },
  mobile: { card: { preferencesButton: { ...props }, /* ou */ rejectAllLink: { ...props } } }
}

class rejectAllButton

card-reject-all-button-class.png

styles: {
  web: { card: { rejectAllButton: { ...props } } },
  mobile: { card: { rejectAllButton: { ...props } } }
}

class acceptAllButton

card-accept-all-button-class.png

styles: {
  web: { card: { acceptAllButton: { ...props } } },
  mobile: { card: { acceptAllButton: { ...props } } }
}

Component: preferenceCard

class panel

preference-card-panel-class.png

styles: {
  web: { preferenceCard: { panel: { ...props } } },
  mobile: { preferenceCard: { panel: { ...props } } }
}

class title

preference-card-title-class.png

styles: {
  web: { preferenceCard: { title: { ...props } } },
  mobile: { preferenceCard: { title: { ...props } } }
}

class closePanel

preference-card-close-panel-class.png

styles: {
  web: { preferenceCard: { closePanel: { ...props } } },
  mobile: { preferenceCard: { closePanel: { ...props } } }
}

class tagCategories

preference-card-tag-categories-class.png

styles: {
  web: { preferenceCard: { tagCategories: { ...props } } },
  mobile: { preferenceCard: { tagCategories: { ...props } } }
}

classe cardFooter

preference-card-card-footer-class.png

styles: {
  web: { preferenceCard: { cardFooter: { ...props } } },
  mobile: { preferenceCard: { cardFooter: { ...props } } }
}

class smallTextFooter

preference-card-small-text-footer-class.png

styles: {
  web: { preferenceCard: { smallTextFooter: { ...props } } },
  mobile: { preferenceCard: { smallTextFooter: { ...props } } }
}

class buttonsContainer

preference-card-buttons-container-class.png

styles: {
  web: { preferenceCard: { buttonsContainer: { ...props } } },
  mobile: { preferenceCard: { buttonsContainer: { ...props } } }
}

class rejectButton

preference-card-reject-button-class.png

styles: {
  web: { preferenceCard: { rejectButton: { ...props } } },
  mobile: { preferenceCard: { rejectButton: { ...props } } }
}

class acceptButton

preference-card-accept-button-class.png

styles: {
  web: { preferenceCard: { acceptButton: { ...props } } },
  mobile: { preferenceCard: { acceptButton: { ...props } } }
}

Component: categories

class category

categories-category-class.png

styles: {
  web: { categories: { category: { ...props } } },
  mobile: { categories: { category: { ...props } } }
}

class title

categories-title-class.png

styles: {
  web: { categories: { title: { ...props } } },
  mobile: { categories: { title: { ...props } } }
}

class description

categories-description-class.png

styles: {
  web: { categories: { description: { ...props } } },
  mobile: { categories: { description: { ...props } } }
}

class toogleShowTags

categories-toogle-show-tags-class.png

styles: {
  web: { categories: { toogleShowTags: { ...props } } },
  mobile: { categories: { toogleShowTags: { ...props } } }
}

class tag

categories-tag-class.png

styles: {
  web: { categories: { tag: { ...props } } },
  mobile: { categories: { tag: { ...props } } }
}

class tagTitleSection

categories-tag-title-section-class.png

styles: {
  web: { categories: { tagTitleSection: { ...props } } },
  mobile: { categories: { tagTitleSection: { ...props } } }
}

class tagTitle

categories-tag-title-class.png

styles: {
  web: { categories: { tagTitle: { ...props } } },
  mobile: { categories: { tagTitle: { ...props } } }
}

class tagCookieContainer

categories-tag-cookie-container-class.png

styles: {
  web: { categories: { tagCookieContainer: { ...props } } },
  mobile: { categories: { tagCookieContainer: { ...props } } }
}

class tagCleanCacheLink

categories-tag-clean-cache-link-class.png

styles: {
  web: { categories: { tagCleanCacheLink: { ...props } } },
  mobile: { categories: { tagCleanCacheLink: { ...props } } }
}
Related Articles
Cookie Banners - Cookie and Local Storage detailing
Object adoptChangeClasses
What text edits are possible in the Cookie Banner?
Mobile App Integration
Implementation of Content Security Policy (CSP)
Did this answer your question?