moved the script and the style in diffrent files

This commit is contained in:
lorenz 2023-04-06 13:22:19 +02:00
parent 2d23c98fe4
commit 152870f8fd

View File

@ -6,49 +6,17 @@
<meta name="viewport" content="width=device-width, initial-scale=1" /> <meta name="viewport" content="width=device-width, initial-scale=1" />
<title>Device Manager</title> <title>Device Manager</title>
{{-- Bulma CSS Framework --}} {{-- Bulma CSS Framework --}}
<link rel="stylesheet" href="{{ asset('css/bulma.min.css') }}" /> <link href="{{ asset('css/bulma.min.css') }}" type="text/css" rel="stylesheet" />
{{-- Some custom settings for the Bulma CSS Framework --}}
<link href="{{ asset('css/style.css') }}" type="text/css" rel="stylesheet" />
{{-- Javascript to make the Burger-Menu from Bulma-CSS possible --}}
<script src="{{ asset('js/script.js') }}" type="text/javascript"></script>
{{-- Font Awesome Solid + Regular WebFont --}} {{-- Font Awesome Solid + Regular WebFont --}}
<link href="{{ asset('css/fontawesome.min.css') }}" rel="stylesheet"> <link href="{{ asset('css/fontawesome.min.css') }}" type="text/css" rel="stylesheet">
<link href="{{ asset('css/regular.min.css') }}" rel="stylesheet"> <link href="{{ asset('css/regular.min.css') }}" type="text/css" rel="stylesheet">
<link href="{{ asset('css/solid.min.css') }}" rel="stylesheet"> <link href="{{ asset('css/solid.min.css') }}" type="text/css" rel="stylesheet">
</head> </head>
<style>
/*for sticky footer*/
body {
display: flex;
min-height: 100vh;
flex-direction: column;
}
#wrapper {
flex: 1;
}
</style>
<script>
document.addEventListener('DOMContentLoaded', () => {
// Get all "navbar-burger" elements
const $navbarBurgers = Array.prototype.slice.call(document.querySelectorAll('.navbar-burger'), 0);
// Add a click event on each of them
$navbarBurgers.forEach(el => {
el.addEventListener('click', () => {
// Get the target from the "data-target" attribute
const target = el.dataset.target;
const $target = document.getElementById(target);
// Toggle the "is-active" class on both the "navbar-burger" and the "navbar-menu"
el.classList.toggle('is-active');
$target.classList.toggle('is-active');
});
});
});
</script>
<body> <body>
<nav class="navbar is-dark" role="navigation" aria-label="main navigation"> <nav class="navbar is-dark" role="navigation" aria-label="main navigation">
<div class="navbar-brand"> <div class="navbar-brand">