Redo app form page
This commit is contained in:
parent
2b2d51cb6f
commit
88153b0e32
6 changed files with 101 additions and 24 deletions
28
public/css/app.css
vendored
28
public/css/app.css
vendored
|
@ -799,6 +799,26 @@ body {
|
|||
align-items: center;
|
||||
}
|
||||
|
||||
.module-actions .input {
|
||||
display: -webkit-box;
|
||||
display: -ms-flexbox;
|
||||
display: flex;
|
||||
-webkit-box-orient: vertical;
|
||||
-webkit-box-direction: reverse;
|
||||
-ms-flex-direction: column-reverse;
|
||||
flex-direction: column-reverse;
|
||||
line-height: 1;
|
||||
font-size: 9px;
|
||||
font-weight: 400;
|
||||
text-transform: uppercase;
|
||||
color: #ababab;
|
||||
padding: 0 10px;
|
||||
}
|
||||
|
||||
.module-actions .input label {
|
||||
margin-top: 3px;
|
||||
}
|
||||
|
||||
.module-actions .button {
|
||||
font-size: 18px;
|
||||
color: #515564;
|
||||
|
@ -1142,15 +1162,15 @@ a.settinglink {
|
|||
}
|
||||
|
||||
#appimage img {
|
||||
max-width: 150px;
|
||||
max-width: 95px;
|
||||
}
|
||||
|
||||
#sapconfig {
|
||||
#sapconfig, .newblock {
|
||||
display: none;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
#sapconfig h2 {
|
||||
#sapconfig h2, .newblock h2 {
|
||||
background: #f2f3f6;
|
||||
padding: 18px 25px;
|
||||
margin-left: -15px;
|
||||
|
@ -1163,7 +1183,7 @@ a.settinglink {
|
|||
font-weight: 500;
|
||||
}
|
||||
|
||||
#sapconfig .items {
|
||||
#sapconfig .items, .newblock .items {
|
||||
display: -webkit-box;
|
||||
display: -ms-flexbox;
|
||||
display: flex;
|
||||
|
|
2
public/mix-manifest.json
generated
2
public/mix-manifest.json
generated
|
@ -1,4 +1,4 @@
|
|||
{
|
||||
"/css/app.css": "/css/app.css?id=24e9bb4fa993b66f0572",
|
||||
"/css/app.css": "/css/app.css?id=d60b65455c61760b1750",
|
||||
"/js/app.js": "/js/app.js?id=f18d23b8fc7a094a2c66"
|
||||
}
|
||||
|
|
|
@ -450,7 +450,21 @@ body {
|
|||
.module-actions {
|
||||
display: flex;
|
||||
justify-content:space-between;
|
||||
align-items: center;
|
||||
align-items: center;
|
||||
|
||||
.input {
|
||||
display: flex;
|
||||
flex-direction: column-reverse;
|
||||
line-height: 1;
|
||||
font-size: 9px;
|
||||
font-weight: 400;
|
||||
text-transform: uppercase;
|
||||
color: #ababab;
|
||||
padding: 0 10px;
|
||||
label {
|
||||
margin-top: 3px;
|
||||
}
|
||||
}
|
||||
|
||||
.button {
|
||||
font-size: 18px;
|
||||
|
@ -755,11 +769,11 @@ div.create {
|
|||
|
||||
#appimage {
|
||||
img {
|
||||
max-width: 150px;
|
||||
max-width: 95px;
|
||||
}
|
||||
}
|
||||
|
||||
#sapconfig {
|
||||
#sapconfig, .newblock {
|
||||
display: none;
|
||||
width: 100%;
|
||||
h2 {
|
||||
|
|
|
@ -73,6 +73,7 @@ return [
|
|||
'apps.tag_name' => 'Tag name',
|
||||
'apps.tags' => 'Tags',
|
||||
'apps.override' => 'If different to main url',
|
||||
'apps.preview' => 'Preview',
|
||||
|
||||
'user.user_list' => 'Users',
|
||||
'user.add_user' => 'Add user',
|
||||
|
|
|
@ -2,20 +2,7 @@
|
|||
<header>
|
||||
<div class="section-title">{{ __('app.apps.add_application') }}</div>
|
||||
<div class="module-actions">
|
||||
<button type="submit"class="button"><i class="fa fa-save"></i><span>{{ __('app.buttons.save') }}</span></button>
|
||||
<a href="{{ route('items.index', [], false) }}" class="button"><i class="fa fa-ban"></i><span>{{ __('app.buttons.cancel') }}</span></a>
|
||||
</div>
|
||||
</header>
|
||||
<div id="create" class="create">
|
||||
{!! csrf_field() !!}
|
||||
{!! Form::hidden('class', '') !!}
|
||||
<div class="input">
|
||||
<label>{{ __('app.apps.application_name') }} *</label>
|
||||
{!! Form::text('title', null, array('placeholder' => __('app.apps.title'), 'id' => 'appname', 'class' => 'form-control')) !!}
|
||||
<hr />
|
||||
<label>{{ strtoupper(__('app.url')) }}</label>
|
||||
{!! Form::text('url', null, array('placeholder' => __('app.url'), 'id' => 'appurl', 'class' => 'form-control')) !!}
|
||||
<hr />
|
||||
<label>{{ __('app.apps.pinned') }}</label>
|
||||
{!! Form::hidden('pinned', '0') !!}
|
||||
<label class="switch">
|
||||
|
@ -27,20 +14,40 @@
|
|||
<input type="checkbox" name="pinned" value="1"<?php echo $set_checked;?> />
|
||||
<span class="slider round"></span>
|
||||
</label>
|
||||
</div>
|
||||
|
||||
<button type="submit"class="button"><i class="fa fa-save"></i><span>{{ __('app.buttons.save') }}</span></button>
|
||||
<a href="{{ route('items.index', [], false) }}" class="button"><i class="fa fa-ban"></i><span>{{ __('app.buttons.cancel') }}</span></a>
|
||||
</div>
|
||||
</header>
|
||||
<div id="create" class="create">
|
||||
{!! csrf_field() !!}
|
||||
{!! Form::hidden('class', '') !!}
|
||||
<div class="input">
|
||||
<label>{{ __('app.apps.application_name') }} *</label>
|
||||
{!! Form::text('title', null, array('placeholder' => __('app.apps.title'), 'id' => 'appname', 'class' => 'form-control')) !!}
|
||||
</div>
|
||||
<div class="input">
|
||||
<label>{{ __('app.apps.apptype') }} *</label>
|
||||
{!! Form::select('class', App\Application::applist(), null, array('class' => 'form-control')) !!}
|
||||
<hr />
|
||||
</div>
|
||||
|
||||
<div class="input">
|
||||
<label>{{ __('app.apps.colour') }} *</label>
|
||||
{!! Form::text('colour', null, array('placeholder' => __('app.apps.hex'),'class' => 'form-control color-picker')) !!}
|
||||
<hr />
|
||||
</div>
|
||||
|
||||
<div class="input">
|
||||
<label>{{ strtoupper(__('app.url')) }}</label>
|
||||
{!! Form::text('url', null, array('placeholder' => __('app.url'), 'id' => 'appurl', 'class' => 'form-control')) !!}
|
||||
</div>
|
||||
|
||||
<div class="input">
|
||||
<label>{{ __('app.apps.tags') }} ({{ __('app.optional') }})</label>
|
||||
{!! Form::select('tags[]', $tags, $current_tags, ['class' => 'tags', 'multiple']) !!}
|
||||
</div>
|
||||
|
||||
<div class="input">
|
||||
<label>{{ __('app.apps.icon') }}</label>
|
||||
<div class="icon-container">
|
||||
<div id="appimage">
|
||||
@if(isset($item->icon) && !empty($item->icon) || old('icon'))
|
||||
|
@ -60,6 +67,20 @@
|
|||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
|
||||
<div class="newblock" style="display: block;">
|
||||
<h2>Preview</h2>
|
||||
</div>
|
||||
|
||||
|
||||
<div class="input">
|
||||
@include('items.preview')
|
||||
</div>
|
||||
|
||||
|
||||
|
||||
|
||||
@if(isset($item) && $item->enhanced())
|
||||
<div id="sapconfig" style="display: block;">
|
||||
|
|
21
resources/views/items/preview.blade.php
Normal file
21
resources/views/items/preview.blade.php
Normal file
|
@ -0,0 +1,21 @@
|
|||
<?php
|
||||
$item = $item ?? new App\Item;
|
||||
?>
|
||||
<section class="item-container" data-id="">
|
||||
<div class="item" style="background-color: {{ $item->colour ?? '#222' }}">
|
||||
@if(isset($item->icon) && !empty($item->icon))
|
||||
<img class="app-icon" src="{{ asset('/storage/'.$item->icon) }}" />
|
||||
@else
|
||||
<img class="app-icon" src="{{ asset('/img/heimdall-icon-small.png') }}" />
|
||||
@endif
|
||||
<div class="details">
|
||||
<div class="title{{ title_color($item->colour) ?? 'white' }}">{{ $item->title ?? '' }}</div>
|
||||
@if($item->enhanced())
|
||||
<div data-id="{{ $item->id }}" data-dataonly="{{ $item->getconfig()->dataonly ?? '0' }}" class="livestats-container"></div>
|
||||
@endif
|
||||
</div>
|
||||
<a class="link{{ title_color($item->colour) }}"{!! $item->link_target !!} href="{{ $item->link }}"><i class="fas {{ $item->link_icon }}"></i></a>
|
||||
</div>
|
||||
<a class="item-edit" href="{{ route($item->link_type.'.edit', [ $item->id ], false) }}"><i class="fas fa-pencil"></i></a>
|
||||
|
||||
</section>
|
Loading…
Reference in a new issue