Full-Stack Vue.js 2 and Laravel 5

Window

Let's now add markup for the window that will be overlaid on our background panel. The window will have a width constraint and will be centered in the viewport.

index.html:

<div id="modal" v-bind:class="{ show : modalOpen }">
  <div class="modal-content">
    <img src="sample/header.jpg"/>
  </div>
</div>

style.css:

.modal-content {
  height: 100%;
  max-width: 105vh;
  padding-top: 12vh;
  margin: 0 auto;
  position: relative;
}

.modal-content img {
  max-width: 100%;
}