From 68e3aa3292ce21cfe4f8ffb12d0886bae0342c3c Mon Sep 17 00:00:00 2001 From: Amir Date: Mon, 21 Nov 2022 15:37:40 +0800 Subject: [PATCH] Style sidebar --- public/css/app.css | 352 +++++ resources/views/includes/header.blade.php | 6 +- resources/views/includes/sidebar.blade.php | 1134 +++++++++-------- resources/views/layouts/app.blade.php | 261 +--- .../views/lelong/senarailelong.blade.php | 371 +++--- .../views/pengurusanpengguna/index.blade.php | 24 +- .../views/simulasi/janasimulasi.blade.php | 15 +- .../views/simulasi/senaraisimulasi.blade.php | 7 +- .../views/simulasi/showsimulasi.blade.php | 8 +- resources/views/tetapan/parameter.blade.php | 25 +- 10 files changed, 1241 insertions(+), 962 deletions(-) diff --git a/public/css/app.css b/public/css/app.css index 8ba99088..77e3ed9f 100644 --- a/public/css/app.css +++ b/public/css/app.css @@ -16459,3 +16459,355 @@ readers do not read off random characters that represent icons */ text-transform: capitalize; padding: 12px 12px; } + +a, +a:hover, +a:focus { + color: inherit; + text-decoration: none; + transition: all 0.3s; +} + +.navbar { + padding: 15px 10px; + background: #fff; + border: none; + border-radius: 0; + margin-bottom: 40px; + box-shadow: 1px 1px 3px rgba(0, 0, 0, 0.1); +} + +.navbar-btn { + box-shadow: none; + outline: none !important; + border: none; +} + +.line { + width: 100%; + height: 1px; + border-bottom: 1px dashed #ddd; + margin: 40px 0; +} + + +.wrapper { + /* display: flex; */ + /* width: 100%; */ +} + +/* --------------------------------------------------- + SIDEBAR STYLE +----------------------------------------------------- */ + +#sidebar { + bottom: 0; + overflow-y: scroll; + width: 265px; + position: static; + top: 0; + left: 0; + height: 100vh; + z-index: 999; + background: #1E1E2D; + /* color: rgb(41, 39, 39); */ + color: #808080; + transition: all 0.3s; +} + +#sidebar.active { + margin-left: -265px; +} + +.sidebar-header { + padding: 20px; + display: flex; + justify-content: space-between; + /* border-bottom: 0.2px solid #6d7fcc; */ +} + +.sidebar-title { + font-size: 1.074rem; + font-weight: bold; + color: white; + border-color: white; + align-self: center; + /* border-bottom: border 1px solid white; */ +} + +.sidebar-logo { + width: 50px; + height: 35px; +} + +/* #sidebar ul.components { + padding: 20px 0; + border-bottom: 1px solid #fff; +} */ + +/* #sidebar ul p { + color: rgb(41, 39, 39); + padding: 10px; +} */ + +#sidebar ul li { + margin: 3px 0; +} + +#sidebar ul li.active { + background: #2a2a3c; + color: white; + border-radius: 25px; +} + +#sidebar ul li.active:hover { + background: #2a2a3ca1; + /* color: white; */ +} + +#sidebar ul li a { + padding: 7px 5px; + font-size: 1.05em; + display: block; +} + +#sidebar ul li a:hover { + color: white; + /* background: var(--indigo); */ + border-radius: 15px; +} + +/* #sidebar ul li.active a{ + color: white; + background: #F0F0F0; +} */ + +#sidebar ul li .active a{ + color: white; + /* background: #2a2a3c; */ + border-radius: 15px; + margin: 2px; + background-position: 20px; + /* width: 70%; */ +} + +#sidebar ul li .active a:hover{ + color: #ffffffd6; + background: #2a2a3ca1; +} + +/* #sidebar ul li.active>a, +a[aria-expanded="true"] { + color: #111; + background: #F0F0F0; +} */ + +#sidebar ul li ul li a:before{ + font-family: "Font Awesome 5 Free"; + font-weight: 600; + content: "\f111"; + font-size: 4px; + vertical-align: middle; + margin-right: 8px; +} + + + +/* .dropdown-toggle::after { + display: block; + position: absolute; + top: 50%; + right: 20px; + transform: translateY(-50%); +} */ + +#sidebar ul ul a { + font-size: 0.9em; + padding-left: 30px !important; + /* background: #fff; */ +} + + + +.sidebar-menu { + display: flex; + justify-content: space-between; +} + +.sidebar-menu-title { + margin-top: 20px; + padding: 6px 14px; +} + +.sidebar-menu-item-expand { + align-self: center; + font-size: 1.0em; + margin-right: 11px; +} + +/* .sidebar-menu-item-expand::before { + font-family: "Font Awesome 5 Free"; + font-weight: 900; + content: "\f078"; +} */ + +.sidebar-menu-main-title { + display: flex; +} + +.sidebar-menu-item-main { + font-size: 1.0em; + /* vertical-align: sub; */ + margin-right: 9px; + margin-left: 7px; + align-self: center; + color: var(--indigo); +} + +/* .sidebar-menu-item-main:hover { + color: white; + background: white; +} */ + +/* ul.CTAs { + padding: 20px; +} + +ul.CTAs a { + text-align: center; + font-size: 0.9em !important; + display: block; + border-radius: 5px; + margin-bottom: 5px; +} */ +a[data-toggle="collapse"] { + position: relative; +} + +a.download { + background: #fff; + color: #7386D5; +} + +a.article, +a.article:hover { + background: #6d7fcc !important; + color: #fff !important; +} + +/* --------------------------------------------------- + CONTENT STYLE +----------------------------------------------------- */ + +#content { + width: calc(100% - 265px); + padding: 3x; + min-height: 100vh; + transition: all 0.3s; + position: absolute; + top: 0; + right: 0; + overflow-y: auto; +} + +#content.active { + width: 100%; +} + +.hovernone:hover { + background-color: #3490dc !important; + cursor: context-menu !important; +} + +.hovernone-success:hover { + background-color: #38c172 !important; + cursor: context-menu !important; +} + +.hovernone-danger:hover { + background-color: #e3342f !important; + cursor: context-menu !important; +} + +#loader { + display: none; + position: fixed; + top: 0; + left: 0; + right: 0; + bottom: 0; + width: 100%; + background: rgba(0, 0, 0, 0.4) url("") no-repeat center center; + z-index: 99999; + + +} + +#loader-image { + position: absolute; + top: 40%; + left: 45%; + z-index: 100 +} + +.button { + background-color: #E09215; + border: none; + color: white; + padding: 10px 24px; + text-align: center; + text-decoration: none; + display: inline-block; + font-size: 14px; + margin: 4px 2px; + cursor: pointer; +} + + + +/* --------------------------------------------------- + MEDIAQUERIES +----------------------------------------------------- */ + +@media (max-width: 992px) { + #sidebar { + margin-left: -265px; + } + + #sidebar.active { + margin-left: 0; + } + + #content { + width: 100%; + } + + #content.active { + width: calc(100% - 265px); + } + + #sidebarCollapse span { + display: none; + } +} + +.sidebar-footer { + /* position: absolute; */ + /* bottom: 0; */ + margin-top: 70px; +} + +.sidebar-footer-content { + display: flex; + justify-content: center; + align-self: center; + border: 2px solid #2a2a3c; + padding: 10px; + margin: 46px; + border-radius: 10px; + color: #484859; +} + +.user-info { + /* display: flex; */ +} \ No newline at end of file diff --git a/resources/views/includes/header.blade.php b/resources/views/includes/header.blade.php index 3a0fdd58..e8a1c7be 100644 --- a/resources/views/includes/header.blade.php +++ b/resources/views/includes/header.blade.php @@ -1,14 +1,14 @@ - \ No newline at end of file diff --git a/resources/views/layouts/app.blade.php b/resources/views/layouts/app.blade.php index ef0071e2..9812e55b 100644 --- a/resources/views/layouts/app.blade.php +++ b/resources/views/layouts/app.blade.php @@ -1,5 +1,6 @@ + @@ -12,20 +13,21 @@ - - - - + + + + {{-- --}} - + + - - + + - - +
@include('includes.sidebar') -
-
+
+
@include('includes.header')
@yield('content')
-
- - + + + - + + \ No newline at end of file diff --git a/resources/views/lelong/senarailelong.blade.php b/resources/views/lelong/senarailelong.blade.php index 006698f1..ab6edff3 100644 --- a/resources/views/lelong/senarailelong.blade.php +++ b/resources/views/lelong/senarailelong.blade.php @@ -47,183 +47,189 @@
- - - - - - - - - - - - - - - - - @foreach($arraydetails0 as $lelong) - - - - - - - - - - - - - @endforeach - -
BilID LelongTarikh LelongFasaCawanganHarga Emas AsasTempohCaj LelongStatusTindakan
{{$loop->iteration}}{{$lelong->id}}{{$lelong->tarikh_lelong}}{{$lelong->fasa}} - @foreach($lelong->cawangan as $cawangan) -
- {{$cawangan->caw_name}} -
- @endforeach - 		{{$lelong->harga_emas_asas}}{{$lelong->jbg}}{{$lelong->cajlelong}}LELONG BELUM MULA -
- - - -
-
- +
+ + + + + + + + + + + + + + + + + @foreach($arraydetails0 as $lelong) + + + + + + + + + + + + + @endforeach + +
BilID LelongTarikh LelongFasaCawanganHarga Emas AsasTempohCaj LelongStatusTindakan
{{$loop->iteration}}{{$lelong->id}}{{$lelong->tarikh_lelong}}{{$lelong->fasa}} + @foreach($lelong->cawangan as $cawangan) +
+ {{$cawangan->caw_name}} +
+ @endforeach + 		{{$lelong->harga_emas_asas}}{{$lelong->jbg}}{{$lelong->cajlelong}}LELONG BELUM MULA +
+ + + +
+
+
- - - - - - - - - - - - - - - - - - @foreach($arraydetails1 as $lelong) - - - - - - - - - - - - - - @endforeach - -
BilID LelongTarikh LelongFasaCawanganMasa Mula LelongMasa Tamat LelongHarga Emas AsasTempohCaj LelongStatus
{{$loop->iteration}}{{$lelong->id}}{{$lelong->tarikh_lelong}}{{$lelong->fasa}} - @foreach($lelong->cawangan as $cawangan) -
- {{$cawangan->caw_name}} -
- @endforeach - 		{{$lelong->masamula_lelong}}{{$lelong->masatamat_lelong}}{{$lelong->harga_emas_asas}}{{$lelong->jbg}}{{$lelong->cajlelong}}LELONG SEDANG DIJANLANKAN
- +
+ + + + + + + + + + + + + + + + + + @foreach($arraydetails1 as $lelong) + + + + + + + + + + + + + + @endforeach + +
BilID LelongTarikh LelongFasaCawanganMasa Mula LelongMasa Tamat LelongHarga Emas AsasTempohCaj LelongStatus
{{$loop->iteration}}{{$lelong->id}}{{$lelong->tarikh_lelong}}{{$lelong->fasa}} + @foreach($lelong->cawangan as $cawangan) +
+ {{$cawangan->caw_name}} +
+ @endforeach + 		{{$lelong->masamula_lelong}}{{$lelong->masatamat_lelong}}{{$lelong->harga_emas_asas}}{{$lelong->jbg}}{{$lelong->cajlelong}}LELONG SEDANG DIJANLANKAN
+
- - - - - - - - - - - - - - - - - @foreach($arraydetails2 as $data) - - - - - - - - - - - - - @endforeach - -
BilID LelongTarikh LelongFasaCawanganMasa Tamat LelongHarga Emas AsasTempohCaj LelongStatus
{{$loop->iteration}}{{$lelong->id}}{{$lelong->tarikh_lelong}}{{$lelong->fasa}} - @foreach($lelong->cawangan as $cawangan) -
- {{$cawangan->caw_name}} -
- @endforeach - 		{{$lelong->masatamat_lelong}}{{$lelong->harga_emas_asas}}{{$lelong->jbg}}{{$lelong->cajlelong}}LELONG JANA PEMENANGAN
+
+ + + + + + + + + + + + + + + + + @foreach($arraydetails2 as $data) + + + + + + + + + + + + + @endforeach + +
BilID LelongTarikh LelongFasaCawanganMasa Tamat LelongHarga Emas AsasTempohCaj LelongStatus
{{$loop->iteration}}{{$lelong->id}}{{$lelong->tarikh_lelong}}{{$lelong->fasa}} + @foreach($lelong->cawangan as $cawangan) +
+ {{$cawangan->caw_name}} +
+ @endforeach + 		{{$lelong->masatamat_lelong}}{{$lelong->harga_emas_asas}}{{$lelong->jbg}}{{$lelong->cajlelong}}LELONG JANA PEMENANGAN
+
- - - - - - - - - - - - - - - - - - - @foreach($arraydetails3 as $lelong) - - - - - - - - - - - - - - - @endforeach - -
BilID LelongTarikh LelongFasaCawanganMasa Mula LelongMasa Tamat LelongHarga Emas AsasTempohCaj LelongStatusTindakan
{{$loop->iteration}}{{$lelong->id}}{{$lelong->tarikh_lelong}}{{$lelong->fasa}} - @foreach($lelong->cawangan as $cawangan) -
- {{$cawangan->caw_name}} -
- @endforeach - 		{{$lelong->masamula_lelong}}{{$lelong->masatamat_lelong}}{{$lelong->harga_emas_asas}}{{$lelong->jbg}}{{$lelong->cajlelong}}LELONG SELESAI - - - -
+
+ + + + + + + + + + + + + + + + + + + @foreach($arraydetails3 as $lelong) + + + + + + + + + + + + + + + @endforeach + +
BilID LelongTarikh LelongFasaCawanganMasa Mula LelongMasa Tamat LelongHarga Emas AsasTempohCaj LelongStatusTindakan
{{$loop->iteration}}{{$lelong->id}}{{$lelong->tarikh_lelong}}{{$lelong->fasa}} + @foreach($lelong->cawangan as $cawangan) +
+ {{$cawangan->caw_name}} +
+ @endforeach + 		{{$lelong->masamula_lelong}}{{$lelong->masatamat_lelong}}{{$lelong->harga_emas_asas}}{{$lelong->jbg}}{{$lelong->cajlelong}}LELONG SELESAI + + + +
+
@@ -306,34 +312,19 @@ $('.export').removeClass('dt-button'); var tableLelongSemasa = $('#lelong-semasa').DataTable({ - "pageLength": 5000, - "paging": false, - "searching": false, - "info": false + "pageLength": 100, }); var tableLelongSedang = $('#lelong-sedang').DataTable({ - "pageLength": 5000, - "paging": false, - "searching": false, - "info": false + "pageLength": 100, }); var tableLelongBelum = $('#lelong-belum').DataTable({ - "pageLength": 5000, - "paging": false, - "searching": false, - "info": false + "pageLength": 100, }); var tableLelongJanaPemenang = $('#lelong-jana-pemenang').DataTable({ - "pageLength": 5000, - "paging": false, - "searching": false, - "info": false + "pageLength": 100, }); var tableLelongSelesai = $('#lelong-selesai').DataTable({ - "pageLength": 5000, - "paging": false, - "searching": false, - "info": false + "pageLength": 100, }); diff --git a/resources/views/pengurusanpengguna/index.blade.php b/resources/views/pengurusanpengguna/index.blade.php index f23f6545..0b7c07f4 100644 --- a/resources/views/pengurusanpengguna/index.blade.php +++ b/resources/views/pengurusanpengguna/index.blade.php @@ -4,30 +4,31 @@
-
- +
+
+
+
+ Senarai Pengguna +
+
+
@if ($message = Session::get('success'))
-

{{ $message }}

+ {{ $message }}
@endif @if ($message = Session::get('failed'))
-

{{ $message }}

+ {{ $message }}
@endif -
-
- Senarai Pengguna -
-
-
@csrf +
@@ -77,7 +78,10 @@ @endforeach
+
+
+
diff --git a/resources/views/simulasi/janasimulasi.blade.php b/resources/views/simulasi/janasimulasi.blade.php index 090e0ad3..2c8294c7 100644 --- a/resources/views/simulasi/janasimulasi.blade.php +++ b/resources/views/simulasi/janasimulasi.blade.php @@ -4,11 +4,16 @@ -
+
-
-

Simulasi

- +
+
+
+
+ Jana Simulasi +
+
+
@if ($message = Session::get('failed'))
{{ $message }} @@ -79,6 +84,8 @@
+
+
diff --git a/resources/views/simulasi/senaraisimulasi.blade.php b/resources/views/simulasi/senaraisimulasi.blade.php index 2368c64a..9a9c9d60 100644 --- a/resources/views/simulasi/senaraisimulasi.blade.php +++ b/resources/views/simulasi/senaraisimulasi.blade.php @@ -18,7 +18,8 @@ @endif
- +
+
@@ -61,6 +62,7 @@
No
+
@@ -140,8 +142,7 @@ "targets": 6 } ], - "pageLength": 50, - "scrollX": true + "pageLength": 100, }); diff --git a/resources/views/simulasi/showsimulasi.blade.php b/resources/views/simulasi/showsimulasi.blade.php index 9d78b5c4..e3dc9490 100644 --- a/resources/views/simulasi/showsimulasi.blade.php +++ b/resources/views/simulasi/showsimulasi.blade.php @@ -171,6 +171,7 @@ +
@@ -221,9 +222,11 @@
+
Jumlah Berat Mengikut Mutu (Keseluruhan)
- +
+