Switch to using icons when rendering a DN, and move the server icons to the topmenu

This commit is contained in:
2025-03-04 23:03:42 +11:00
parent 57b6b8c1f1
commit 070aabfc88
11 changed files with 199 additions and 163 deletions

View File

@@ -6,24 +6,6 @@
<li class="nav-item">
<strong>{{ config('app.version') }}</strong>
</li>
@if(($x=Config::get('update_available')) && $x->action !== 'current')
<li class="nav-item ms-2">
@switch($x->action)
@case('unable')
<abbr title="Upstream Version Unavailable"><i class="fas fa-exclamation text-alternate"></i></abbr>
@break
@case('upgrade')
<abbr title="Update Available: {{ $x->version }}"><i class="fas fa-wrench text-danger"></i></abbr>
@break
@case('mismatch')
<abbr title="Version Issue - Upstream {{ $x->version }}"><i class="fas fa-exclamation text-danger"></i></abbr>
@break
@case('unknown')
<abbr title="Version Issue - Upstream {{ $x->version }}"><i class="fas fa-bolt text-alternate"></i></abbr>
@break
@endswitch
</li>
@endif
{{--
<li class="nav-item">
<a href="javascript:void(0);" class="nav-link">Footer Link</a>

View File

@@ -13,53 +13,53 @@
</div>
</div>
@if (isset($page_actions) || old())
<div class="page-title-actions">
<div class="page-title-actions">
<div class="d-inline-block dropdown">
<button type="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false" class="dropdown-toggle btn btn-primary">
<span class="btn-icon-wrapper pe-2 opacity-7">
<i class="fa fa-business-time fa-w-20"></i>
</span>
@lang('Entry Options')
</button>
<div tabindex="-1" role="menu" aria-hidden="true" class="dropdown-menu dropdown-menu-right">
<ul class="nav flex-column">
@if ((isset($page_actions) && $page_actions->contains('edit')) || old())
<li class="nav-item">
<span class="nav-link pt-0 pb-1">
<button id="entry-edit" class="p-2 m-0 border-0 btn btn-transition btn-outline-dark w-100 text-start">
<i class="fas fa-fw fa-edit me-2"></i> @lang('Edit')
</button>
</span>
</li>
@endif
@if (isset($page_actions) && $page_actions->contains('export'))
<li class="nav-item">
<a class="nav-link pt-0 pb-1">
<button type="button" class="p-2 m-0 border-0 btn btn-transition btn-outline-dark w-100 text-start" data-bs-toggle="modal" data-bs-target="#entry_export-modal">
<i class="fas fa-fw fa-file-export me-2"></i> @lang('Export')
</button>
</a>
</li>
@endif
@if (isset($page_actions) && $page_actions->contains('copy'))
<li class="nav-item">
<a class="nav-link pt-0 pb-1">
<button class="p-2 m-0 border-0 btn btn-transition btn-outline-dark w-100 text-start">
<i class="fas fa-fw fa-truck-moving me-2"></i> @lang('Copy or Move')
</button>
</a>
</li>
@endif
</ul>
</div>
<div class="page-title-actions">
<div class="row">
<div class="col">
<div class="action-buttons float-end">
<ul class="nav">
@if(isset($page_actions) && $page_actions->contains('export'))
<li>
<span data-bs-toggle="modal" data-bs-target="#entry_export-modal">
<button class="btn btn-outline-dark p-1 m-1" data-bs-toggle="tooltip" data-bs-placement="bottom" title="@lang('Export')"><i class="fas fa-fw fa-download fs-5"></i></button>
</span>
</li>
@endif
@if(isset($page_actions) && $page_actions->contains('copy'))
<li>
<button class="btn btn-outline-dark p-1 m-1" id="entry-copy-move" data-bs-toggle="tooltip" data-bs-placement="bottom" title="@lang('Copy/Move')"><i class="fas fa-fw fa-copy fs-5"></i></button>
</li>
@endif
@if((isset($page_actions) && $page_actions->contains('edit')) || old())
<li>
<button class="btn btn-outline-dark p-1 m-1" id="entry-edit" data-bs-toggle="tooltip" data-bs-placement="bottom" title="@lang('Edit Entry')"><i class="fas fa-fw fa-edit fs-5"></i></button>
</li>
@endif
@if(isset($page_actions) && $page_actions->contains('delete'))
<li>
<button class="btn btn-outline-danger p-1 m-1" id="entry-delete" data-bs-custom-class="custom-tooltip-danger" data-bs-toggle="tooltip" data-bs-placement="bottom" title="@lang('Delete Entry')"><i class="fas fa-fw fa-trash-can fs-5"></i></button>
</li>
@endif
</ul>
</div>
</div>
</div>
@endif
</div>
</div>
</div>
</div>
@section('page-scripts')
<script type="text/javascript">
$(document).ready(function() {
console.log($('button[id=entry-edit]'));
$('button[id=entry-edit]').on('click',function(item) {
item.preventDefault();
if ($(this).hasClass('btn-dark'))
return;
editmode();
});
});
</script>
@append

View File

@@ -33,23 +33,6 @@
<div class="app-sidebar__inner">
<ul class="vertical-nav-menu">
<li class="app-sidebar__heading">{{ config('server')->name }}</li>
<li>
<div class="font-icon-wrapper float-start me-1 server-icon">
<a class="p-0 m-0" href="{{ url('info') }}" onclick="return false;" style="display: contents;"><i class="fas fa-fw fa-info"></i></a>
</div>
<div class="font-icon-wrapper float-start ms-1 me-1 server-icon">
<a class="p-0 m-0" href="{{ url('schema') }}" onclick="return false;" style="display: contents;"><i class="fas fa-fw fa-fingerprint"></i></a>
</div>
<div class="font-icon-wrapper float-start ms-1 me-1 server-icon">
<a class="p-0 m-0" href="{{ url('import') }}" onclick="return false;" style="display: contents;"><i class="fas fa-fw fa-upload"></i></a>
</div>
@env(['local'])
<div class="font-icon-wrapper float-end ms-1 server-icon">
<a class="p-0 m-0" href="{{ url('debug') }}" onclick="return false;" style="display: contents;"><i class="fas fa-fw fa-toolbox"></i></a>
</div>
@endenv
<div class="clearfix"></div>
</li>
<li>
<i id="treeicon" class="metismenu-icon fa-fw fas fa-sitemap"></i>
<span class="f16" id="tree"></span>
@@ -57,39 +40,4 @@
</ul>
</div>
</div>
</div>
@section('page-scripts')
<script type="text/javascript">
$(document).ready(function() {
$('.server-icon > a').on('click',function(item) {
var content;
$.ajax({
url: $(this).attr('href'),
method: 'GET',
dataType: 'html',
statusCode: {
404: function() {
$('.main-content').empty().append(content);
}
},
beforeSend: function() {
content = $('.main-content').contents();
$('.main-content').empty().append('<div class="fa-3x"><i class="fas fa-spinner fa-pulse"></i></div>');
}
}).done(function(html) {
$('.main-content').empty().append(html);
}).fail(function() {
alert('Well that didnt work?');
});
item.stopPropagation();
return false;
});
});
</script>
@append
</div>

View File

@@ -39,21 +39,67 @@
<button class="btn-close"></button>
</div>
<ul class="header-menu nav">
{{--
<li class="nav-item">
<a href="javascript:void(0);" class="nav-link">
<i class="nav-link-icon fas fa-database"></i> Link
</a>
<ul class="header-menu nav server-icon">
<li>
<button id="link-info" class="btn btn-light p-1 m-1" data-bs-toggle="tooltip" data-bs-placement="bottom" title="@lang('Server Info')" data-link="{{ url('info') }}">
<i class="fas fa-fw fa-info fs-5"></i>
</button>
</li>
<li>
<button id="link-schema" class="btn btn-light p-1 m-1" data-bs-toggle="tooltip" data-bs-placement="bottom" title="@lang('Schema Viewer')" data-link="{{ url('schema') }}">
<i class="fas fa-fw fa-fingerprint fs-5"></i>
</button>
</li>
<li>
<button id="link-import" class="btn btn-light p-1 m-1" data-bs-toggle="tooltip" data-bs-placement="bottom" title="@lang('Import')" data-link="{{ url('import') }}">
<i class="fas fa-fw fa-upload fs-5"></i>
</button>
</li>
<li>
<button id="link-debug" class="btn btn-light p-1 m-1" data-bs-toggle="tooltip" data-bs-placement="bottom" title="@lang('Debug')" data-link="{{ url('debug') }}">
<i class="fas fa-fw fa-toolbox fs-5"></i>
</button>
</li>
--}}
</ul>
</div>
<div class="app-header-right">
@if(! request()->isSecure())
<span class="badge bg-danger">WARNING - SESSION NOT SECURE</span>
@endif
<ul class="header-menu nav">
@if(! request()->isSecure())
<li>
<button class="btn btn-danger p-1 m-1" data-bs-custom-class="custom-tooltip-danger" data-bs-toggle="tooltip" data-bs-placement="bottom" title="WARNING - SESSION NOT SECURE">
<i class="fas fa-fw fa-unlock-keyhole fs-5"></i>
</button>
</li>
@endif
@if(($x=Config::get('update_available')) && $x->action !== 'current')
<li>
@switch($x->action)
@case('unable')
<button class="btn btn-light opacity-2 p-1 m-1" data-bs-toggle="tooltip" data-bs-placement="bottom" title="Upstream Version Unavailable">
<i class="fas fa-fw fa-bolt fs-5"></i>
</button>
@break
@case('upgrade')
<button class="btn btn-warning p-1 m-1" data-bs-custom-class="custom-tooltip-warning" data-bs-toggle="tooltip" data-bs-placement="bottom" data-bs-html="true" title="Update Available:<br>{{ $x->version }}">
<i class="fas fa-fw fa-wrench fs-5"></i>
</button>
@break
@case('mismatch')
<button class="btn btn-light opacity-2 p-1 m-1" data-bs-toggle="tooltip" data-bs-placement="bottom" data-bs-html="true" title="Version Issue - Upstream<br>{{ $x->version }}">
<i class="fas fa-fw fa-exclamation fs-5"></i>
</button>
@break
@case('unknown')
<button class="btn btn-light opacity-2 p-1 m-1" data-bs-toggle="tooltip" data-bs-placement="bottom" data-bs-html="true" title="Version Issue - Unknown<br>{{ $x->version }}">
<i class="fas fa-fw fa-question fs-5"></i>
</button>
@break
@endswitch
</li>
@endif
</ul>
<div class="header-btn-lg pe-0">
<div class="widget-content p-0">
@@ -112,3 +158,38 @@
</div>
</div>
</div>
@section('page-scripts')
<script type="text/javascript">
$(document).ready(function() {
$('button[id^="link-"]').on('click',function(item) {
var content;
$.ajax({
url: $(this).data('link'),
method: 'GET',
dataType: 'html',
statusCode: {
404: function() {
$('.main-content').empty().append(content);
}
},
beforeSend: function() {
content = $('.main-content').contents();
$('.main-content').empty().append('<div class="fa-3x"><i class="fas fa-spinner fa-pulse"></i></div>');
}
}).done(function(html) {
$('.main-content').empty().append(html);
}).fail(function() {
alert('Well that didnt work?');
});
item.stopPropagation();
return false;
});
});
</script>
@append