port to Bootstrap4 for flexbox

This commit is contained in:
Tony Murray
2020-06-07 10:36:45 -05:00
parent 70ebf419b2
commit a3a8a6ae67
12 changed files with 84 additions and 66 deletions

View File

@@ -61,17 +61,16 @@ class MakeUserController extends \App\Http\Controllers\Controller
'password' => 'required', 'password' => 'required',
]); ]);
try { try {
$this->setDB();
$user = new User($request->only(['username', 'password', 'email'])); $user = new User($request->only(['username', 'password', 'email']));
$user->setPassword($request->get('password')); $user->setPassword($request->get('password'));
$user->setConnection($this->connection);
$res = $user->save(); $res = $user->save();
$message = $res ? trans('install.user.success') : trans('install.user.failure'); $message = $res ? trans('install.user.success') : trans('install.user.failure');
} catch (\Exception $e) { } catch (\Exception $e) {
$message = $e->getMessage(); $message = $e->getMessage();
} }
// return redirect()->back()->with('message', $message); return redirect()->back()->with('message', $message);
} }
} }

7
html/css/bootstrap4.min.css vendored Normal file
View File

File diff suppressed because one or more lines are too long

View File

File diff suppressed because one or more lines are too long

7
html/js/bootstrap4.min.js vendored Normal file
View File

File diff suppressed because one or more lines are too long

View File

File diff suppressed because one or more lines are too long

View File

@@ -39,6 +39,8 @@ return [
'email' => 'Email', 'email' => 'Email',
'button' => 'Add User', 'button' => 'Add User',
'created' => 'User Created', 'created' => 'User Created',
'success' => 'Successfully created user',
'failure' => 'Failed to create user'
], ],
'finish' => [ 'finish' => [
'title' => 'Finish Install' 'title' => 'Finish Install'

View File

@@ -4,14 +4,14 @@
@section('content') @section('content')
<div class="row"> <div class="row">
<div class=" col-xs-8 col-xs-offset-2"> <div class=" col-8 offset-2">
<div class="checks panel panel-default"> <div class="checks card ">
<div class="panel-heading"> <div class="card-header">
<div class="row"> <div class="row">
<div class="col-xs-8"> <div class="col-8">
PHP <small>(@lang('install.checks.php_required', ['version' => $php_required]))</small> PHP <small>(@lang('install.checks.php_required', ['version' => $php_required]))</small>
</div> </div>
<div class="check-status col-xs-4 text-right @if($php_ok) green @else red @endif"> <div class="check-status col-4 text-right text-nowrap @if($php_ok) green @else red @endif">
{{ $php_version }} {{ $php_version }}
@if($php_ok) @if($php_ok)
<i class="fa fa-lg fa-check-square-o green"></i> <i class="fa fa-lg fa-check-square-o green"></i>
@@ -22,13 +22,13 @@
</div> </div>
</div> </div>
</div> </div>
<div class="panel-body"> <div class="card-body">
@foreach($modules as $module) @foreach($modules as $module)
<div class="check-row row"> <div class="check-row row">
<div class="col-xs-8"> <div class="col-8">
{{ $module['name'] }} {{ $module['name'] }}
</div> </div>
<div class="check-status col-xs-4 text-right"> <div class="check-status col-4 text-right">
@if($module['status']) @if($module['status'])
<i class="fa fa-lg fa-check-square-o green"></i> <i class="fa fa-lg fa-check-square-o green"></i>
@else @else
@@ -48,13 +48,18 @@
.check-status .fa { .check-status .fa {
vertical-align: middle; vertical-align: middle;
} }
.check-status {
padding-right: 5px;
}
.check-row { .check-row {
margin-top: -1px; margin-top: -1px;
padding-top: 11px; padding-top: 11px;
padding-bottom: 10px; padding-bottom: 10px;
border-top: 1px solid #ddd; border-top: 1px solid #ddd;
margin-right: -20px;
margin-left: -20px;
} }
.checks .panel-body { .checks .card-body {
padding-top: 0; padding-top: 0;
padding-bottom: 0; padding-bottom: 0;
} }

View File

@@ -4,47 +4,47 @@
@section('content') @section('content')
<div class="row"> <div class="row">
<div class="col-xs-12"> <div class="col-12">
<form id="database-form" class="form-horizontal" role="form" method="post" action="{{ route('install.acton.test-database') }}"> <form id="database-form" class="form-horizontal" role="form" method="post" action="{{ route('install.acton.test-database') }}">
@csrf @csrf
<div class="form-group"> <div class="form-row pb-3">
<label for="host" class="col-sm-4 control-label">@lang('install.database.host')</label> <label for="host" class="col-4 col-form-label text-right">@lang('install.database.host')</label>
<div class="col-sm-8"> <div class="col-6">
<input type="text" class="form-control" name="host" id="host" value="{{ $host ?? 'localhost' }}" placeholder="@lang('install.database.socket_empty')"> <input type="text" class="form-control" name="host" id="host" value="{{ $host ?? 'localhost' }}" placeholder="@lang('install.database.socket_empty')">
</div> </div>
</div> </div>
<div class="form-group"> <div class="form-row pb-3">
<label for="port" class="col-sm-4 control-label">@lang('install.database.port')</label> <label for="port" class="col-4 col-form-label text-right">@lang('install.database.port')</label>
<div class="col-sm-8"> <div class="col-6">
<input type="text" class="form-control" name="port" id="port" value="{{ $port ?? 3306 }}" placeholder="@lang('install.database.socket_empty')"> <input type="text" class="form-control" name="port" id="port" value="{{ $port ?? 3306 }}" placeholder="@lang('install.database.socket_empty')">
</div> </div>
</div> </div>
<div class="form-group"> <div class="form-row pb-3">
<label for="unix_socket" class="col-sm-4 control-label">@lang('install.database.socket')</label> <label for="unix_socket" class="col-4 col-form-label text-right">@lang('install.database.socket')</label>
<div class="col-sm-8"> <div class="col-6">
<input type="text" class="form-control" name="unix_socket" id="unix_socket" value="{{ $unix_socket ?? '' }}" placeholder="@lang('install.database.ip_empty')"> <input type="text" class="form-control" name="unix_socket" id="unix_socket" value="{{ $unix_socket ?? '' }}" placeholder="@lang('install.database.ip_empty')">
</div> </div>
</div> </div>
<div class="form-group"> <div class="form-row pb-3">
<label for="username" class="col-sm-4 control-label">@lang('install.database.username')</label> <label for="username" class="col-4 col-form-label text-right">@lang('install.database.username')</label>
<div class="col-sm-8"> <div class="col-6">
<input type="text" class="form-control" name="username" id="username" value="{{ $username ?? 'librenms' }}"> <input type="text" class="form-control" name="username" id="username" value="{{ $username ?? 'librenms' }}">
</div> </div>
</div> </div>
<div class="form-group"> <div class="form-row pb-3">
<label for="password" class="col-sm-4 control-label">@lang('install.database.password')</label> <label for="password" class="col-4 col-form-label text-right">@lang('install.database.password')</label>
<div class="col-sm-8"> <div class="col-6">
<input type="password" class="form-control" name="password" id="password" value="{{ $password ?? '' }}"> <input type="password" class="form-control" name="password" id="password" value="{{ $password ?? '' }}">
</div> </div>
</div> </div>
<div class="form-group"> <div class="form-row pb-3">
<label for="database" class="col-sm-4 control-label">@lang('install.database.name')</label> <label for="database" class="col-4 col-form-label text-right">@lang('install.database.name')</label>
<div class="col-sm-8"> <div class="col-6">
<input type="text" class="form-control" name="database" id="database" value="{{ $database ?? 'librenms' }}"> <input type="text" class="form-control" name="database" id="database" value="{{ $database ?? 'librenms' }}">
</div> </div>
</div> </div>
<div class="row"> <div class="row">
<div class="col-sm-4 col-sm-offset-1"> <div class="col-4 offset-1">
<strong>@lang('install.database.status'):</strong> <strong>@lang('install.database.status'):</strong>
<span id="database-status" style="vertical-align: middle"> <span id="database-status" style="vertical-align: middle">
@if($status === null) @if($status === null)
@@ -56,8 +56,8 @@
@endif @endif
</span> </span>
</div> </div>
<div class="col-sm-7"> <div class="col-7">
<button type="submit" class="btn btn-success pull-right">@lang('install.database.test')</button> <button type="submit" class="btn btn-success float-right">@lang('install.database.test')</button>
</div> </div>
</div> </div>
</form> </form>

View File

@@ -2,28 +2,28 @@
@section('content') @section('content')
<div class="row"> <div class="row">
<div class="col-xs-12"> <div class="col-12">
<form class="form-horizontal" role="form" method="post" action="{{ route('install.action.user') }}"> <form class="form-horizontal" role="form" method="post" action="{{ route('install.action.user') }}">
@csrf @csrf
<div class="form-group"> <div class="form-row pb-3">
<label for="username" class="col-sm-4 control-label">@lang('install.user.username')</label> <label for="username" class="col-sm-4 col-form-label text-right">@lang('install.user.username')</label>
<div class="col-sm-6"> <div class="col-sm-6">
<input type="text" class="form-control" name="username" id="username" value="{{ old('username') }}"> <input type="text" class="form-control" name="username" id="username" value="{{ old('username') }}">
</div> </div>
</div> </div>
<div class="form-group"> <div class="form-row pb-3">
<label for="password" class="col-sm-4 control-label">@lang('install.user.password')</label> <label for="password" class="col-sm-4 col-form-label text-right">@lang('install.user.password')</label>
<div class="col-sm-6"> <div class="col-sm-6">
<input type="password" class="form-control" name="password" id="password" value="{{ old('password') }}"> <input type="password" class="form-control" name="password" id="password" value="{{ old('password') }}">
</div> </div>
</div> </div>
<div class="form-group"> <div class="form-row pb-3">
<label for="email" class="col-sm-4 control-label">@lang('install.user.email')</label> <label for="email" class="col-sm-4 col-form-label text-right">@lang('install.user.email')</label>
<div class="col-sm-6"> <div class="col-sm-6">
<input type="email" class="form-control" name="email" id="email" value="{{ old('email') }}"> <input type="email" class="form-control" name="email" id="email" value="{{ old('email') }}">
</div> </div>
</div> </div>
<button type="submit" class="btn btn-success pull-right">@lang('install.user.button')</button> <button type="submit" class="btn btn-success float-right">@lang('install.user.button')</button>
</form> </form>
</div> </div>
</div> </div>

View File

@@ -2,18 +2,18 @@
@section('content') @section('content')
<div class="row"> <div class="row">
<div class="col-xs-12"> <div class="col-12">
<h5 class="text-center">Importing MySQL DB - Do not close this page or interrupt the import</h5> <h5 class="text-center">Importing MySQL DB - Do not close this page or interrupt the import</h5>
<textarea readonly id="db-update" class="form-control" rows="20" placeholder="Please Wait..." style="resize:vertical;"></textarea> <textarea readonly id="db-update" class="form-control" rows="20" placeholder="Please Wait..." style="resize:vertical;"></textarea>
</div> </div>
</div> </div>
<div class="row"> <div class="row">
<div class="col-xs-12"> <div class="col-12">
If you don't see any errors or messages above then the database setup has been successful.<br /> If you don't see any errors or messages above then the database setup has been successful.<br />
<form class="form-horizontal" role="form" method="post"> <form class="form-horizontal" role="form" method="post">
@csrf @csrf
<input type="button" id="retry-btn" value="Retry" onClick="window.location.reload()" style="display: none;" class="btn btn-success"> <input type="button" id="retry-btn" value="Retry" onClick="window.location.reload()" style="display: none;" class="btn btn-success">
<button type="submit" id="add-user-btn" class="btn btn-success pull-right" disabled>Goto Add User</button> <button type="submit" id="add-user-btn" class="btn btn-success float-right" disabled>Goto Add User</button>
</form> </form>
</div> </div>
</div> </div>

View File

@@ -2,7 +2,7 @@
@section('content') @section('content')
<div class="row"> <div class="row">
<div class="col-xs-12 text-center" style="padding: 60px"> <div class="col-12 text-center" style="padding: 60px">
<h4> <h4>
@lang('install.user.created'): @lang('install.user.created'):
<i class="fa fa-2x fa-user-circle" style="vertical-align: middle"></i> <i class="fa fa-2x fa-user-circle" style="vertical-align: middle"></i>

View File

@@ -5,14 +5,14 @@
<meta charset="utf-8"> <meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta name="viewport" content="width=device-width, initial-scale=1.0">
<link href="{{ asset('css/bootstrap.min.css') }}" rel="stylesheet" type="text/css"/> <link href="{{ asset('css/bootstrap4.min.css') }}" rel="stylesheet" type="text/css"/>
<link href="{{ asset(\LibreNMS\Config::get('stylesheet')) }}" rel="stylesheet" type="text/css"/> <link href="{{ asset(\LibreNMS\Config::get('stylesheet')) }}" rel="stylesheet" type="text/css"/>
<link href="{{ asset('css/font-awesome.min.css') }}" rel="stylesheet" type="text/css"/> <link href="{{ asset('css/font-awesome.min.css') }}" rel="stylesheet" type="text/css"/>
<script src="{{ asset('js/jquery.min.js') }}"></script> <script src="{{ asset('js/jquery.min.js') }}"></script>
<script src="{{ asset('js/bootstrap.min.js') }}"></script> <script src="{{ asset('js/bootstrap4.min.js') }}"></script>
<style type="text/css"> <style type="text/css">
.primary-panel { .primary-panel {
box-shadow: 0 0 20px black; box-shadow: 0 0 25px #333;
} }
body { body {
@@ -39,18 +39,14 @@
</head> </head>
<body> <body>
<div class="container"> <div class="container">
<div class="panel panel-default col-lg-8 col-lg-offset-2 col-md-10 col-md-offset-1 col-xs-12 primary-panel"> <div class="card col-lg-8 offset-lg-2 col-md-10 offset-md-1 col-12 primary-panel">
<div class="panel-body"> <div class="card-header text-center">
<div class="row"> <img class="card-img-top" src="{{ asset(\LibreNMS\Config::get('title_image', "images/librenms_logo_" . \LibreNMS\Config::get('applied_site_style') . ".svg")) }}" alt="LibreNMS">
<div class="col-xs-10 col-xs-offset-1"> <span class="h2">@yield('title')</span>
<h2 class="text-center"> </div>
<img src="{{ asset(\LibreNMS\Config::get('title_image', "images/librenms_logo_" . \LibreNMS\Config::get('applied_site_style') . ".svg")) }}" alt="{{ \LibreNMS\Config::get('project_name', 'LibreNMS') }}"> <div class="card-body">
@yield('title') <div class="d-flex flex-row justify-content-around">
</h2> <div>
</div>
</div>
<div class="row">
<div class="col-xs-2 col-xs-offset-1">
<a href="{{ route('install.checks') }}" <a href="{{ route('install.checks') }}"
id="install-checks-button" id="install-checks-button"
class="btn btn-primary btn-circle" class="btn btn-primary btn-circle"
@@ -58,7 +54,7 @@
<i class="fa fa-lg fa-list-ul fa-flip-horizontal"></i> <i class="fa fa-lg fa-list-ul fa-flip-horizontal"></i>
</a> </a>
</div> </div>
<div class="col-xs-2"> <div>
<a href="{{ route('install.database') }}" <a href="{{ route('install.database') }}"
id="install-database-button" id="install-database-button"
class="btn btn-primary btn-circle @if(!session('install.checks')) disabled @endif" class="btn btn-primary btn-circle @if(!session('install.checks')) disabled @endif"
@@ -66,7 +62,7 @@
<i class="fa fa-lg fa-database"></i> <i class="fa fa-lg fa-database"></i>
</a> </a>
</div> </div>
<div class="col-xs-2"> <div>
<a href="{{ route('install.migrate') }}" <a href="{{ route('install.migrate') }}"
id="install-migrate-button" id="install-migrate-button"
class="btn btn-primary btn-circle @if(!session('install.database')) disabled @endif" class="btn btn-primary btn-circle @if(!session('install.database')) disabled @endif"
@@ -74,7 +70,7 @@
<i class="fa fa-lg fa-repeat"></i> <i class="fa fa-lg fa-repeat"></i>
</a> </a>
</div> </div>
<div class="col-xs-2"> <div>
<a href="{{ route('install.user') }}" <a href="{{ route('install.user') }}"
id="install-user-button" id="install-user-button"
class="btn btn-primary btn-circle @if(!session('install.migrate')) disabled @endif" class="btn btn-primary btn-circle @if(!session('install.migrate')) disabled @endif"
@@ -82,7 +78,7 @@
<i class="fa fa-lg fa-key"></i> <i class="fa fa-lg fa-key"></i>
</a> </a>
</div> </div>
<div class="col-xs-2"> <div>
<a href="{{ route('install.finish') }}" <a href="{{ route('install.finish') }}"
id="install-finish-button" id="install-finish-button"
class="btn btn-primary btn-circle @if(!session('install.user')) disabled @endif" class="btn btn-primary btn-circle @if(!session('install.user')) disabled @endif"
@@ -93,7 +89,7 @@
</div> </div>
<div class="content-divider"></div> <div class="content-divider"></div>
<div class="row"> <div class="row">
<div id="error-box" class="col-xs-12"> <div id="error-box" class="col-12">
@if(!empty($message)) @if(!empty($message))
<div class="alert alert-danger">{{ $message }}</div> <div class="alert alert-danger">{{ $message }}</div>
@endif @endif