From 018c330be4db2b35f6f7cf0278b4c158d26d9e3a Mon Sep 17 00:00:00 2001
From: Alexandr <canekg@mail.ru>
Date: Mon, 15 Jan 2024 20:18:01 +0500
Subject: [PATCH] [#1448] Page adaptation fixed

---
 app/Helpers/ChartHelper.php                     |  2 +-
 resources/sass/_activity_chart.scss             | 17 +++++++++++++++++
 resources/sass/_custom.scss                     |  9 ++++++++-
 .../views/components/activity_chart.blade.php   |  4 ++--
 resources/views/home/index.blade.php            |  4 ++--
 resources/views/layouts/app.blade.php           |  2 +-
 6 files changed, 31 insertions(+), 7 deletions(-)

diff --git a/app/Helpers/ChartHelper.php b/app/Helpers/ChartHelper.php
index 33e1b56bd..c439d8ecd 100644
--- a/app/Helpers/ChartHelper.php
+++ b/app/Helpers/ChartHelper.php
@@ -25,7 +25,7 @@ public static function getChart(?int $userId = null): \Generator
                 return $group->count();
             });
 
-        $chart = CarbonPeriod::create(now()->subMonths(24), '1 day', now())
+        $chart = CarbonPeriod::create(now()->subMonths(12), '1 day', now())
             ->map(function (Carbon $dayDate) use ($countActivitiesByDays): int {
                 $day = $dayDate->format('Y-m-d');
                 $dayActivitiesCount = $countActivitiesByDays->get($day, 0);
diff --git a/resources/sass/_activity_chart.scss b/resources/sass/_activity_chart.scss
index ca2a1423b..d8301e647 100644
--- a/resources/sass/_activity_chart.scss
+++ b/resources/sass/_activity_chart.scss
@@ -24,6 +24,23 @@
     grid-auto-flow: column;
     grid-auto-columns: var(--square-size);
     padding: 0;
+    overflow-x: auto;
+}
+
+.squares::-webkit-scrollbar {
+    width: 10px;
+    height: 8px;
+}
+  
+.squares::-webkit-scrollbar-track {
+    -webkit-box-shadow: 5px 5px 5px -5px rgba(34, 60, 80, 0.2) inset;
+    background-color: #f9f9fd;
+    border-radius: 10px;
+}
+  
+.squares::-webkit-scrollbar-thumb {
+    border-radius: 10px;
+    background: linear-gradient(180deg, #00c6fb, #005bea);
 }
 
 .graph {
diff --git a/resources/sass/_custom.scss b/resources/sass/_custom.scss
index 8f8597278..c3c204133 100644
--- a/resources/sass/_custom.scss
+++ b/resources/sass/_custom.scss
@@ -34,4 +34,11 @@
     .bg-light {
         background-color: #343a40 !important;
     }
-}
\ No newline at end of file
+}
+
+@media (max-width: 576px) {
+    main.flex-grow-1 {
+      margin-left: 16px;
+      margin-right: 16px;
+    }
+}
diff --git a/resources/views/components/activity_chart.blade.php b/resources/views/components/activity_chart.blade.php
index db2f66155..1a156b531 100644
--- a/resources/views/components/activity_chart.blade.php
+++ b/resources/views/components/activity_chart.blade.php
@@ -1,5 +1,5 @@
-<div class="graph mt-4">
-  <div class="d-flex justify-content-end overflow-hidden m-4">
+<div class="container graph mt-4">
+  <div class="d-flex justify-content-center overflow-hidden m-4">
     <ul class="squares mb-0">
       @foreach ($chart as $square)
         <li data-level="{{ $square }}"></li>
diff --git a/resources/views/home/index.blade.php b/resources/views/home/index.blade.php
index 888a8a9a5..5205fff2d 100644
--- a/resources/views/home/index.blade.php
+++ b/resources/views/home/index.blade.php
@@ -45,8 +45,8 @@
             </a>
           </li>
         </ul>
-        <div class="container mt-2">
-          <div class="row text-center">
+        <div class="container m-0 p-0  mt-2">
+          <div class="row m-0 p-0  text-center">
             <div class="col mt-4">
               <p>{{ __('welcome.statistic.table.count_points') }}:</p>
               <h3>{{ $statisticTable['countPoints'] }}</h3>
diff --git a/resources/views/layouts/app.blade.php b/resources/views/layouts/app.blade.php
index 8e1bbe7b8..e5fcd64d8 100644
--- a/resources/views/layouts/app.blade.php
+++ b/resources/views/layouts/app.blade.php
@@ -30,7 +30,7 @@
   @include('layouts._nav')
   @include('flash::message')
   @hasSection('content')
-    <main class='flex-grow-1 m-0'>
+    <main class='flex-grow-1'>
       <div class="container p-0">
         @yield('content')
       </div>