diff --git a/app/Http/Livewire/ToggleStudentAppAcceptedStatus.php b/app/Http/Livewire/ToggleStudentAppAcceptedStatus.php new file mode 100644 index 00000000..2c42f75e --- /dev/null +++ b/app/Http/Livewire/ToggleStudentAppAcceptedStatus.php @@ -0,0 +1,49 @@ +user = auth()->user(); + $this->syncStatsVisibility(); + } + + public function updatedVisible($value) + { + $this->authorize('update', [$this->student, $this->user]); + + $this->stats->removeData('accepted_status_history_visibility'); + $this->stats->insertData(['accepted_status_history_visibility' => $value ? '1' : '0']); + $this->emit('alert', $value + ? "Now Displaying Last Accepted Status!" + : "Last Accepted Status is Hidden Now.", + 'success' + ); + + $this->syncStatsVisibility(); + } + + private function syncStatsVisibility() + { + $this->stats = $this->student->fresh()->stats; + $this->visible = !isset($this->stats->accepted_status_history_visibility) || $this->stats->accepted_status_history_visibility === '1' ? true : false; + } +} diff --git a/app/Student.php b/app/Student.php index fbecf415..d1f71928 100644 --- a/app/Student.php +++ b/app/Student.php @@ -108,6 +108,7 @@ public function updateAcceptedStats(Profile $profile, $accepted = true) if ($accepted) { if (!isset($stats->accepted_by[$accepted_key])) { $stats->insertData([ + 'accepted_status_history_visibility' => '1', 'accepted_by' => [ $accepted_key => [ 'profile' => $profile->id, diff --git a/public/css/app.css b/public/css/app.css index be026771..28c3194a 100644 --- a/public/css/app.css +++ b/public/css/app.css @@ -10281,7 +10281,25 @@ div.content.showContent { display: none; } -/* The slider */ +/* Base container */ +.switch { + /* Default (original) values */ + --switch-size: 26px; + --switch-gap: 4px; + --switch-translation: 26px; + position: relative; + display: inline-block; + width: calc(var(--switch-size) * 2 + var(--switch-gap) * 2); + height: calc(var(--switch-size) + var(--switch-gap) * 2); +} + +/* SMALL VERSION OVERRIDE */ +.switch.small-switch { + --switch-size: 12px; /* Smaller knob */ + --switch-gap: 3px; /* Tighter padding */ + --switch-translation: 12px; /* Smaller slide distance */ +} + .slider { position: absolute; cursor: pointer; @@ -10296,10 +10314,10 @@ div.content.showContent { .slider:before { position: absolute; content: ""; - height: 26px; - width: 26px; - left: 4px; - bottom: 4px; + height: var(--switch-size); + width: var(--switch-size); + left: var(--switch-gap); + bottom: var(--switch-gap); background-color: white; transition: 0.4s; } @@ -10313,7 +10331,8 @@ input:focus + .slider { } input:checked + .slider:before { - transform: translateX(26px); + /* Automatically uses the correct distance based on the class */ + transform: translateX(var(--switch-translation)); } /* Rounded sliders */ diff --git a/public/mix-manifest.json b/public/mix-manifest.json index dcb76aea..3f35f453 100644 --- a/public/mix-manifest.json +++ b/public/mix-manifest.json @@ -3,8 +3,8 @@ "/js/app.js.map": "/js/app.js.map?id=271c8f103c569b8f5613b8778d48ee75", "/js/manifest.js": "/js/manifest.js?id=dc9ead3d7857b522d7de22d75063453c", "/js/manifest.js.map": "/js/manifest.js.map?id=389e00e7d7680b68d4e1d128ce27ff48", - "/css/app.css": "/css/app.css?id=0fd161f323dd5c77642c3240bbb47d16", - "/css/app.css.map": "/css/app.css.map?id=3ba6add83b449d9a830b1160dc25d43d", + "/css/app.css": "/css/app.css?id=b94039e3f74ab92a4c88352f22bb0334", + "/css/app.css.map": "/css/app.css.map?id=7d5ab92385140497a5e682d0633c052d", "/js/vendor.js": "/js/vendor.js?id=77012e19e850a379f73e3ac0c76bc9b1", "/js/vendor.js.map": "/js/vendor.js.map?id=f3f5514d1186aa088c887b6ebe999fe0" } diff --git a/resources/assets/sass/_core.scss b/resources/assets/sass/_core.scss index bcf1b015..044b845c 100644 --- a/resources/assets/sass/_core.scss +++ b/resources/assets/sass/_core.scss @@ -363,14 +363,30 @@ div.content.showContent { /* Hide default HTML checkbox */ .switch input {display:none;} -/* The slider */ +/* Base container */ +.switch { + /* Default (original) values */ + --switch-size: 26px; + --switch-gap: 4px; + --switch-translation: 26px; + + position: relative; + display: inline-block; + width: calc(var(--switch-size) * 2 + (var(--switch-gap) * 2)); + height: calc(var(--switch-size) + (var(--switch-gap) * 2)); +} + +/* SMALL VERSION OVERRIDE */ +.switch.small-switch { + --switch-size: 12px; /* Smaller knob */ + --switch-gap: 3px; /* Tighter padding */ + --switch-translation: 12px; /* Smaller slide distance */ +} + .slider { position: absolute; cursor: pointer; - top: 0; - left: 0; - right: 0; - bottom: 0; + top: 0; left: 0; right: 0; bottom: 0; background-color: #ccc; -webkit-transition: .4s; transition: .4s; @@ -379,10 +395,10 @@ div.content.showContent { .slider:before { position: absolute; content: ""; - height: 26px; - width: 26px; - left: 4px; - bottom: 4px; + height: var(--switch-size); + width: var(--switch-size); + left: var(--switch-gap); + bottom: var(--switch-gap); background-color: white; -webkit-transition: .4s; transition: .4s; @@ -397,9 +413,8 @@ input:focus + .slider { } input:checked + .slider:before { - -webkit-transform: translateX(26px); - -ms-transform: translateX(26px); - transform: translateX(26px); + /* Automatically uses the correct distance based on the class */ + transform: translateX(var(--switch-translation)); } /* Rounded sliders */ diff --git a/resources/views/livewire/toggle-student-app-accepted-status.blade.php b/resources/views/livewire/toggle-student-app-accepted-status.blade.php new file mode 100644 index 00000000..ddc3efb2 --- /dev/null +++ b/resources/views/livewire/toggle-student-app-accepted-status.blade.php @@ -0,0 +1,19 @@ +