Skip to content

Instantly share code, notes, and snippets.

@Xenofex
Created November 9, 2015 08:26
Show Gist options
  • Save Xenofex/e8d7df73939c0c7c7105 to your computer and use it in GitHub Desktop.
Save Xenofex/e8d7df73939c0c7c7105 to your computer and use it in GitHub Desktop.
.modal {
position: fixed;
width: 100%;
height: 100%;
top: 0;
left: 0;
z-index: 100;
.bg {
position: absolute;
background: rgba(0, 0, 0, 0.8);
width: 100%;
height: 100%;
top: 0;
left: 0;
}
.content {
position: absolute;
top: 0;
left: 0;
z-index: 50;
width: 100%;
height: 100%;
display: flex;
align-items: center;
justify-content: center;
.inner {
width: 200px;
height: 200px;
background: white;
}
}
.qrcode, .code {
margin-left: auto;
margin-right: auto;
}
.qrcode {
width: 70%;
height: 70%;
background: gray;
margin-top: 20px;
}
.code {
margin-top: 10px;
text-align: center;
}
}
@Xenofex
Copy link
Author

Xenofex commented Nov 9, 2015

    <div class="modal">
      <div class="bg"></div>
      <div class="content"> 
        <div class="inner">
          <div class="qrcode"></div>
          <div class="code">0005 2211 89</div>
        </div>
      </div>
    </div>

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment