Skip to content

Instantly share code, notes, and snippets.

@tamirazrab
Created December 28, 2021 19:31
Show Gist options
  • Select an option

  • Save tamirazrab/623c406cf1ff05ddb32c63d77d9d54fe to your computer and use it in GitHub Desktop.

Select an option

Save tamirazrab/623c406cf1ff05ddb32c63d77d9d54fe to your computer and use it in GitHub Desktop.
.modal-backdrop {
position: fixed;
top: 0;
left: 0;
width: 100%;
height: 100vh;
background: rgba(0, 0, 0, 0.75);
z-index: 10;
}
.modal {
position: fixed;
top: 10vh;
left: 10%;
width: 80%;
max-height: 80vh;
background: white;
border-radius: 5px;
z-index: 100;
box-shadow: 0 2px 8px rgba(0, 0, 0, 0.26);
overflow: scroll;
}
h1 {
padding: 1rem;
margin: 0;
border-bottom: 1px solid #ccc;
font-family: 'Roboto Slab', sans-serif;
}
.content {
padding: 1rem;
}
footer {
padding: 1rem;
}
@media (min-width: 768px) {
.modal {
width: 40rem;
left: calc(50% - 20rem);
}
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment