lychiyu/frequi_origin
1
0
Fork 0
mirror of https://github.com/freqtrade/frequi.git synced 2024-11-27 05:25:17 +00:00
Code Issues Actions 1 Packages Projects Releases Wiki Activity

Improve responsive navbar

Browse Source
This commit is contained in:
Matthias 2021-09-26 09:48:57 +02:00
parent 1ba29e80fa
commit ebe3ce21d5
1 changed files with 44 additions and 30 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

44
src/components/layout/NavBar.vue
View File

@ -10,20 +10,17 @@
<!-- <ReloadControl class="mr-3" /> --> <!-- <ReloadControl class="mr-3" /> -->
<b-navbar-toggle target="nav-collapse"></b-navbar-toggle> <b-navbar-toggle target="nav-collapse"></b-navbar-toggle>
<b-collapse id="nav-collapse" is-nav> <b-collapse id="nav-collapse" class="text-right text-md-center" is-nav>
<b-navbar-nav> <b-navbar-nav>
<router-link v-if="!canRunBacktest" class="nav-link navbar-nav navbar-dark" to="/trade" <router-link v-if="!canRunBacktest" class="nav-link navbar-nav" to="/trade"
>Trade</router-link >Trade</router-link
> >
<router-link <router-link v-if="!canRunBacktest" class="nav-link navbar-nav" to="/dashboard"
v-if="!canRunBacktest"
class="nav-link navbar-nav navbar-dark"
to="/dashboard"
>Dashboard</router-link >Dashboard</router-link
> >
<router-link class="nav-link navbar-nav navbar-dark" to="/graph">Graph</router-link> <router-link class="nav-link navbar-nav" to="/graph">Graph</router-link>
<router-link class="nav-link navbar-nav navbar-dark" to="/logs">Logs</router-link> <router-link class="nav-link navbar-nav" to="/logs">Logs</router-link>
<router-link v-if="canRunBacktest" class="nav-link navbar-nav navbar-dark" to="/backtest" <router-link v-if="canRunBacktest" class="nav-link navbar-nav" to="/backtest"
>Backtest</router-link >Backtest</router-link
> >
<BootswatchThemeSelect /> <BootswatchThemeSelect />
@ -32,6 +29,7 @@
<!-- Right aligned nav items --> <!-- Right aligned nav items -->
<b-navbar-nav class="ml-auto" menu-class="w-100"> <b-navbar-nav class="ml-auto" menu-class="w-100">
<!-- TODO This should show outside of the dropdown in XS mode --> <!-- TODO This should show outside of the dropdown in XS mode -->
<div class="d-flex justify-content-between">
<b-dropdown <b-dropdown
v-if="botCount > 1" v-if="botCount > 1"
size="sm" size="sm"
@ -47,7 +45,8 @@
<BotList :small="true" /> <BotList :small="true" />
</b-dropdown> </b-dropdown>
<ReloadControl class="mr-3" /> <ReloadControl class="mr-3" />
<li class="nav-item text-secondary mr-2"> </div>
<li class="d-none d-sm-block nav-item text-secondary mr-2">
<b-nav-text class="verticalCenter small mr-2"> <b-nav-text class="verticalCenter small mr-2">
{{ botName || 'No bot selected' }} {{ botName || 'No bot selected' }}
</b-nav-text> </b-nav-text>
@ -75,13 +74,28 @@
</b-nav-item-dropdown> </b-nav-item-dropdown>
<div class="d-block d-sm-none"> <div class="d-block d-sm-none">
<!-- Visible only on XS --> <!-- Visible only on XS -->
<b-dropdown-item>V: {{ getUiVersion }}</b-dropdown-item> <li class="nav-item text-secondary ml-2 d-sm-none d-flex justify-content-between">
<router-link class="dropdown-item" to="/settings">Settings</router-link> <span class="nav-link navbar-nav">V: {{ getUiVersion }}</span>
<b-checkbox v-model="layoutLockedLocal" class="pl-5">Lock layout</b-checkbox> <div class="d-flex">
<b-dropdown-item @click="resetDynamicLayout">Reset Layout</b-dropdown-item> <b-nav-text class="verticalCenter small mr-2">
{{ botName || 'No bot selected' }}
</b-nav-text>
<b-nav-text class="verticalCenter">
{{ isBotOnline ? 'Online' : 'Offline' }}
</b-nav-text>
</div>
</li>
<router-link class="nav-link navbar-nav" to="/settings">Settings</router-link>
<div class="d-flex nav-link justify-content-end">
<b-checkbox v-model="layoutLockedLocal" class="ml-2"> Lock layout</b-checkbox>
</div>
<nav-item class="nav-link navbar-nav" @click="resetDynamicLayout"
>Reset Layout</nav-item
>
<router-link <router-link
v-if="botCount === 1" v-if="botCount === 1"
class="dropdown-item" class="nav-link navbar-nav"
to="/" to="/"
@click.native="clickLogout()" @click.native="clickLogout()"
>Sign Out</router-link >Sign Out</router-link