diff --git a/app/Http/Controllers/JoinedController.php b/app/Http/Controllers/JoinedController.php
index 78fe7e1..fc9578d 100644
--- a/app/Http/Controllers/JoinedController.php
+++ b/app/Http/Controllers/JoinedController.php
@@ -16,7 +16,10 @@ public function __construct()
public function index()
{
- return view('admin.joined.index');
+ $collective = auth_collective();
+ return view('admin.joined.index')->with([
+ 'joined' => $collective->joined()->paginate(8),
+ ]);
}
public function create()
diff --git a/app/Providers/AppServiceProvider.php b/app/Providers/AppServiceProvider.php
index 78b7e1b..3f23084 100644
--- a/app/Providers/AppServiceProvider.php
+++ b/app/Providers/AppServiceProvider.php
@@ -3,6 +3,7 @@
namespace App\Providers;
use Illuminate\Database\Eloquent\Relations\Relation;
+use Illuminate\Pagination\Paginator;
use Illuminate\Support\ServiceProvider;
class AppServiceProvider extends ServiceProvider
@@ -29,5 +30,8 @@ public function boot()
'owned' => 'App\Models\Owned',
'wish' => 'App\Models\Wish',
]);
+
+ Paginator::defaultView('vendor.pagination.default');
+ Paginator::defaultSimpleView('vendor.pagination.simple-default');
}
}
diff --git a/public/css/admin/style.css b/public/css/admin/style.css
index 1d47e33..2ec23b7 100644
--- a/public/css/admin/style.css
+++ b/public/css/admin/style.css
@@ -1,5 +1,5 @@
@import url(https://fonts.googleapis.com/css2?family=Imprima&family=Satisfy&display=swap);
-/* ------------------------------------------------------------------------------------ &BTN ---- */
+/* ------------------------------------------------------------------------- &MIXINS/EXTENDS ---- */
.form__input--file::-webkit-file-upload-button {
border: 1px solid #7874ff;
padding: 5px 10px;
@@ -12,7 +12,7 @@ .form__input--file::-webkit-file-upload-button {
-webkit-transition: background-color 0.4s, border-color 0.4s, color 0.4s;
transition: background-color 0.4s, border-color 0.4s, color 0.4s;
}
-.l-page-nav__link, .form__input--file::file-selector-button, .form__btn {
+.pagination__item, .pagination__item--disabled, .pagination__item--active, .l-page-nav__link, .form__input--file::file-selector-button, .form__btn {
border: 1px solid #7874ff;
padding: 5px 10px;
margin-right: 5px;
@@ -30,7 +30,7 @@ .form__input--file:hover::-webkit-file-upload-button {
-webkit-transition: background-color 0.4s, border-color 0.4s, color 0.4s;
transition: background-color 0.4s, border-color 0.4s, color 0.4s;
}
-.l-page-nav__link:hover, .form__input--file:hover::file-selector-button, .form__btn:hover {
+.pagination__item:hover, .pagination__item--disabled:hover, .pagination__item--active:hover, .l-page-nav__link:hover, .form__input--file:hover::file-selector-button, .form__btn:hover {
border-color: #de7cff;
background-color: #f8e5ff;
color: #de7cff;
@@ -43,13 +43,19 @@ .form__input--file:focus::-webkit-file-upload-button {
-webkit-transition: background-color 0.4s, border-color 0.4s, color 0.4s;
transition: background-color 0.4s, border-color 0.4s, color 0.4s;
}
-.l-page-nav__link:focus, .form__input--file:focus::file-selector-button, .form__btn:focus {
+.pagination__item:focus, .pagination__item--disabled:focus, .pagination__item--active:focus, .l-page-nav__link:focus, .form__input--file:focus::file-selector-button, .form__btn:focus {
border-color: #de7cff;
background-color: #f8e5ff;
color: #de7cff;
transition: background-color 0.4s, border-color 0.4s, color 0.4s;
}
+.pagination__item--disabled, .pagination__item--active {
+ border-color: #de7cff;
+ background-color: #f8e5ff;
+ color: #de7cff;
+}
+
html {
box-sizing: border-box;
}
@@ -199,6 +205,41 @@ .form__error {
color: #e20000;
}
+/* --------------------------------------------------------------------------------- &TABLES ---- */
+.table {
+ margin: 0 auto;
+ border-collapse: collapse;
+}
+
+.table tr, .table td, .table th {
+ border: 1px solid #7874ff;
+}
+
+.table td {
+ min-width: 30px;
+}
+
+.table__thead, .table__thead th {
+ font-weight: normal;
+ background-color: #d7d5ff;
+ border-color: #7874ff;
+ color: #7874ff;
+}
+
+.table__thead th {
+ padding: 5px;
+}
+
+.table__tbody td {
+ text-align: center;
+ padding: 5px;
+}
+
+.table__tbody img {
+ max-height: 50px;
+ margin: auto;
+}
+
html, body {
width: 100%;
height: 100%;
@@ -216,10 +257,13 @@ .l-container {
margin: 0 auto;
background-color: #f8f8ff;
border: 1px solid #7874ff;
+ display: grid;
+ grid-template-rows: 7% auto;
+ grid-template-columns: auto;
}
.l-nav {
- height: 7%;
+ grid-row: 1/2;
display: flex;
align-items: stretch;
border-bottom: 1px solid #7874ff;
@@ -259,6 +303,7 @@ .l-page-nav__link {
}
.l-main {
+ grid-row: 2/3;
padding: 10px 40px;
overflow: auto;
}
@@ -286,3 +331,22 @@ .error {
width: 60%;
margin: 10px auto;
}
+
+/* ----------------------------------------------------------------------------- &PAGINATION ---- */
+.pagination {
+ display: flex;
+ width: 100%;
+ justify-content: center;
+ align-items: center;
+ margin-top: 20px;
+}
+.pagination a {
+ text-decoration: none;
+}
+
+.pagination__item, .pagination__item--disabled, .pagination__item--active {
+ margin: 0;
+}
+.pagination__item:not(:last-child), .pagination__item--disabled:not(:last-child), .pagination__item--active:not(:last-child) {
+ border-right: none;
+}
diff --git a/resources/sass/admin/_base.scss b/resources/sass/admin/_base.scss
index f4863d4..76b06ad 100644
--- a/resources/sass/admin/_base.scss
+++ b/resources/sass/admin/_base.scss
@@ -122,4 +122,41 @@ h1 {
.form__error {
color: $c-red;
+}
+
+/* --------------------------------------------------------------------------------- &TABLES ---- */
+
+.table {
+ margin: 0 auto;
+ border-collapse: collapse;
+}
+
+.table tr, .table td, .table th {
+ border: 1px solid $c-main;
+}
+
+.table td {
+ min-width: 30px;
+}
+
+.table__thead {
+ font-weight: normal;
+ background-color: $c-main-light;
+ border-color: $c-main;
+ color: $c-main;
+}
+
+.table__thead th {
+ @extend .table__thead;
+ padding: 5px;
+}
+
+.table__tbody td {
+ text-align: center;
+ padding: 5px;
+}
+
+.table__tbody img {
+ max-height: 50px;
+ margin: auto;
}
\ No newline at end of file
diff --git a/resources/sass/admin/_layout.scss b/resources/sass/admin/_layout.scss
index 0802240..bd9559a 100644
--- a/resources/sass/admin/_layout.scss
+++ b/resources/sass/admin/_layout.scss
@@ -18,11 +18,15 @@ body {
margin: 0 auto;
background-color: #f8f8ff;
border: 1px solid $c-main;
+
+ display: grid;
+ grid-template-rows: 7% auto;
+ grid-template-columns: auto;
}
.l-nav {
- height: 7%;
+ grid-row: 1/2;
display: flex;
align-items: stretch;
border-bottom: 1px solid $c-main;
@@ -64,6 +68,7 @@ body {
.l-main {
+ grid-row: 2/3;
padding: 10px 40px;
overflow: auto;
}
\ No newline at end of file
diff --git a/resources/sass/admin/_modules.scss b/resources/sass/admin/_modules.scss
index 2b4951b..eb63e4d 100644
--- a/resources/sass/admin/_modules.scss
+++ b/resources/sass/admin/_modules.scss
@@ -12,4 +12,28 @@
.success { @include msg($c-green); }
.warning { @include msg($c-yellow); }
-.error { @include msg($c-red); }
\ No newline at end of file
+.error { @include msg($c-red); }
+
+/* ----------------------------------------------------------------------------- &PAGINATION ---- */
+
+.pagination {
+ display: flex;
+ width: 100%;
+ justify-content: center;
+ align-items: center;
+ margin-top: 20px;
+
+ a { text-decoration: none; }
+}
+
+.pagination__item {
+ @extend %btn;
+ margin: 0;
+
+ &:not(:last-child) { border-right: none; }
+}
+
+.pagination__item--disabled, .pagination__item--active {
+ @extend .pagination__item;
+ @extend %disabled;
+}
\ No newline at end of file
diff --git a/resources/sass/admin/_vars.scss b/resources/sass/admin/_vars.scss
index 30a9b63..a28468a 100644
--- a/resources/sass/admin/_vars.scss
+++ b/resources/sass/admin/_vars.scss
@@ -19,7 +19,7 @@ $c-green: #30be00;
$c-yellow: #ebb000;
$c-red: #e20000;
-/* ------------------------------------------------------------------------------------ &BTN ---- */
+/* ------------------------------------------------------------------------- &MIXINS/EXTENDS ---- */
@mixin hover($focus: true, $bg: true) {
border-color: $c-main;
@@ -58,4 +58,20 @@ $c-red: #e20000;
cursor: pointer;
@include hover;
+}
+
+%disabled {
+ border-color: $c-accent;
+ background-color: $c-accent-lightest;
+ color: $c-accent;
+
+ // border-color: #888;
+ // background-color: #ddd;
+ // color: #888;
+
+ // &:hover, &:focus {
+ // border-color: #888;
+ // background-color: #ddd;
+ // color: #888;
+ // }
}
\ No newline at end of file
diff --git a/resources/views/admin/joined/index.blade.php b/resources/views/admin/joined/index.blade.php
index 226011b..ffb4d49 100644
--- a/resources/views/admin/joined/index.blade.php
+++ b/resources/views/admin/joined/index.blade.php
@@ -4,4 +4,31 @@
{{-- approved --}} | +Subject | {{-- link --}} +Categories | +Image | +Actions | +||
---|---|---|---|---|---|---|
+ | {{ $fl->subject }} | ++ | + |