appwrite/app/views/console/comps/header.phtml

<div data-service="projects.getProject" data-event="project-load" data-name="console-project" data-param-project-id="{{router.params.project}}">
</div>

<header class="clear">
    &nbsp;&nbsp;&nbsp;
    <div class="list pull-start project-only">
        <label>
            <select data-ls-bind="{{console-project.$uid}}" data-switch data-ls-loop="projects" data-ls-as="option">
                <option data-ls-attrs="value={{option.$uid}}" data-ls-bind="{{option.name}}"></option>
            </select>
        </label>
    </div>

    <button style="overflow: visible;" class="project-only setup-new tooltip round down" aria-label="Quick Start" data-tooltip="Create a new project"><i class="icon-plus"></i></button>

    <div class="account-box clear pull-end" data-service="account.get" data-name="account" data-scope="console" data-event="load">

        <div class="pull-end console-back">
            <a href="/console">Back to Console &nbsp;<i class="icon-right-open"></i></a>
        </div>

        <a href="/console/account" class="account pull-end clear">
            <img src="" data-ls-attrs="src={{account|gravatar}}" alt="User Avatar" class="avatar margin-start pull-end" />
            <span class="name pull-end" data-ls-bind="{{account.name}}"></span>
        </a>
    </div>

    <nav>
        <a class="logo" href="/console">
            <img src="/images/appwrite-nav.svg" alt="Appwrite Logo" />
        </a>

        <div data-ui-highlight class="project-only container">

            <ul class="links">
                <li>
                    <a data-ls-attrs="href=/console/home?project={{console-project.$uid}}">
                        <i class="icon-home"></i>
                        Home
                    </a>
                </li>
            </ul>

            <b class="subtitle">DEVELOP</b>

            <ul class="links">
                <li>
                    <a data-ls-attrs="href=/console/database?project={{console-project.$uid}}">
                        <i class="icon-database"></i>
                        Database
                    </a>
                </li>
                <li>
                    <a data-ls-attrs="href=/console/storage?project={{console-project.$uid}}">
                        <i class="icon-folder"></i>
                        Storage
                    </a>
                </li>
                <li>
                    <a data-ls-attrs="href=/console/users?project={{console-project.$uid}}">
                        <i class="icon-users"></i>
                        Users
                    </a>
                </li>
            </ul>

            <b class="subtitle">MANAGE</b>

            <ul class="links">
                <li>
                    <a data-ls-attrs="href=/console/keys?project={{console-project.$uid}}">
                        <i class="icon-key-inv"></i>
                        API Keys
                    </a>
                </li>
                <li>
                    <a data-ls-attrs="href=/console/webhooks?project={{console-project.$uid}}">
                        <i class="icon-link"></i>
                        Webhooks
                    </a>
                </li>
                <li>
                    <a data-ls-attrs="href=/console/tasks?project={{console-project.$uid}}">
                        <i class="icon-clock"></i>
                        Tasks
                    </a>
                </li>
            </ul>
        </div>

        <ul class="links bottom project-only">
            <li>
                <a data-ls-attrs="href=/console/settings?project={{console-project.$uid}}"><i class="icon-cog"></i> Settings</a>
            </li>
        </ul>
    </nav>
</header>

<div class="list pull-start project-only" data-service="projects.listProjects" data-event="load" data-name="projects" data-scope="console"></div>

<div class="" data-service="locale.getLocale" data-name="geo" data-event="load"></div>

<div class="" data-service="locale.getCountries" data-name="geo-countries" data-event="load"></div>

<div class="" data-service="locale.getCountriesPhones" data-name="geo-countries-phones" data-event="load"></div>

<div data-ui-modal class="modal close" data-button-alias=".setup-new" data-button-icon="icon-plus" data-button-class="project-only" data-open-event="new-project">
    <h1>Add Project</h1>

    <form data-setup>
        <p class="note">Appwrite project is set of services and resources shared across different platforms like Web, iOS or Android.</p>

        <input type="hidden" class="full-width" name="plan" value="" />
        <input type="hidden" class="full-width" name="vault" value="" />

        <label>Name</label>
        <input type="text" class="full-width" name="name" required autocomplete="off" />

        <br />

        <footer>
            <button type="submit">Create</button> &nbsp; <button data-ui-modal-close="" type="button" class="reverse">Cancel</button>
        </footer>
    </form>
</div>