3
0
Fork 0
mirror of https://github.com/ZeppelinBot/Zeppelin.git synced 2025-05-10 12:25:02 +00:00

Update dashboard side to tailwindcss

This commit is contained in:
Dragory 2019-10-10 22:55:31 +03:00
parent 577500af92
commit 3bd485e7e4
11 changed files with 183 additions and 172 deletions

View file

@ -1,46 +1,47 @@
<template>
<div class="docs">
<div class="container mx-auto px-4 py-2">
<!-- Top bar -->
<nav class="flex items-stretch pl-4 pr-2 py-1 border border-gray-700 rounded bg-gray-800 shadow-xl">
<div class="flex-initial flex items-center">
<img class="flex-auto w-10 mr-5" src="../../img/logo.png" alt="" aria-hidden="true">
<h1 class="flex-auto">Zeppelin Documentation</h1>
</div>
<div class="flex-1 flex items-center justify-end">
<router-link
to="/dashboard"
role="menuitem"
class="py-1 px-2 rounded hover:bg-gray-700">
Go to dashboard
</router-link>
<div class="docs container mx-auto px-4 py-2">
<!-- Top bar -->
<nav class="flex items-stretch pl-4 pr-2 py-1 border border-gray-700 rounded bg-gray-800 shadow-xl">
<div class="flex-initial flex items-center">
<img class="flex-auto w-10 mr-5" src="../../img/logo.png" alt="" aria-hidden="true">
<router-link to="/docs">
<h1 class="flex-auto font-semibold">Zeppelin Documentation</h1>
</router-link>
</div>
<div class="flex-1 flex items-center justify-end">
<router-link
to="/dashboard"
role="menuitem"
class="py-1 px-2 rounded hover:bg-gray-700">
Go to dashboard
</router-link>
</div>
</nav>
<!-- WIP bar -->
<div class="mt-6 px-3 py-2 rounded bg-gray-800 shadow-md">
<i class="mdi mdi-alert mr-1" title="Note"></i>
This documentation is a work in progress.
</div>
<!-- Content wrapper -->
<div class="flex items-start mt-8">
<!-- Sidebar -->
<nav class="docs-sidebar flex-none px-4 pt-2 pb-3 mr-8 border border-gray-700 rounded bg-gray-800 shadow-md">
<div role="none" v-for="(group, index) in menu">
<h1 class="font-bold" :aria-owns="'menu-group-' + index" :class="{'mt-4': index !== 0}">{{ group.label }}</h1>
<ul v-bind:id="'menu-group-' + index" role="group" class="list-none pl-2">
<li role="none" v-for="item in group.items">
<router-link role="menuitem" :to="item.to" class="text-gray-300 hover:text-gray-500">{{ item.label }}</router-link>
</li>
</ul>
</div>
</nav>
<!-- WIP bar -->
<div class="mt-6 px-3 py-2 rounded bg-gray-800 shadow-md">
<i class="mdi mdi-alert mr-1" title="Note"></i>
This documentation is a work in progress.
</div>
<!-- Content wrapper -->
<div class="flex items-start mt-8">
<!-- Sidebar -->
<nav class="docs-sidebar flex-none px-4 pt-2 pb-3 mr-8 border border-gray-700 rounded bg-gray-800 shadow-md">
<div role="none" v-for="(group, index) in menu">
<h1 class="font-bold" :aria-owns="'menu-group-' + index" :class="{'mt-4': index !== 0}">{{ group.label }}</h1>
<ul v-bind:id="'menu-group-' + index" role="group" class="list-none pl-2">
<li role="none" v-for="item in group.items">
<router-link role="menuitem" :to="item.to" class="text-gray-300 hover:text-gray-500">{{ item.label }}</router-link>
</li>
</ul>
</div>
</nav>
<!-- Content -->
<div class="docs-content flex-auto overflow-x-hidden">
<router-view :key="$route.fullPath"></router-view>
</div>
<!-- Content -->
<div class="docs-content main-content flex-auto overflow-x-hidden">
<router-view :key="$route.fullPath"></router-view>
</div>
</div>
</div>