source/_includes/nav.html

<!-- Navigation -->
<div class="ui container">
    <div class="ui grid computer only tablet only">
        <div class="ui top fixed hidden borderless menu theme-nav transition"
             style="box-shadow: rgba(0, 0, 0, 0.05) 0px 20px 20px -15px;">
            <div class="ui container">
                <a class="item" href="/"><img class="ui small image" src="../assets/img/airavata-logo.png"
                                              alt="Logo" class="ui centered small image"></a>
                <div class="right menu">
                    <a class="item" href="/platform">Platform</a>
                    <a class="item" href="/about">About</a>
                    <a class="item" href="/learning">Learning</a>
                    <a class="item" href="/publications">Publications</a>
                    <a class="item" href="/community">Community</a>
                    <!--<a class="ui dropdown item">Community<i class="dropdown icon"></i>
                        <div class="menu">
                            <div class="item" href="">Mailing Lists</div>
                            <div class="item" href="">Releases</div>
                            <div class="item" href="">Contribution</div>
                            <div class="item" href="/community">Community</div>
                            <div class="item" href="">Road Map</div>
                        </div>
                    </a>-->

                    <div class="item">
                        <a class="ui large button teal" href="/get-involved">Get Involved</a>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <div class="ui grid mobile only">
        <div class="ui top fixed hidden borderless menu theme-mobile-nav transition"
             style="box-shadow: rgba(0, 0, 0, 0.05) 0px 20px 20px -15px;display: flex !important;">
            <div class="ui container">
                <div class="left item">
                    <div class="ui dropdown item">
                        <i class="bars icon"></i>
                        <div class="menu">
                            <a class="item" href="/platform">Platform</a>
                            <a class="item" href="/about">About</a>
                            <a class="item" href="/learning">Learning</a>
                            <a class="item" href="/publications">Publications</a>
                            <a class="item" href="/community">Community</a>
                            <!--<a class="ui dropdown item">Community<i class="dropdown icon"></i>
                                <div class="menu">
                                    <div class="item" href="">Mailing Lists</div>
                                    <div class="item" href="">Releases</div>
                                    <div class="item" href="">Contribution</div>
                                    <div class="item" href="/community">Community</div>
                                    <div class="item" href="">Road Map</div>
                                </div>
                            </a>-->
                        </div>
                    </div>
                    <a class="item brand-logo" href="/"><img
                            src="../assets/img/airavata-logo.png"
                            class="ui centered medium image"></a>
                </div>
                <div class="right item">
                    <div class="item">
                        <a class="ui button teal" href="/get-involved">Get Involved</a>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>
<!-- End Navigation -->