sbdevelper90.github.io

SBDeveloper90 GitHub Pages

Example code PrismJS block

<!-- Modal -->
<section id="modal-section" class="doc-section">
    <h2 class="section-title">Modal</h2>
    <div class="section-block">
        <p>Simple modal created from scratch.</p>
        <pre><code class="language-markup display-contents">
        </code></pre>
    </div>
</section>
<!-- End Modal -->

Example code page wrapper

<div class="page-wrapper">
        <!--  HEADER  -->
        <header id="header" class="header">
            <div class="container">
                <div class="branding">
                    <h1 class="logo">
                        <a href="../docs.html">
                            <span aria-hidden="true" class="icon_documents_alt icon"></span>
                            <span class="text-highlight">Pretty</span><span class="text-bold">Docs</span>
                        </a>
                    </h1>
                </div>
                
                <ol class="breadcrumb">
                    <li class="breadcrumb-item"><a href="../docs.html">Home</a></li>
                    <li class="breadcrumb-item active">HTML Docs</li>
                </ol>
                
                <!-- <div class="top-search-box">
	                 <form class="form-inline search-form justify-content-center" action="" method="get">
			            <input type="text" placeholder="Search..." name="search" class="form-control search-input">
			            <button type="submit" class="btn search-btn" value="Search"><i class="fas fa-search"></i></button>
			        </form>
                </div> -->
            </div>
        </header>
        <!--  END HEADER  -->

        <div class="doc-wrapper">
            <div class="container">
                <div id="doc-header" class="doc-header text-center">
                    <h1 class="doc-title"><i class="icon fa fab fa-html5"></i> HTML Docs</h1>
                    <div class="meta"><i class="far fa-clock"></i> Last updated: Dic 14th, 2021</div>
                </div>
                <div class="doc-body row">
                    <div class="doc-content col-md-9 col-12 order-1">
                        <div class="content-inner">
                            <!-- Download -->
                            <section id="download-section" class="doc-section">
                                <h2 class="section-title">Download</h2>
                                <div class="section-block">
                                    <p>Welcome to the mine useful documentation for daily work on web developer and computer programming. Thanks to PrettyDocs for theme template layout; download it at the page linked in the button below.</p>
                                    <a href="https://themes.3rdwavemedia.com/bootstrap-templates/startup/prettydocs-free-bootstrap-theme-for-developers-and-startups/" class="btn btn-html" target="_blank"><i class="fas fa-download"></i> Download PrettyDocs</a>
                                </div>
                            </section>
                            <!-- End Download -->

                            <!-- PrismJS -->
                            <section id="prismjs-section" class="doc-section">
                                <h2 class="section-title">PrismJS</h2>
                                <div class="section-block">
                                    <p><a href="https://prismjs.com/" target="_blank">PrismJS</a> is used as the syntax highlighter here. You can <a href="https://prismjs.com/download.html" target="_blank">build your own version</a> via their website should you need to.</p>
                                </div>
                            </section>
                            <!-- End PrismJS -->
                            
                        </div>
                    </div>

                    <!--  SIDEBAR MENU  -->
                    <div class="doc-sidebar col-md-3 col-12 order-0 d-none d-md-flex">
                        <div id="doc-nav" class="doc-nav">
                            <nav id="doc-menu" class="nav doc-menu flex-column sticky">
                                <a class="nav-link scrollto" href="#download-section">Download</a>
                                <a class="nav-link scrollto" href="#prismjs-section">PrismJS</a>
                            </nav>
                        </div>
                    </div>
                    <!--  END SIDEBAR MENU  -->

                </div><!-- end doc-body -->
            </div><!-- end container -->
        </div><!-- end doc-wrapper -->
    </div><!-- end page-wrapper -->