I am finding it difficult to implement the master and detail split view

   <f7-view main class="safe-areas" url="/"></f7-view> 

   <div class="view view-main">

     <!-- Catalog View -->
    <f7-view  name="contacts" tab url="/contacts/"></f7-view>

    <!-- Settings View -->
    <f7-view  name="category" tab url="/category/"></f7-view>

  
   </div>