modal for "continue with confidence"

This commit is contained in:
John Hess 2024-06-07 18:04:39 -05:00
parent 9062b4e1a2
commit 5476cf39e9
11 changed files with 77 additions and 166 deletions

View file

@ -16,47 +16,54 @@
.modal__container {
background-color: #fff;
padding: 30px;
max-width: 1070px;
max-height: 100vh;
border-radius: 4px;
overflow-y: auto;
box-sizing: border-box;
margin: 10px;
max-width: 500px;
border-radius: 21px;
}
.modal__header {
display: flex;
justify-content: flex-end;
align-items: center;
}
.modal__title {
margin-top: 0;
margin-bottom: 0;
font-weight: 600;
font-size: 1.75em;
line-height: 1.25;
color: $dark-gray;
box-sizing: border-box;
.header__text {
margin: 0 20px;
h2.modal__title {
margin: 30px auto 20px auto;
font-weight: 700;
font-size: 24px;
color: black;
box-sizing: border-box;
text-align: center;
}
}
.modal__close {
margin: 20px;
cursor: pointer;
background: transparent;
font-size: 16px;
font-weight: 600;
text-align: center;
display: block;
border: 0;
}
.modal__header .modal__close:before { content: "\2715"; font-size: 24px; }
.modal__continue {
color: #6166E9;
}
.modal__content {
margin-top: 2rem;
margin-bottom: 2rem;
line-height: 1.5;
@media (max-width: 768px) {
margin-top: 1rem;
}
}
.modal__content__description {
margin: 0 20px;
p {
font-family: $text-font-family;
font-size: 16px;
margin: 20px 0;
}
}
/**************************\
Demo Animation Style