|
|
|
@ -306,77 +306,3 @@ input[type="file"] { |
|
|
|
|
.ace_gutter-cell.ace_breakpoint{ |
|
|
|
|
background-color: hsla(0, 82%, 82%, 1); /* red in style-guide.js */ |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
/* The Modal (background) */ |
|
|
|
|
.modal { |
|
|
|
|
display: none; /* Hidden by default */ |
|
|
|
|
position: fixed; /* Stay in place */ |
|
|
|
|
z-index: 6; /* Sit on top */ |
|
|
|
|
left: 0; |
|
|
|
|
top: 0; |
|
|
|
|
width: 100%; /* Full width */ |
|
|
|
|
height: 100%; /* Full height */ |
|
|
|
|
overflow: auto; /* Enable scroll if needed */ |
|
|
|
|
background-color: hsla(0, 0%, 0%, 1); /* Fallback color */ |
|
|
|
|
background-color: hsla(0, 0%, 0%, .4); /* Black w/ opacity */ |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
/* Modal Header */ |
|
|
|
|
.modal-header { |
|
|
|
|
padding: 2px 16px; |
|
|
|
|
background-color: hsla(59, 56%, 78%, 0.5); |
|
|
|
|
border-top-right-radius: 3px; |
|
|
|
|
border-top-left-radius: 3px; |
|
|
|
|
color: white; |
|
|
|
|
display: flex; |
|
|
|
|
align-items: baseline; |
|
|
|
|
justify-content: space-between; |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
/* Modal Body */ |
|
|
|
|
.modal-body {padding: 2px 16px;} |
|
|
|
|
|
|
|
|
|
/* Modal Footer */ |
|
|
|
|
.modal-footer { |
|
|
|
|
padding: 2px 16px; |
|
|
|
|
background-color: hsla(59, 56%, 78%, 0.5); |
|
|
|
|
color: black; |
|
|
|
|
display: flex; |
|
|
|
|
justify-content: flex-end; |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
/* Modal Content */ |
|
|
|
|
.modal-content { |
|
|
|
|
position: relative; |
|
|
|
|
background-color: hsl(0, 0%, 100%); /* white in style-guide.js */ |
|
|
|
|
margin: auto; |
|
|
|
|
padding: 0; |
|
|
|
|
border-top-right-radius: 3px; |
|
|
|
|
border-top-left-radius: 3px; |
|
|
|
|
width: 50%; |
|
|
|
|
box-shadow: 0 4px 8px 0 rgba(0,0,0,0.2),0 6px 20px 0 rgba(0,0,0,0.19); |
|
|
|
|
-webkit-animation-name: animatetop; |
|
|
|
|
-webkit-animation-duration: 0.4s; |
|
|
|
|
animation-name: animatetop; |
|
|
|
|
animation-duration: 0.4s; |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
#modal-footer-cancel { |
|
|
|
|
margin-left: 1em; |
|
|
|
|
cursor: pointer; |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
#modal-footer-ok { |
|
|
|
|
cursor: pointer; |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
/* Add Animation */ |
|
|
|
|
@-webkit-keyframes animatetop { |
|
|
|
|
from {top: -300px; opacity: 0} |
|
|
|
|
to {top: 0; opacity: 1} |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
@keyframes animatetop { |
|
|
|
|
from {top: -300px; opacity: 0} |
|
|
|
|
to {top: 0; opacity: 1} |
|
|
|
|
} |
|
|
|
|