dave/coolify
1
0
Fork 0
Code Issues Pull Requests Actions 2 Packages Projects Releases Wiki Activity

css

Browse Source
This commit is contained in:
Andras Bacsai
2023-05-22 15:47:40 +02:00
parent 1dbd1065f9
commit a044354294
25 changed files with 332 additions and 209 deletions
Download Patch File Download Diff File Expand all files Collapse all files

16
resources/views/components/applications/navbar.blade.php
View File

@@ -1,5 +1,5 @@
<nav class="flex gap-4 py-2 border-b-2 border-solid border-coolgray-200">
<a
<a class="{{ request()->routeIs('project.application.configuration') ? 'text-white' : '' }}"
href="{{ route('project.application.configuration', [
'project_uuid' => Route::current()->parameters()['project_uuid'],
'application_uuid' => Route::current()->parameters()['application_uuid'],
@@ -7,7 +7,7 @@
]) }}">
Configuration
</a>
<a
<a class="{{ request()->routeIs('project.application.deployments') ? 'text-white' : '' }}"
href="{{ route('project.application.deployments', [
'project_uuid' => Route::current()->parameters()['project_uuid'],
'application_uuid' => Route::current()->parameters()['application_uuid'],
@@ -16,11 +16,14 @@
Deployments
</a>
<div class="flex-1"></div>
<div class="dropdown dropdown-hover">
<x-inputs.button>Links
<div class="dropdown dropdown-bottom">
<button tabindex="0"
class="flex items-center justify-center h-full text-white normal-case bg-transparent border-none rounded btn btn-xs no-animation">
Links
<x-chevron-down />
</x-inputs.button>
<ul tabindex="0" class="p-2 font-bold text-white rounded min-w-max dropdown-content menu bg-coolgray-200">
</button>
<ul tabindex="0"
class="text-xs text-white normal-case rounded min-w-max dropdown-content menu bg-coolgray-200">
<li>
<a class="text-xs" target="_blank" href="{{ $application->gitBranchLocation }}">
Open on Git
@@ -48,5 +51,6 @@
@endif
</ul>
</div>
</div>
<livewire:project.application.deploy :applicationId="$application->id" />
</nav>

8
resources/views/components/layout.blade.php
View File

@@ -25,16 +25,18 @@
</head>
<body>
@livewireScripts
@auth
<x-navbar />
@endauth
<main class="min-h-full px-8 pt-10 mx-auto max-w-7xl">
<main>
<div class="flex justify-center w-full">
<x-magic-bar />
</div>
{{ $slot }}
</main>
<a
class="fixed text-xs cursor-pointer left-2 bottom-1 opacity-20 hover:opacity-100 hover:text-white">v{{ config('version') }}</a>
class="fixed text-xs cursor-pointer right-2 bottom-1 opacity-60 hover:opacity-100 hover:text-white">v{{ config('version') }}</a>
@auth
<script>
window.addEventListener("keydown", function(event) {

39
resources/views/components/magic-bar.blade.php
View File

@@ -13,14 +13,10 @@
<template x-for="(item,index) in filteredItems" :key="item.name">
<div x-on:click="await set(item.next ?? 'server',item.name)"
:class="focusedIndex === index && 'magic-item-focused'" class="magic-item">
<span class="w-12 badge badge-primary badge-sm" x-show="item.type === 'Apps'"
x-text="item.type"></span>
<span class="w-12 badge badge-secondary badge-sm" x-show="item.type === 'Add'"
x-text="item.type"></span>
<span class="w-12 badge badge-success badge-sm" x-show="item.type === 'Jump'"
x-text="item.type"></span>
<span class="w-12 badge badge-success badge-sm" x-show="item.type === 'New'"
x-text="item.type"></span>
<span class="magic-badge" x-show="item.type === 'Apps'" x-text="item.type"></span>
<span class="magic-badge" x-show="item.type === 'Add'" x-text="item.type"></span>
<span class="magic-badge" x-show="item.type === 'Jump'" x-text="item.type"></span>
<span class="magic-badge" x-show="item.type === 'New'" x-text="item.type"></span>
<span x-text="item.name"></span>
</div>
</template>
@@ -42,7 +38,7 @@
<template x-for="(server,index) in filteredServers" :key="server.name ?? server">
<div x-on:click="await set('destination',server.uuid)"
:class="focusedIndex === index && 'magic-item-focused'" class="magic-item">
<span class="badge badge-primary badge-sm">Server</span>
<span class="magic-badge">Server</span>
<span x-text="server.name"></span>
</div>
</template>
@@ -65,7 +61,7 @@
<template x-for="(destination,index) in filteredDestinations" :key="destination.name ?? destination">
<div x-on:click="await set('project',destination.uuid)"
:class="focusedIndex === index && 'magic-item-focused'" class="magic-item">
<span class=" badge badge-primary badge-sm">Destination</span>
<span class=" magic-badge">Destination</span>
<span x-text="destination.name"></span>
</div>
</template>
@@ -88,7 +84,7 @@
<template x-for="(project,index) in filteredProjects" :key="project.name ?? project">
<div x-on:click="await set('environment',project.uuid)"
:class="focusedIndex === index + 1 && 'magic-item-focused'" class="magic-item">
<span class="badge badge-primary badge-sm">Project</span>
<span class="magic-badge">Project</span>
<span x-text="project.name"></span>
</div>
</template>
@@ -98,7 +94,8 @@
{{-- Environments --}}
<template x-cloak x-if="environmentMenu">
<div x-on:click.outside="closeMenus">
<input class="magic-input" x-ref="search" x-model="search" placeholder="Select a environment..."
<input class="magic-input" x-ref="search" x-model="search"
placeholder="Enter the new environment name or select one..."
x-on:keydown.down="focusNext(environments.length + 1)"
x-on:keydown.up="focusPrev(environments.length + 1)" x-on:keyup.escape="closeMenus"
x-on:keyup.enter="focusedIndex !== '' && await set('jump',filteredEnvironments()[focusedIndex - 1]?.name)" />
@@ -106,12 +103,12 @@
<div x-on:click="await newEnvironment" :class="focusedIndex === 0 && 'magic-item-focused'"
class="magic-item">
<span>New Environment</span>
<span x-text="search"></span>
<span class="text-warning" x-text="search"></span>
</div>
<template x-for="(environment,index) in filteredEnvironments" :key="environment.name ?? environment">
<div x-on:click="await set('jump',environment.name)"
:class="focusedIndex === index + 1 && 'magic-item-focused'" class="magic-item">
<span class="badge badge-primary badge-sm">Env</span>
<span class="magic-badge">Env</span>
<span x-text="environment.name"></span>
</div>
</template>
@@ -121,9 +118,9 @@
{{-- Projects --}}
<template x-cloak x-if="projectsMenu">
<div x-on:click.outside="closeMenus">
<input x-ref="search" x-model="search" class="magic-input" placeholder="Select a project..."
x-on:keyup.escape="closeMenus" x-on:keydown.down="focusNext(projects.length)"
x-on:keydown.up="focusPrev(projects.length)"
<input x-ref="search" x-model="search" class="magic-input"
placeholder="Enter the new project name or select one..." x-on:keyup.escape="closeMenus"
x-on:keydown.down="focusNext(projects.length)" x-on:keydown.up="focusPrev(projects.length)"
x-on:keyup.enter="focusedIndex !== '' && await set('jumpToProject',filteredProjects()[focusedIndex]?.uuid)" />
<div class="magic-items">
<template x-if="projects.length === 0">
@@ -134,7 +131,7 @@
<template x-for="(project,index) in filteredProjects" :key="project.name ?? project">
<div x-on:click="await set('jumpToProject',project.uuid)"
:class="focusedIndex === index && 'magic-item-focused'" class="magic-item">
<span class="badge badge-primary badge-sm">Jump</span>
<span class="magic-badge">Jump</span>
<span x-text="project.name"></span>
</div>
</template>
@@ -157,7 +154,7 @@
<template x-for="(destination,index) in filteredDestinations" :key="destination.name ?? destination">
<div x-on:click="await set('jumpToDestination',destination.uuid)"
:class="focusedIndex === index && 'magic-item-focused'" class="magic-item">
<span class="badge badge-primary badge-sm">Jump</span>
<span class="magic-badge">Jump</span>
<span x-text="destination.name"></span>
</div>
</template>
@@ -180,7 +177,7 @@
<template x-for="(privateKey,index) in filteredPrivateKeys" :key="privateKey.name ?? privateKey">
<div x-on:click="await set('jumpToPrivateKey',privateKey.uuid)"
:class="focusedIndex === index && 'magic-item-focused'" class="magic-item">
<span class="badge badge-primary badge-sm">Jump</span>
<span class="magic-badge">Jump</span>
<span x-text="privateKey.name"></span>
</div>
</template>
@@ -203,7 +200,7 @@
<template x-for="(source,index) in filteredSources" :key="source.name ?? source">
<div x-on:click="await set('jumpToSource',source)"
:class="focusedIndex === index && 'magic-item-focused'" class="magic-item">
<span class="badge badge-primary badge-sm">Jump</span>
<span class="magic-badge">Jump</span>
<span x-text="source.name"></span>
</div>
</template>

113
resources/views/components/navbar.blade.php
View File

@@ -1,5 +1,104 @@
@auth
<div class="navbar">
<nav class="main-navbar">
<ul class="gap-2 p-1 pt-2 menu">
<li class="{{ request()->is('/') ? 'text-warning' : '' }}">
<a @if (!request()->is('/')) href="/" @endif>
<svg xmlns="http://www.w3.org/2000/svg" class="icon" fill="none" viewBox="0 0 24 24"
stroke="currentColor">
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
d="M3 12l2-2m0 0l7-7 7 7M5 10v10a1 1 0 001 1h3m10-11l2 2m-2-2v10a1 1 0 01-1 1h-3m-6 0a1 1 0 001-1v-4a1 1 0 011-1h2a1 1 0 011 1v4a1 1 0 001 1m-6 0h6" />
</svg>
</a>
</li>
<li class="{{ request()->is('server/*') || request()->is('servers') ? 'text-warning' : '' }}">
<a @if (!request()->is('server/*')) href="/servers" @endif>
<svg xmlns="http://www.w3.org/2000/svg" class="icon" viewBox="0 0 24 24" stroke-width="1.5"
stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round">
<path stroke="none" d="M0 0h24v24H0z" fill="none" />
<path d="M3 4m0 3a3 3 0 0 1 3 -3h12a3 3 0 0 1 3 3v2a3 3 0 0 1 -3 3h-12a3 3 0 0 1 -3 -3z" />
<path d="M3 12m0 3a3 3 0 0 1 3 -3h12a3 3 0 0 1 3 3v2a3 3 0 0 1 -3 3h-12a3 3 0 0 1 -3 -3z" />
<path d="M7 8l0 .01" />
<path d="M7 16l0 .01" />
</svg>
</a>
</li>
<li class="{{ request()->is('project/*') || request()->is('projects') ? 'text-warning' : '' }}">
<a @if (!request()->is('project/*')) href="/projects" @endif>
<svg xmlns="http://www.w3.org/2000/svg" class="icon" viewBox="0 0 24 24" stroke-width="1.5"
stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round">
<path stroke="none" d="M0 0h24v24H0z" fill="none" />
<path d="M12 4l-8 4l8 4l8 -4l-8 -4" />
<path d="M4 12l8 4l8 -4" />
<path d="M4 16l8 4l8 -4" />
</svg>
</a>
</li>
@if (auth()->user()->isPartOfRootTeam())
<li class="{{ request()->is('command-center') ? 'text-warning' : '' }}">
<a @if (!request()->is('command-center')) href="/command-center" @endif>
<svg xmlns="http://www.w3.org/2000/svg" class="icon" viewBox="0 0 24 24" stroke-width="1.5"
stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round">
<path stroke="none" d="M0 0h24v24H0z" fill="none" />
<path d="M5 7l5 5l-5 5" />
<path d="M12 19l7 0" />
</svg>
</a>
</li>
<li
class="{{ request()->is('settings') ? 'absolute bottom-0 pb-4 text-warning' : 'absolute bottom-0 pb-4' }}">
<a @if (!request()->is('settings')) href="/settings" @endif>
<svg xmlns="http://www.w3.org/2000/svg" class="icon" viewBox="0 0 24 24" stroke-width="1.5"
stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round">
<path stroke="none" d="M0 0h24v24H0z" fill="none" />
<path
d="M10.325 4.317c.426 -1.756 2.924 -1.756 3.35 0a1.724 1.724 0 0 0 2.573 1.066c1.543 -.94 3.31 .826 2.37 2.37a1.724 1.724 0 0 0 1.065 2.572c1.756 .426 1.756 2.924 0 3.35a1.724 1.724 0 0 0 -1.066 2.573c.94 1.543 -.826 3.31 -2.37 2.37a1.724 1.724 0 0 0 -2.572 1.065c-.426 1.756 -2.924 1.756 -3.35 0a1.724 1.724 0 0 0 -2.573 -1.066c-1.543 .94 -3.31 -.826 -2.37 -2.37a1.724 1.724 0 0 0 -1.065 -2.572c-1.756 -.426 -1.756 -2.924 0 -3.35a1.724 1.724 0 0 0 1.066 -2.573c-.94 -1.543 .826 -3.31 2.37 -2.37c1 .608 2.296 .07 2.572 -1.065z" />
<path d="M9 12a3 3 0 1 0 6 0a3 3 0 0 0 -6 0" />
</svg>
</a>
</li>
@endif
</ul>
</nav>
<div class="absolute top-0 right-0 pt-2">
<div class="dropdown dropdown-left">
<label tabindex="0" class="btn btn-ghost no-animation hover:bg-transparent">
<div class="flex items-center justify-center gap-2 avatar placeholder">
<div class="w-8 rounded-full bg-coolgray-300 text-neutral-content">
<span class="text-xs">{{ Str::of(auth()->user()->name)->substr(0, 2)->upper() }}</span>
</div>
<x-chevron-down />
</div>
</label>
<ul tabindex="0" class="p-2 mt-3 shadow menu menu-compact dropdown-content bg-base-100 rounded-box w-52">
<li>
<a href="/profile">
Profile
</a>
</li>
<li>
<a href="/profile/team">
Team
</a>
</li>
@if (auth()->user()->isPartOfRootTeam())
<li>
<livewire:force-upgrade />
</li>
@endif
<form action="/logout" method="POST">
<li>
@csrf
<button>Logout</button>
</li>
</form>
</ul>
</div>
</div>
{{-- <div class="navbar">
<div class="navbar-start">
<div class="dropdown">
<label tabindex="0" class="btn btn-ghost xl:hidden">
@@ -21,11 +120,11 @@
</a>
</li>
@endif
{{-- <li>
<li>
<a href="/profile">
Profile
</a>
</li> --}}
</li>
<li>
<a href="/profile/team">
Team
@@ -49,7 +148,7 @@
</li>
</ul>
</div>
<div href="/" class="text-xl text-white normal-case btn btn-ghost hover:bg-transparent">Coolify</div>
<div class="px-2 text-xl font-bold text-white normal-case">Coolify</div>
<div class="form-control">
<x-magic-bar />
</div>
@@ -68,11 +167,11 @@
</a>
</li>
@endif
{{-- <li>
<li>
<a href="/profile">
Profile
</a>
</li> --}}
</li>
<li>
<a href="/profile/team">
Team
@@ -96,5 +195,5 @@
</li>
</ul>
</div>
</div>
</div> --}}
@endauth