Before we jump into the code instances, you should also note that to create a fullscreen page, you should add the bringer-fullscreen-page class for the disable-smooth-scroll class to turn off the smooth scroll scripts for such pages to optimize performance.
...
body
...
/body
/html
Additionally, you can use the classes no-header-border or no-footer-border to remove the header or footer borders, as we did on the Fullscreen Slider page.
Infinite List
...body ... Page Mainmain Infinite Scrolling Listingdiv Infinite Listdiv Portfolio Post 01div div img /div div span Category Name/span h2 Post Title/h2 /div div span /span /div a /a /div Portfolio Post 02 .../div /div /main .../body
Fullscreen Slider
...body ... Page Mainmain Slider Containerdiv Sliderdiv div Slider Item 01div img div div span Category Name/span h4 Post Title/h4 /div a /a /div /div Slider Item 02 .../div /div /div /main .../body
Single Column Card
This portfolio listing type uses the default content structure as on any other page. Let's take a look at the code example:
...section Portfolio Card Itemdiv Mediadiv img /div Contentdiv div div span Category Name/span h4 Post Title/h4 /div div span /span /div a /a /div /div /div /section
Classic Grid
The same as the previous one, this type of portfolio is a part of the default page content. Moreover, the bringer-portfolio-card block may be used not only for grid containers but also for carousels and other content parts. And now, let's take a look at the code of that item in the Grid container:
...section Portfolio Griddiv Portfolio Card Item 01div div img /div div div span Category Name/span h6 Post Title/h6 /div span /span /div a /a /div Portfolio Card Item 02 .../div /section
More details about the Grid container and the Parallax Media may be found in the previous chapter, where we talk about the Content area.