The overall layout of the board page is different from all of the other pages in the application. We will put everything inside a .page division, which looks like the following; the height of the <body> tag and #app divisions will be 100%:
<body> <div id="app"> <div class="page"> <div class="page-header"></div> <div class="page-body"> <div class="board-wrapper"> <div class="board"></div> </div> </div> </div> </div></body>
Inside the .page element, we will have a .page-header element, which is the same header as the home page, and a .page-body element, which contains a .board-wrapper element. Inside the .board-wrapper, we will put a .board element. Figure 12.5 shows the high-level layout of the board page: