Merge pull request #78 from cp6/Development

Changes for the move to NPM Webpack asset loading
This commit is contained in:
corbpie 2022-11-13 21:44:13 +11:00 committed by GitHub
commit 14f1e808eb
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
25 changed files with 10601 additions and 1308 deletions

4
.gitignore vendored
View File

@ -57,3 +57,7 @@ fabric.properties
# .idea/misc.xml # .idea/misc.xml
# *.ipr # *.ipr
storage/clockwork/ storage/clockwork/
public/css/
public/js/
public/fonts/
public/webfonts/

11204
package-lock.json generated

File diff suppressed because it is too large Load Diff

View File

@ -7,26 +7,26 @@
"watch-poll": "mix watch -- --watch-options-poll=1000", "watch-poll": "mix watch -- --watch-options-poll=1000",
"hot": "mix watch --hot", "hot": "mix watch --hot",
"prod": "npm run production", "prod": "npm run production",
"production": "mix --production" "production": "mix --production",
"build": "webpack --config webpack.config.js"
}, },
"devDependencies": { "devDependencies": {
"@popperjs/core": "^2.10.2",
"@tailwindcss/forms": "^0.4.0",
"alpinejs": "^3.4.2",
"autoprefixer": "^10.1.0",
"axios": "^0.21.4", "axios": "^0.21.4",
"bootstrap": "^5.1.3", "bootstrap": "^5.2.2",
"bootstrap-dark-5": "^1.1.3",
"bootstrap-data-table": "^1.0.0",
"datatables": "^1.10.18",
"datatables.net-bs": "^1.13.1",
"font-awesome": "^4.7.0",
"jquery": "^3.6.1",
"laravel-mix": "^6.0.41", "laravel-mix": "^6.0.41",
"lodash": "^4.17.21", "vue": "^2.7.14",
"postcss": "^8.2.1", "vue-loader": "^17.0.1",
"postcss-import": "^14.0.1",
"resolve-url-loader": "^3.1.2",
"sass": "^1.32.11",
"sass-loader": "^11.0.1",
"tailwindcss": "^3.0.0",
"vue": "^2.6.12",
"vue-loader": "^15.9.5",
"vue-resource": "^1.5.3", "vue-resource": "^1.5.3",
"vue-template-compiler": "^2.6.12" "vue-template-compiler": "^2.7.14"
},
"dependencies": {
"@fortawesome/fontawesome-free": "^6.2.0",
"datatables.net-bs5": "^1.13.1"
} }
} }

View File

@ -1,3 +1,3 @@
@import 'tailwindcss/base'; @import '~@fortawesome/fontawesome-free/css/all.min.css';
@import 'tailwindcss/components'; @import "datatables.net-bs5";
@import 'tailwindcss/utilities'; @import "style.css";

1
resources/css/dark.css vendored Normal file
View File

@ -0,0 +1 @@
@import 'bootstrap-dark-5';

1
resources/css/light.css vendored Normal file
View File

@ -0,0 +1 @@
@import 'bootstrap';

28
resources/css/style.css vendored Normal file
View File

@ -0,0 +1,28 @@
/*
Custom styles go in here
*/
.modal-mask {
position: fixed;
z-index: 9998;
top: 0;
left: 0;
width: 100%;
height: 100%;
background-color: rgba(0, 0, 0, .5);
transition: opacity .3s ease;
}
.modal-body {
margin: 10px 0;
}
.modal {
display: contents !important;
}
@media (min-width: 1400px) {
.container-xxl, .container-xl, .container-lg, .container-md, .container-sm, .container {
max-width: 1520px;
}
}

14
resources/js/app.js vendored
View File

@ -1,6 +1,8 @@
require('./bootstrap'); require('bootstrap')
import Alpine from 'alpinejs'; require('datatables')
window.Vue = require('vue/dist/vue');
window.Alpine = Alpine; window.axios = require('axios');
import $ from 'jquery';
Alpine.start(); window.jQuery = $;
window.$ = $;
require('datatables.net-bs5');

View File

@ -1,7 +1,7 @@
<div v-if="showModal"> <div v-if="showModal">
<transition name="modal"> <transition name="modal">
<div class="modal-mask"> <div id="confirmDeleteModal" class="modal-mask d-none">
<div class="modal-wrapper"> <div class="modal">
<div class="modal-dialog"> <div class="modal-dialog">
<div class="modal-content"> <div class="modal-content">
<div class="modal-header py-1"> <div class="modal-header py-1">

View File

@ -1,4 +1,6 @@
<script> <script>
window.addEventListener('load', function() {
document.getElementById("confirmDeleteModal").classList.remove("d-none");
let app = new Vue({ let app = new Vue({
el: "#app", el: "#app",
data: { data: {
@ -16,4 +18,5 @@
} }
} }
}); });
})
</script> </script>

View File

@ -1,12 +1,8 @@
@extends('layouts.index')
@section('title', 'Domain names') @section('title', 'Domain names')
@section('css_style') <x-app-layout>
<x-modal-style></x-modal-style> <x-slot name="header">
@endsection
@section('header')
{{ __('Domains') }} {{ __('Domains') }}
@endsection </x-slot>
@section('content')
<div class="container" id="app"> <div class="container" id="app">
<x-delete-confirm-modal></x-delete-confirm-modal> <x-delete-confirm-modal></x-delete-confirm-modal>
<x-card class="shadow mt-3"> <x-card class="shadow mt-3">
@ -67,4 +63,4 @@
<x-modal-delete-script> <x-modal-delete-script>
<x-slot name="uri">domains</x-slot> <x-slot name="uri">domains</x-slot>
</x-modal-delete-script> </x-modal-delete-script>
@endsection </x-app-layout>

View File

@ -1,19 +1,10 @@
@section("title", "IP addresses") @section('title', 'IP addresses')
@section('css_links')
<link rel="stylesheet" href="{{ asset('css/datatables.bootstrap.min.css') }}">
@endsection
@section('style')
<x-modal-style></x-modal-style>
@endsection
@section('scripts')
<script src="{{ asset('js/vue.min.js') }}"></script>
@endsection
<x-app-layout> <x-app-layout>
<x-slot name="header"> <x-slot name="header">
{{ __('IP Addresses') }} {{ __('IP addresses') }}
</x-slot> </x-slot>
<div class="container" id="app"> <div class="container" id="app">
<x-delete-confirm-modal></x-delete-confirm-modal> <x-response-alerts></x-response-alerts>
<x-card class="shadow mt-3"> <x-card class="shadow mt-3">
<a href="{{ route('IPs.create') }}" class="btn btn-primary mb-3">Add IP</a> <a href="{{ route('IPs.create') }}" class="btn btn-primary mb-3">Add IP</a>
<x-response-alerts></x-response-alerts> <x-response-alerts></x-response-alerts>
@ -56,10 +47,14 @@
</div> </div>
</x-card> </x-card>
<x-details-footer></x-details-footer> <x-details-footer></x-details-footer>
<x-delete-confirm-modal></x-delete-confirm-modal>
</div> </div>
<x-datatables-assets></x-datatables-assets> <x-modal-delete-script>
<script type="text/javascript"> <x-slot name="uri">IPs</x-slot>
$(document).ready(function () { </x-modal-delete-script>
@section('scripts')
<script>
window.addEventListener('load', function () {
$('#ips-table').DataTable({ $('#ips-table').DataTable({
"pageLength": 15, "pageLength": 15,
"lengthMenu": [5, 10, 15, 25, 30, 50, 75, 100], "lengthMenu": [5, 10, 15, 25, 30, 50, 75, 100],
@ -72,9 +67,8 @@
$('.dataTables_info').addClass('mt-2 text-muted '); $('.dataTables_info').addClass('mt-2 text-muted ');
} }
}); });
}); })
</script> </script>
<x-modal-delete-script> @endsection
<x-slot name="uri">IPs</x-slot>
</x-modal-delete-script>
</x-app-layout> </x-app-layout>

View File

@ -1,19 +1,9 @@
@section("title", "Labels") @section('title', 'Labels')
@section('css_links')
<link rel="stylesheet" href="{{ asset('css/datatables.bootstrap.min.css') }}">
@endsection
@section('style')
<x-modal-style></x-modal-style>
@endsection
@section('scripts')
<script src="{{ asset('js/vue.min.js') }}"></script>
@endsection
<x-app-layout> <x-app-layout>
<x-slot name="header"> <x-slot name="header">
{{ __('Labels') }} {{ __('Labels') }}
</x-slot> </x-slot>
<div class="container" id="app"> <div class="container" id="app">
<x-delete-confirm-modal></x-delete-confirm-modal>
<x-card class="shadow mt-3"> <x-card class="shadow mt-3">
<a href="{{ route('labels.create') }}" class="btn btn-primary mb-3">Add a label</a> <a href="{{ route('labels.create') }}" class="btn btn-primary mb-3">Add a label</a>
<x-response-alerts></x-response-alerts> <x-response-alerts></x-response-alerts>
@ -50,10 +40,14 @@
</table> </table>
</x-card> </x-card>
<x-details-footer></x-details-footer> <x-details-footer></x-details-footer>
<x-delete-confirm-modal></x-delete-confirm-modal>
</div> </div>
<x-datatables-assets></x-datatables-assets> <x-modal-delete-script>
<script type="text/javascript"> <x-slot name="uri">labels</x-slot>
$(document).ready(function () { </x-modal-delete-script>
@section('scripts')
<script>
window.addEventListener('load', function () {
$('#labels-table').DataTable({ $('#labels-table').DataTable({
"pageLength": 15, "pageLength": 15,
"lengthMenu": [5, 10, 15, 25, 30, 50, 75, 100], "lengthMenu": [5, 10, 15, 25, 30, 50, 75, 100],
@ -66,9 +60,7 @@
$('.dataTables_info').addClass('mt-2 text-muted '); $('.dataTables_info').addClass('mt-2 text-muted ');
} }
}); });
}); })
</script> </script>
<x-modal-delete-script> @endsection
<x-slot name="uri">labels</x-slot>
</x-modal-delete-script>
</x-app-layout> </x-app-layout>

View File

@ -11,19 +11,16 @@
<title>@yield('title') - @if (config()->has('app.name')) {{ config('app.name') }} @else My idlers @endif</title> <title>@yield('title') - @if (config()->has('app.name')) {{ config('app.name') }} @else My idlers @endif</title>
@if(Session::get('dark_mode')) @if(Session::get('dark_mode'))
<link rel="stylesheet" href="{{ asset('css/bootstrap-dark.min.css') }}"> <link rel="stylesheet" href="{{ asset('css/dark.css') }}">
@else @else
<link rel="stylesheet" href="{{ asset('css/bootstrap.min.css') }}"> <link rel="stylesheet" href="{{ asset('css/light.css') }}">
@endif @endif
<link rel="stylesheet" href="{{ asset('css/fa.min.css') }}"> <link rel="stylesheet" href="{{ asset('css/app.css') }}">
@yield('css_links') @yield('css_links')
@yield('style') @yield('style')
<script src="{{ asset('js/bootstrap.min.js') }}" defer></script>
@yield('scripts')
</head> </head>
<body class="font-sans antialiased"> <body class="font-sans antialiased">
<div class="container-fluid"> <div class="container-fluid">
@ -40,5 +37,7 @@
<div class="container"> <div class="container">
{{ $slot }} {{ $slot }}
</div> </div>
<script src="{{ asset('js/app.js') }}" defer></script>
@yield('scripts')
</body> </body>
</html> </html>

View File

@ -1,19 +1,9 @@
@section("title", "Locations") @section('title', 'Locations')
@section('css_links')
<link rel="stylesheet" href="{{ asset('css/datatables.bootstrap.min.css') }}">
@endsection
@section('style')
<x-modal-style></x-modal-style>
@endsection
@section('scripts')
<script src="{{ asset('js/vue.min.js') }}"></script>
@endsection
<x-app-layout> <x-app-layout>
<x-slot name="header"> <x-slot name="header">
{{ __('Locations') }} {{ __('Locations') }}
</x-slot> </x-slot>
<div class="container" id="app"> <div class="container" id="app">
<x-delete-confirm-modal></x-delete-confirm-modal>
<x-card class="shadow mt-3"> <x-card class="shadow mt-3">
<a href="{{ route('locations.create') }}" class="btn btn-primary mb-3">Add a location</a> <a href="{{ route('locations.create') }}" class="btn btn-primary mb-3">Add a location</a>
<x-response-alerts></x-response-alerts> <x-response-alerts></x-response-alerts>
@ -49,10 +39,14 @@
</table> </table>
</x-card> </x-card>
<x-details-footer></x-details-footer> <x-details-footer></x-details-footer>
<x-delete-confirm-modal></x-delete-confirm-modal>
</div> </div>
<x-datatables-assets></x-datatables-assets> <x-modal-delete-script>
<script type="text/javascript"> <x-slot name="uri">locations</x-slot>
$(document).ready(function () { </x-modal-delete-script>
@section('scripts')
<script>
window.addEventListener('load', function () {
$('#locations-table').DataTable({ $('#locations-table').DataTable({
"pageLength": 15, "pageLength": 15,
"lengthMenu": [5, 10, 15, 25, 30, 50, 75, 100], "lengthMenu": [5, 10, 15, 25, 30, 50, 75, 100],
@ -65,9 +59,7 @@
$('.dataTables_info').addClass('mt-2 text-muted '); $('.dataTables_info').addClass('mt-2 text-muted ');
} }
}); });
}); })
</script> </script>
<x-modal-delete-script> @endsection
<x-slot name="uri">locations</x-slot>
</x-modal-delete-script>
</x-app-layout> </x-app-layout>

View File

@ -1,12 +1,8 @@
@extends('layouts.index')
@section('title', 'Misc services') @section('title', 'Misc services')
@section('css_style') <x-app-layout>
<x-modal-style></x-modal-style> <x-slot name="header">
@endsection
@section('header')
{{ __('Misc') }} {{ __('Misc') }}
@endsection </x-slot>
@section('content')
<div class="container" id="app"> <div class="container" id="app">
<x-delete-confirm-modal></x-delete-confirm-modal> <x-delete-confirm-modal></x-delete-confirm-modal>
<x-card class="shadow mt-3"> <x-card class="shadow mt-3">
@ -68,4 +64,4 @@
<x-modal-delete-script> <x-modal-delete-script>
<x-slot name="uri">misc</x-slot> <x-slot name="uri">misc</x-slot>
</x-modal-delete-script> </x-modal-delete-script>
@endsection </x-app-layout>

View File

@ -1,19 +1,9 @@
@section("title", "Operating systems") @section('title', 'Operating systems')
@section('css_links')
<link rel="stylesheet" href="{{ asset('css/datatables.bootstrap.min.css') }}">
@endsection
@section('style')
<x-modal-style></x-modal-style>
@endsection
@section('scripts')
<script src="{{ asset('js/vue.min.js') }}"></script>
@endsection
<x-app-layout> <x-app-layout>
<x-slot name="header"> <x-slot name="header">
{{ __('Operating systems') }} {{ __('Operating systems') }}
</x-slot> </x-slot>
<div class="container" id="app"> <div class="container" id="app">
<x-delete-confirm-modal></x-delete-confirm-modal>
<x-card class="shadow mt-3"> <x-card class="shadow mt-3">
<a href="{{ route('os.create') }}" class="btn btn-primary mb-3">Add an OS</a> <a href="{{ route('os.create') }}" class="btn btn-primary mb-3">Add an OS</a>
<x-response-alerts></x-response-alerts> <x-response-alerts></x-response-alerts>
@ -46,10 +36,14 @@
</table> </table>
</x-card> </x-card>
<x-details-footer></x-details-footer> <x-details-footer></x-details-footer>
<x-delete-confirm-modal></x-delete-confirm-modal>
</div> </div>
<x-datatables-assets></x-datatables-assets> <x-modal-delete-script>
<script type="text/javascript"> <x-slot name="uri">os</x-slot>
$(document).ready(function () { </x-modal-delete-script>
@section('scripts')
<script>
window.addEventListener('load', function () {
$('#os-table').DataTable({ $('#os-table').DataTable({
"pageLength": 15, "pageLength": 15,
"lengthMenu": [5, 10, 15, 25, 30, 50, 75, 100], "lengthMenu": [5, 10, 15, 25, 30, 50, 75, 100],
@ -62,9 +56,7 @@
$('.dataTables_info').addClass('mt-2 text-muted '); $('.dataTables_info').addClass('mt-2 text-muted ');
} }
}); });
}); })
</script> </script>
<x-modal-delete-script> @endsection
<x-slot name="uri">os</x-slot>
</x-modal-delete-script>
</x-app-layout> </x-app-layout>

View File

@ -1,19 +1,9 @@
@section("title", "Providers") @section("title", "Providers")
@section('css_links')
<link rel="stylesheet" href="{{ asset('css/datatables.bootstrap.min.css') }}">
@endsection
@section('style')
<x-modal-style></x-modal-style>
@endsection
@section('scripts')
<script src="{{ asset('js/vue.min.js') }}"></script>
@endsection
<x-app-layout> <x-app-layout>
<x-slot name="header"> <x-slot name="header">
{{ __('Providers') }} {{ __('Providers') }}
</x-slot> </x-slot>
<div class="container" id="app"> <div class="container" id="app">
<x-delete-confirm-modal></x-delete-confirm-modal>
<x-card class="shadow mt-3"> <x-card class="shadow mt-3">
<a href="{{ route('providers.create') }}" class="btn btn-primary mb-3">Add a provider</a> <a href="{{ route('providers.create') }}" class="btn btn-primary mb-3">Add a provider</a>
<x-response-alerts></x-response-alerts> <x-response-alerts></x-response-alerts>
@ -49,9 +39,10 @@
</table> </table>
</x-card> </x-card>
<x-details-footer></x-details-footer> <x-details-footer></x-details-footer>
<x-delete-confirm-modal></x-delete-confirm-modal>
</div> </div>
<x-datatables-assets></x-datatables-assets>
<script type="text/javascript"> <script type="text/javascript">
window.addEventListener('load', function () {
$(document).ready(function () { $(document).ready(function () {
$('#providers-table').DataTable({ $('#providers-table').DataTable({
"pageLength": 15, "pageLength": 15,
@ -66,6 +57,7 @@
} }
}); });
}); });
})
</script> </script>
<x-modal-delete-script> <x-modal-delete-script>
<x-slot name="uri">providers</x-slot> <x-slot name="uri">providers</x-slot>

View File

@ -1,14 +1,9 @@
@extends('layouts.index')
@section('title', 'Resellers') @section('title', 'Resellers')
@section('css_style') <x-app-layout>
<x-modal-style></x-modal-style> <x-slot name="header">
@endsection
@section('header')
{{ __('Reseller') }} {{ __('Reseller') }}
@endsection </x-slot>
@section('content')
<div class="container" id="app"> <div class="container" id="app">
<x-delete-confirm-modal></x-delete-confirm-modal>
<div class="card shadow mt-3"> <div class="card shadow mt-3">
<div class="card-body"> <div class="card-body">
<a href="{{ route('reseller.create') }}" class="btn btn-primary mb-3">Add a reseller</a> <a href="{{ route('reseller.create') }}" class="btn btn-primary mb-3">Add a reseller</a>
@ -68,8 +63,9 @@
</div> </div>
</div> </div>
<x-details-footer></x-details-footer> <x-details-footer></x-details-footer>
<x-delete-confirm-modal></x-delete-confirm-modal>
</div> </div>
<x-modal-delete-script> <x-modal-delete-script>
<x-slot name="uri">reseller</x-slot> <x-slot name="uri">reseller</x-slot>
</x-modal-delete-script> </x-modal-delete-script>
@endsection </x-app-layout>

View File

@ -1,14 +1,9 @@
@extends('layouts.index')
@section('title', 'Seed boxes') @section('title', 'Seed boxes')
@section('css_style') <x-app-layout>
<x-modal-style></x-modal-style> <x-slot name="header">
@endsection
@section('header')
{{ __('Seed boxes') }} {{ __('Seed boxes') }}
@endsection </x-slot>
@section('content')
<div class="container" id="app"> <div class="container" id="app">
<x-delete-confirm-modal></x-delete-confirm-modal>
<div class="card shadow mt-3"> <div class="card shadow mt-3">
<div class="card-body"> <div class="card-body">
<a href="{{ route('seedboxes.create') }}" class="btn btn-primary mb-3">Add a seed box</a> <a href="{{ route('seedboxes.create') }}" class="btn btn-primary mb-3">Add a seed box</a>
@ -90,8 +85,9 @@
</div> </div>
</div> </div>
<x-details-footer></x-details-footer> <x-details-footer></x-details-footer>
<x-delete-confirm-modal></x-delete-confirm-modal>
</div> </div>
<x-modal-delete-script> <x-modal-delete-script>
<x-slot name="uri">seedboxes</x-slot> <x-slot name="uri">seedboxes</x-slot>
</x-modal-delete-script> </x-modal-delete-script>
@endsection </x-app-layout>

View File

@ -1,8 +1,4 @@
@section("title", "Add a server") @section("title", "Add a server")
@section('scripts')
<script src="{{ asset('js/vue.min.js') }}"></script>
<script src="{{ asset('js/axios.min.js') }}"></script>
@endsection
<x-app-layout> <x-app-layout>
<x-slot name="header"> <x-slot name="header">
{{ __('Insert a new server') }} {{ __('Insert a new server') }}
@ -224,7 +220,8 @@
</x-labels-select> </x-labels-select>
</div> </div>
</div> </div>
<x-form-check text="Allow this data to be public, restrict values in settings" name="show_public"></x-form-check> <x-form-check text="Allow this data to be public, restrict values in settings"
name="show_public"></x-form-check>
<div class="row"> <div class="row">
<div class="col-12 col-lg-4"> <div class="col-12 col-lg-4">
<x-submit-button>Insert server</x-submit-button> <x-submit-button>Insert server</x-submit-button>
@ -233,8 +230,10 @@
</form> </form>
</x-card> </x-card>
</div> </div>
@section('scripts')
<script> <script>
window.addEventListener('load', function () {
axios.defaults.headers.common = { axios.defaults.headers.common = {
'Content-Type': 'application/json', 'Content-Type': 'application/json',
'X-Requested-With': 'XMLHttpRequest', 'X-Requested-With': 'XMLHttpRequest',
@ -263,5 +262,7 @@
} }
} }
}); });
})
</script> </script>
@endsection
</x-app-layout> </x-app-layout>

View File

@ -1,17 +1,9 @@
@section("title", "Servers") @section('title', 'Servers')
@section('style')
<x-modal-style></x-modal-style>
@endsection
@section('scripts')
<script src="{{ asset('js/vue.min.js') }}"></script>
<script src="{{ asset('js/axios.min.js') }}"></script>
@endsection
<x-app-layout> <x-app-layout>
<x-slot name="header"> <x-slot name="header">
{{ __('Servers') }} {{ __('Servers') }}
</x-slot> </x-slot>
<div class="container" id="app"> <div class="container" id="app">
<x-delete-confirm-modal></x-delete-confirm-modal>
<x-response-alerts></x-response-alerts> <x-response-alerts></x-response-alerts>
<ul class="nav nav-tabs mt-3" id="myTab" role="tablist"> <ul class="nav nav-tabs mt-3" id="myTab" role="tablist">
<li class="nav-item" role="presentation"> <li class="nav-item" role="presentation">
@ -94,7 +86,7 @@
<i class="fas fa-plug mx-1" id="{{$server->hostname}}" <i class="fas fa-plug mx-1" id="{{$server->hostname}}"
title="check if up" title="check if up"
@click="checkUp"> @click="checkIfUp">
</i> </i>
<i class="fas fa-trash text-danger ms-3" @click="confirmDeleteModal" <i class="fas fa-trash text-danger ms-3" @click="confirmDeleteModal"
id="{{$server->id}}" title="{{$server->hostname}}"></i> id="{{$server->id}}" title="{{$server->hostname}}"></i>
@ -175,7 +167,7 @@
<i class="fas fa-plug mx-1" id="{{$server->hostname}}" <i class="fas fa-plug mx-1" id="{{$server->hostname}}"
title="check if up" title="check if up"
@click="checkUp"> @click="checkIfUp">
</i> </i>
<i class="fas fa-trash text-danger ms-3" @click="confirmDeleteModal" <i class="fas fa-trash text-danger ms-3" @click="confirmDeleteModal"
id="{{$server->id}}" title="{{$server->hostname}}"></i> id="{{$server->id}}" title="{{$server->hostname}}"></i>
@ -196,7 +188,12 @@
</div> </div>
<x-details-footer></x-details-footer> <x-details-footer></x-details-footer>
</div> </div>
<x-delete-confirm-modal></x-delete-confirm-modal>
</div>
@section('scripts')
<script> <script>
window.addEventListener('load', function () {
document.getElementById("confirmDeleteModal").classList.remove("d-none");
axios.defaults.headers.common = { axios.defaults.headers.common = {
'Content-Type': 'application/json', 'Content-Type': 'application/json',
'X-Requested-With': 'XMLHttpRequest', 'X-Requested-With': 'XMLHttpRequest',
@ -214,7 +211,7 @@
showModal: false showModal: false
}, },
methods: { methods: {
checkUp(event) { checkIfUp(event) {
var hostname = event.target.id; var hostname = event.target.id;
if (hostname) { if (hostname) {
@ -238,5 +235,7 @@
} }
} }
}); });
})
</script> </script>
@endsection
</x-app-layout> </x-app-layout>

View File

@ -1,14 +1,9 @@
@extends('layouts.index')
@section('title', 'Shared hosting') @section('title', 'Shared hosting')
@section('css_style') <x-app-layout>
<x-modal-style></x-modal-style> <x-slot name="header">
@endsection
@section('header')
{{ __('Shared') }} {{ __('Shared') }}
@endsection </x-slot>
@section('content')
<div class="container" id="app"> <div class="container" id="app">
<x-delete-confirm-modal></x-delete-confirm-modal>
<div class="card shadow mt-3"> <div class="card shadow mt-3">
<div class="card-body"> <div class="card-body">
<a href="{{ route('shared.create') }}" class="btn btn-primary mb-3">Add shared hosting</a> <a href="{{ route('shared.create') }}" class="btn btn-primary mb-3">Add shared hosting</a>
@ -70,8 +65,9 @@
</div> </div>
</div> </div>
<x-details-footer></x-details-footer> <x-details-footer></x-details-footer>
<x-delete-confirm-modal></x-delete-confirm-modal>
</div> </div>
<x-modal-delete-script> <x-modal-delete-script>
<x-slot name="uri">shared</x-slot> <x-slot name="uri">shared</x-slot>
</x-modal-delete-script> </x-modal-delete-script>
@endsection </x-app-layout>

View File

@ -1,10 +1,4 @@
@section("title", "YABS results") @section('title', 'YABS results')
@section('style')
<x-modal-style></x-modal-style>
@endsection
@section('scripts')
<script src="{{ asset('js/vue.min.js') }}"></script>
@endsection
<x-app-layout> <x-app-layout>
<x-slot name="header"> <x-slot name="header">
{{ __('YABS') }} {{ __('YABS') }}

7
webpack.mix.js vendored
View File

@ -12,7 +12,8 @@ const mix = require('laravel-mix');
*/ */
mix.js('resources/js/app.js', 'public/js').postCss('resources/css/app.css', 'public/css', [ mix.js('resources/js/app.js', 'public/js').postCss('resources/css/app.css', 'public/css', [
require('postcss-import'),
require('tailwindcss'),
require('autoprefixer'),
]); ]);
mix.postCss('resources/css/light.css', 'public/css');
mix.postCss('resources/css/dark.css', 'public/css');