modal for "continue with confidence"
This commit is contained in:
parent
9062b4e1a2
commit
5476cf39e9
11 changed files with 77 additions and 166 deletions
|
|
@ -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
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue