update front of the back-office
This commit is contained in:
Alexis Gousseau
parent
4f1cfc6eb2
commit
937219454b
12 changed files with 195 additions and 155 deletions
|
|
@ -25,6 +25,7 @@
|
|||
@import "~bootstrap/scss/helpers";
|
||||
@import "~bootstrap/scss/alert";
|
||||
@import "~bootstrap/scss/buttons";
|
||||
@import "~bootstrap/scss/button-group";
|
||||
@import "~bootstrap/scss/forms";
|
||||
@import "~bootstrap/scss/nav";
|
||||
@import "~bootstrap/scss/navbar";
|
||||
|
|
@ -33,6 +34,10 @@
|
|||
@import "~bootstrap/scss/carousel";
|
||||
@import "~bootstrap/scss/dropdown";
|
||||
@import "~bootstrap/scss/accordion";
|
||||
@import "~bootstrap/scss/tables";
|
||||
@import "~bootstrap/scss/tooltip";
|
||||
@import "~bootstrap/scss/card";
|
||||
@import "~bootstrap/scss/modal";
|
||||
|
||||
// 5. Optionally include utilities API last to generate classes based on the Sass map in `_utilities.scss`.
|
||||
@import "~bootstrap/scss/utilities/api";
|
||||
|
|
|
|||
|
|
@ -1,5 +1,6 @@
|
|||
@import "~cropperjs/dist/cropper.css";
|
||||
@import "bootstrap";
|
||||
@import "bo/base/base";
|
||||
@import "bo/base/common";
|
||||
@import "bo/partials/header";
|
||||
@import "bo/partials/footer";
|
||||
@import "bo/pages/home";
|
||||
|
|
|
|||
|
|
@ -1,94 +0,0 @@
|
|||
// SSSSSSSSSSSSSSS MMMMMMMM MMMMMMMM
|
||||
// SS:::::::::::::::SM:::::::M M:::::::M
|
||||
// S:::::SSSSSS::::::SM::::::::M M::::::::M
|
||||
// S:::::S SSSSSSSM:::::::::M M:::::::::M
|
||||
// S:::::S M::::::::::M M::::::::::M
|
||||
// S:::::S M:::::::::::M M:::::::::::M
|
||||
// S::::SSSS M:::::::M::::M M::::M:::::::M
|
||||
// SS::::::SSSSS M::::::M M::::M M::::M M::::::M
|
||||
// SSS::::::::SS M::::::M M::::M::::M M::::::M
|
||||
// SSSSSS::::S M::::::M M:::::::M M::::::M
|
||||
// S:::::SM::::::M M:::::M M::::::M
|
||||
// S:::::SM::::::M MMMMM M::::::M
|
||||
// SSSSSSS S:::::SM::::::M M::::::M
|
||||
// S::::::SSSSSS:::::SM::::::M M::::::M
|
||||
// S:::::::::::::::SS M::::::M M::::::M
|
||||
// SSSSSSSSSSSSSSS MMMMMMMM MMMMMMMM
|
||||
@include media-breakpoint-up(sm) { // >= 576px
|
||||
}
|
||||
|
||||
// MMMMMMMM MMMMMMMMDDDDDDDDDDDDD
|
||||
// M:::::::M M:::::::MD::::::::::::DDD
|
||||
// M::::::::M M::::::::MD:::::::::::::::DD
|
||||
// M:::::::::M M:::::::::MDDD:::::DDDDD:::::D
|
||||
// M::::::::::M M::::::::::M D:::::D D:::::D
|
||||
// M:::::::::::M M:::::::::::M D:::::D D:::::D
|
||||
// M:::::::M::::M M::::M:::::::M D:::::D D:::::D
|
||||
// M::::::M M::::M M::::M M::::::M D:::::D D:::::D
|
||||
// M::::::M M::::M::::M M::::::M D:::::D D:::::D
|
||||
// M::::::M M:::::::M M::::::M D:::::D D:::::D
|
||||
// M::::::M M:::::M M::::::M D:::::D D:::::D
|
||||
// M::::::M MMMMM M::::::M D:::::D D:::::D
|
||||
// M::::::M M::::::MDDD:::::DDDDD:::::D
|
||||
// M::::::M M::::::MD:::::::::::::::DD
|
||||
// M::::::M M::::::MD::::::::::::DDD
|
||||
// MMMMMMMM MMMMMMMMDDDDDDDDDDDDD
|
||||
@include media-breakpoint-up(md) { // >= 768px
|
||||
}
|
||||
|
||||
// LLLLLLLLLLL GGGGGGGGGGGGG
|
||||
// L:::::::::L GGG::::::::::::G
|
||||
// L:::::::::L GG:::::::::::::::G
|
||||
// LL:::::::LL G:::::GGGGGGGG::::G
|
||||
// L:::::L G:::::G GGGGGG
|
||||
// L:::::L G:::::G
|
||||
// L:::::L G:::::G
|
||||
// L:::::L G:::::G GGGGGGGGGG
|
||||
// L:::::L G:::::G G::::::::G
|
||||
// L:::::L G:::::G GGGGG::::G
|
||||
// L:::::L G:::::G G::::G
|
||||
// L:::::L LLLLLL G:::::G G::::G
|
||||
// LL:::::::LLLLLLLLL:::::L G:::::GGGGGGGG::::G
|
||||
// L::::::::::::::::::::::L GG:::::::::::::::G
|
||||
// L::::::::::::::::::::::L GGG::::::GGG:::G
|
||||
// LLLLLLLLLLLLLLLLLLLLLLLL GGGGGG GGGG
|
||||
@include media-breakpoint-up(lg) { // >= 992px
|
||||
}
|
||||
|
||||
// XXXXXXX XXXXXXXLLLLLLLLLLL
|
||||
// X:::::X X:::::XL:::::::::L
|
||||
// X:::::X X:::::XL:::::::::L
|
||||
// X::::::X X::::::XLL:::::::LL
|
||||
// XXX:::::X X:::::XXX L:::::L
|
||||
// X:::::X X:::::X L:::::L
|
||||
// X:::::X:::::X L:::::L
|
||||
// X:::::::::X L:::::L
|
||||
// X:::::::::X L:::::L
|
||||
// X:::::X:::::X L:::::L
|
||||
// X:::::X X:::::X L:::::L
|
||||
// XXX:::::X X:::::XXX L:::::L LLLLLL
|
||||
// X::::::X X::::::XLL:::::::LLLLLLLLL:::::L
|
||||
// X:::::X X:::::XL::::::::::::::::::::::L
|
||||
// X:::::X X:::::XL::::::::::::::::::::::L
|
||||
// XXXXXXX XXXXXXXLLLLLLLLLLLLLLLLLLLLLLLL
|
||||
@include media-breakpoint-up(xl) { // >= 1200px
|
||||
}
|
||||
|
||||
// XXXXXXX XXXXXXXXXXXXXX XXXXXXXLLLLLLLLLLL
|
||||
// X:::::X X:::::XX:::::X X:::::XL:::::::::L
|
||||
// X:::::X X:::::XX:::::X X:::::XL:::::::::L
|
||||
// X::::::X X::::::XX::::::X X::::::XLL:::::::LL
|
||||
// XXX:::::X X:::::XXXXXX:::::X X:::::XXX L:::::L
|
||||
// X:::::X X:::::X X:::::X X:::::X L:::::L
|
||||
// X:::::X:::::X X:::::X:::::X L:::::L
|
||||
// X:::::::::X X:::::::::X L:::::L
|
||||
// X:::::::::X X:::::::::X L:::::L
|
||||
// X:::::X:::::X X:::::X:::::X L:::::L
|
||||
// X:::::X X:::::X X:::::X X:::::X L:::::L
|
||||
// XXX:::::X X:::::XXXXXX:::::X X:::::XXX L:::::L LLLLLL
|
||||
// X::::::X X::::::XX::::::X X::::::XLL:::::::LLLLLLLLL:::::L
|
||||
// X:::::X X:::::XX:::::X X:::::XL::::::::::::::::::::::L
|
||||
// X:::::X X:::::XX:::::X X:::::XL::::::::::::::::::::::L
|
||||
// XXXXXXX XXXXXXXXXXXXXX XXXXXXXLLLLLLLLLLLLLLLLLLLLLLLL
|
||||
@include media-breakpoint-up(xxl) { // >= 1400px
|
||||
}
|
||||
80
resources/sass/bo/base/_common.scss
Normal file
80
resources/sass/bo/base/_common.scss
Normal file
|
|
@ -0,0 +1,80 @@
|
|||
.table {
|
||||
&.fix-action {
|
||||
th:last-child,
|
||||
td:last-child {
|
||||
position: sticky;
|
||||
right: 0;
|
||||
width: 0.1%;
|
||||
background-color: $gray-200;
|
||||
color: $gray-900;
|
||||
white-space: nowrap;
|
||||
}
|
||||
}
|
||||
|
||||
.text-ellipsis {
|
||||
overflow: hidden;
|
||||
width: 20rem;
|
||||
text-overflow: ellipsis;
|
||||
white-space: nowrap;
|
||||
}
|
||||
}
|
||||
|
||||
.need-word-counter {
|
||||
border-top-left-radius: 0;
|
||||
border-top-right-radius: 0;
|
||||
}
|
||||
|
||||
.word-counter {
|
||||
border: 1px solid rgb(196 196 196);
|
||||
border-bottom: 0;
|
||||
background-color: #fafafa;
|
||||
border-top-left-radius: 0.375rem;
|
||||
border-top-right-radius: 0.375rem;
|
||||
color: initial;
|
||||
}
|
||||
|
||||
.image-input {
|
||||
.image-modification {
|
||||
display: block;
|
||||
max-width: 100%;
|
||||
}
|
||||
|
||||
.rotate-button {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
}
|
||||
|
||||
.rotate-drag {
|
||||
display: flex;
|
||||
width: 100%;
|
||||
flex-direction: column-reverse;
|
||||
|
||||
input {
|
||||
width: 100%;
|
||||
}
|
||||
}
|
||||
|
||||
.preview-image {
|
||||
position: relative;
|
||||
|
||||
div {
|
||||
position: relative;
|
||||
top: 50%;
|
||||
left: 50%;
|
||||
overflow: hidden;
|
||||
border: 1px solid #000;
|
||||
transform: translateX(-50%) translateY(-50%);
|
||||
}
|
||||
}
|
||||
|
||||
.right-aligned {
|
||||
overflow: hidden !important;
|
||||
direction: ltr !important;
|
||||
}
|
||||
|
||||
.right-aligned:not(:focus) {
|
||||
direction: rtl !important;
|
||||
text-align: left !important;
|
||||
text-overflow: ellipsis !important;
|
||||
}
|
||||
}
|
||||
|
|
@ -273,9 +273,6 @@ td {
|
|||
|
||||
&::after {
|
||||
position: absolute;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
border: 1px solid $secondary;
|
||||
background-color: transparent;
|
||||
border-radius: 0.5rem;
|
||||
|
|
|
|||
|
|
@ -53,7 +53,7 @@
|
|||
</div>
|
||||
</div>
|
||||
</nav>
|
||||
<main class="container-fluid @yield('bg-color')">
|
||||
<main class="container-fluid mt-5 pt-2 @yield('bg-color')">
|
||||
<div class="row justify-content-center">
|
||||
<div class="col col-md-6">
|
||||
@include('bo.modules.flashMessage')
|
||||
|
|
|
|||
|
|
@ -1,10 +0,0 @@
|
|||
@hasSection('breadcrumb')
|
||||
@if(Breadcrumbs::exists(app()->view->getSections()['breadcrumb']))
|
||||
{{ call_user_func_array('Breadcrumbs::render', array_merge(
|
||||
[app()->view->getSections()['breadcrumb']],
|
||||
!empty($brParam) ? (is_array($brParam) ? $brParam : [$brParam]) : []
|
||||
)) }}
|
||||
@endif
|
||||
@elseif(Breadcrumbs::exists(request()->route()->getName()))
|
||||
{{ Breadcrumbs::render(request()->route()->getName()) }}
|
||||
@endif
|
||||
|
|
@ -0,0 +1,10 @@
|
|||
@hasSection('breadcrumb')
|
||||
@if(Breadcrumbs::exists(app()->view->getSections()['breadcrumb']))
|
||||
{{ call_user_func_array('Breadcrumbs::render', array_merge(
|
||||
[app()->view->getSections()['breadcrumb']],
|
||||
!empty($brParam) ? (is_array($brParam) ? $brParam : [$brParam]) : []
|
||||
)) }}
|
||||
@endif
|
||||
@elseif(Breadcrumbs::exists(request()->route()->getName()))
|
||||
{{ Breadcrumbs::render(request()->route()->getName()) }}
|
||||
@endif
|
||||
|
|
@ -1,6 +1,6 @@
|
|||
@if ($paginator->hasPages())
|
||||
<nav>
|
||||
<ul class="pagination">
|
||||
<ul class="pagination d-flex justify-content-center align-items-center">
|
||||
{{-- Previous Page Link --}}
|
||||
@if ($paginator->onFirstPage())
|
||||
<li class="page-item disabled" data-bs="tooltip" data-bs-placement="top"
|
||||
|
|
|
|||
|
|
@ -1,6 +1,46 @@
|
|||
<form action="{{ route('search') }}" class="m-2">
|
||||
<div class="input-group justify-content-end">
|
||||
<input class="input-group-text" type="text" name="s" value="{{ clean(request()->s) }}" placeholder="{{ __('Votre recherche') }}">
|
||||
<button class="btn btn-outline-primary">{{ __('Chercher') }}</button>
|
||||
@php
|
||||
$iArgs = [];
|
||||
if(request()->sort_col) {
|
||||
$iArgs['sort_col'] = request()->sort_col;
|
||||
}
|
||||
|
||||
if(request()->search) {
|
||||
$iArgs['search'] = request()->sort_way;
|
||||
}
|
||||
@endphp
|
||||
<div class="row mb-3">
|
||||
<div class="col-12">
|
||||
<form id="searchForm" action="{{ request()->url() }}">
|
||||
<div class="input-group">
|
||||
<label class="input-group-text" for="searchField">{{ $searchFields }}</label>
|
||||
@if(request()->sort_col)
|
||||
<input class="d-none" type="text" name="sort_col" value="{{ request()->sort_col }}">
|
||||
@endif
|
||||
@if(request()->sort_way)
|
||||
<input class="d-none" type="text" name="sort_way" value="{{ request()->sort_way }}">
|
||||
@endif
|
||||
@if(request()->rangefilter)
|
||||
<input class="d-none" type="text" name="rangefilter" value="{{ request()->rangefilter }}">
|
||||
@endif
|
||||
@if(request()->group)
|
||||
<input class="d-none" type="text" name="group" value="{{ request()->group }}">
|
||||
@endif
|
||||
<input type="search" id="searchField" name="search" class="form-control" value="{{ request()->search }}" placeholder="{{ __('Vos mots clés ici...') }}"/>
|
||||
<button type="submit" class="btn btn-primary" data-bs-toggle="tooltip" title="{{ __('Lancer la recherche') }}">
|
||||
<i class="fas fa-search"></i>
|
||||
</button>
|
||||
<button id="searchDelete" type="button" class="btn btn-danger" data-bs-toggle="tooltip" title="{{ __('Effacer la recherche') }}">
|
||||
<i class="fas fa-backspace"></i>
|
||||
</button>
|
||||
@push('scripts')
|
||||
<script nonce="{{ $nonce }}">
|
||||
document.getElementById('searchDelete').addEventListener('click', function (e) {
|
||||
document.getElementById('searchField').value = '';
|
||||
document.getElementById('searchForm').submit();
|
||||
});
|
||||
</script>
|
||||
@endpush
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
|
|
|
|||
|
|
@ -1,52 +1,63 @@
|
|||
@php
|
||||
$route = request()->route();
|
||||
$routeName = $route->getName();
|
||||
$rst = !is_null(request()->rst);
|
||||
$noOrder = Session::get("$routeName.sort_col") !== 'order' and (Session::has("$routeName.sort_col") or Session::has("$routeName.sort_way"));
|
||||
$noOrder = Session::get("$routeName.sort_col") !== '' and (Session::has("$routeName.sort_col") or Session::has("$routeName.sort_way"));
|
||||
View::share('noOrder', $noOrder);
|
||||
$ignore = (isset($ignore) and is_array($ignore)) ? $ignore : [];
|
||||
$route = request()->route();
|
||||
$routeName = $route->getName();
|
||||
$rst = !is_null(request()->rst);
|
||||
$noOrder = Session::get("$routeName.sort_col") !== 'order' and (Session::has("$routeName.sort_col") or Session::has("$routeName.sort_way"));
|
||||
$noOrder = Session::get("$routeName.sort_col") !== '' and (Session::has("$routeName.sort_col") or Session::has("$routeName.sort_way"));
|
||||
View::share('noOrder', $noOrder);
|
||||
$ignore = (isset($ignore) and is_array($ignore)) ? $ignore : [];
|
||||
@endphp
|
||||
<tr>
|
||||
@foreach($cols as $col => $colname)
|
||||
@php
|
||||
$iArgs = ['sort_col' => $col];
|
||||
if(request()->search) {
|
||||
$iArgs['search'] = request()->search;
|
||||
}
|
||||
@endphp
|
||||
{{-- NO Sort for order column --}}
|
||||
@if($col === 'order' or in_array($col, $ignore))
|
||||
@if($noOrder and !$rst and !in_array($col, $ignore)) @continue @endif
|
||||
<th scope="col">
|
||||
<span class="text-nowrap">{{ $colname }}</span>
|
||||
</th>
|
||||
@continue
|
||||
@endif
|
||||
<th scope="col" @if(isset($mobileHide) and is_array($mobileHide) and in_array($col, $mobileHide)) class="d-none d-md-table-cell" @endif>
|
||||
<span class="text-nowrap">
|
||||
{{ $colname }}
|
||||
@if(!session("$routeName.sort_way") or session("$routeName.sort_col") !== $col or (session("$routeName.sort_way") === 'desc' and session("$routeName.sort_col") === $col))
|
||||
<a class="col_sort text-info lead asc" href="{{ request()->fullUrlWithQuery(array_merge($iArgs, ['sort_way' => 'asc', 'rst' => null])) }}" title="{{ __('Trier :name en ordre ascendant', [
|
||||
'name' => Str::lower($colname)
|
||||
]) }}" data-bs-toggle="tooltip"> ↓ </a>
|
||||
@endif
|
||||
@if(!session("$routeName.sort_way") or session("$routeName.sort_col") !== $col or (session("$routeName.sort_way") === 'asc' and session("$routeName.sort_col") === $col))
|
||||
<a class="col_sort text-info lead desc" href="{{ request()->fullUrlWithQuery(array_merge($iArgs, ['sort_way' => 'desc', 'rst' => null])) }}" title="{{ __('Trier :name en ordre descendant', [
|
||||
'name' => Str::lower($colname)
|
||||
]) }}" data-bs-toggle="tooltip"> ↑ </a>
|
||||
@endif
|
||||
</span>
|
||||
</th>
|
||||
@php
|
||||
$iArgs = ['sort_col' => $col];
|
||||
if(request()->search) {
|
||||
$iArgs['search'] = request()->search;
|
||||
}
|
||||
@endphp
|
||||
{{-- NO Sort for order column --}}
|
||||
@if($col === 'order' or in_array($col, $ignore))
|
||||
@if($noOrder and !$rst and !in_array($col, $ignore)) @continue @endif
|
||||
<th scope="col" class="text-center">
|
||||
<span class="text-nowrap">{{ $colname }}</span>
|
||||
</th>
|
||||
@continue
|
||||
@endif
|
||||
<th scope="col" @if(isset($mobileHide) and is_array($mobileHide) and in_array($col, $mobileHide)) class="d-none d-md-table-cell text-center" @endif>
|
||||
<span class="text-nowrap">
|
||||
{{ $colname }}
|
||||
@if(!session("$routeName.sort_way") or session("$routeName.sort_col") !== $col or (session("$routeName.sort_way") === 'desc' and session("$routeName.sort_col") === $col))
|
||||
<a class="col_sort text-info lead asc"
|
||||
href="{{ request()->fullUrlWithQuery(array_merge($iArgs, ['sort_way' => 'asc', 'rst' => null])) }}"
|
||||
title="{{ __('Trier :name en ordre ascendant', ['name' => Str::lower($colname)]) }}"
|
||||
data-bs-toggle="tooltip">
|
||||
↓
|
||||
</a>
|
||||
@endif
|
||||
@if(!session("$routeName.sort_way") or session("$routeName.sort_col") !== $col or (session("$routeName.sort_way") === 'asc' and session("$routeName.sort_col") === $col))
|
||||
<a class="col_sort text-info lead desc"
|
||||
href="{{ request()->fullUrlWithQuery(array_merge($iArgs, ['sort_way' => 'desc', 'rst' => null])) }}"
|
||||
title="{{ __('Trier :name en ordre descendant', ['name' => Str::lower($colname)]) }}"
|
||||
data-bs-toggle="tooltip">
|
||||
↑
|
||||
</a>
|
||||
@endif
|
||||
</span>
|
||||
</th>
|
||||
@endforeach
|
||||
{{-- Buttons Col --}}
|
||||
<th scope="col">
|
||||
@if($noOrder and !$rst)
|
||||
<a class="btn btn-small btn-danger" href="{{ request()->fullUrlWithQuery(['sort_col' => null, 'sort_way' => null, 'rst' => true, 'search' => null]) }}"
|
||||
data-bs-toggle="tooltip" title="{{ __('Effacer le tri') }}"><i class="fa fa-eraser"></i></a>
|
||||
<a class="btn btn-small btn-danger"
|
||||
href="{{ request()->fullUrlWithQuery(['sort_col' => null, 'sort_way' => null, 'rst' => true, 'search' => null]) }}"
|
||||
data-bs-toggle="tooltip"
|
||||
title="{{ __('Effacer le tri') }}">
|
||||
<i class="fa fa-eraser"></i>
|
||||
</a>
|
||||
@else
|
||||
@php $text = 'Ici, les flèches servent à trier et non pas à filtrer'; @endphp
|
||||
<span data-bs-toggle="tooltip" data-bs-placement="top" title="{{ __($text) }}"><i class="fas fa-question-circle"></i></span>
|
||||
<span data-bs-toggle="tooltip" data-bs-placement="top" title="{{ __('Ici, les flèches servent à trier et non pas à filtrer') }}">
|
||||
<i class="fas fa-question-circle"></i>
|
||||
</span>
|
||||
@endif
|
||||
</th>
|
||||
</tr>
|
||||
|
|
|
|||
Loading…
Add table
Reference in a new issue