confirmationDialogBox.scss
TLDR
This file contains SCSS code for styling a confirmation dialog box component.
Classes
.confirmation-dialog-box
This class represents the container for the confirmation dialog box. It includes styling for the dialog box itself and a toolbar.
.box-area
This class represents the area inside the confirmation dialog box where the content is displayed. It includes styling for centering the content and setting padding.
.text-heading5
This class represents the heading text inside the confirmation dialog box. It includes styling for margin.
.sub-text
This class represents the subheading text inside the confirmation dialog box. It includes styling for text alignment.
.action-buttons
This class represents the container for the action buttons inside the confirmation dialog box. It includes styling for displaying the buttons in a row, setting the gap between the buttons, and setting the number of columns in the grid layout.
(END)
@import '../styles/z-index';
.confirmation-dialog-box {
.dialog {
@include z-index(confirmation-dialog-box);
> .toolbar {
position: absolute;
top: 0;
right: 0;
}
}
}
.box-area {
display: grid;
place-items: center;
padding: 48px 40px;
.text-heading5 {
margin: 0 0 8px;
}
.sub-text {
text-align: center;
}
}
.action-buttons {
display: flex;
grid-gap: 12px;
gap: 12px;
grid-template-columns: repeat(2, 1fr);
margin-top: 32px;
}