Comment on page
Customization
Using CSS classes, it is possible to customize the capture step of Web SDKs.
On this page, you will find documentation regarding the nomenclature of these classes, as well as some customization examples.
This part of the documentation is a work in progress. If you have any questions or suggestions, please contact us.
Class name:
caf-sdk-video-title
Class name:
caf-sdk-video-switch-camera-button
Class name:
caf-sdk-video-
maskClass name:
caf-sdk-button-take-picture
Class name:
caf-sdk-spinner-container
Child classes:
caf-sdk-spinner-icon
, caf-sdk-spinner-circle
Class name:
caf-sdk-video-message-container
Child class:
caf-sdk-video-message-text
Related classes:
caf-sdk-message-success
, caf-sdk-message-info
, caf-sdk-message-warning
, caf-sdk-message-error
Class name:
caf-sdk-video-action-container
Child classes:
caf-sdk-video-action-text
Related classes:
caf-sdk-message-success
, caf-sdk-message-info
, caf-sdk-message-warning
, caf-sdk-message-error
.caf-sdk-video-action-container {
border-radius: 5px;
background-color: white;
border: 1px solid gray;
padding: 10px;
width: 95%;
min-height: 75px;
justify-content: center;
align-items: center;
display: none;
}
.caf-sdk-video-action-text {
color: black !important;
font-weight: 500 !important;
position: relative;
}
.caf-sdk-video-action-text.caf-sdk-message-warning::before {
position: absolute;
display: block;
content: '';
background: url('https://cdn3.iconfinder.com/data/icons/interface-fat-line-vol-2/16/face-recognistion-focus-center-512.png');
background-position: center;
background-repeat: no-repeat;
background-size: cover;
left: -30px;
top: 5px;
height: 30px;
width: 30px;
z-index: 100;
}
Last modified 1yr ago