From bff59a0e5494491f471bc5ba3017a19931010d59 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Pau=20Ferrer=20Oca=C3=B1a?= <crazyserver@gmail.com>
Date: Wed, 1 Feb 2023 11:06:13 +0100
Subject: [PATCH] MOBILE-4065 calendar: Fix calendar days focus

---
 .../components/calendar/addon-calendar-calendar.html | 12 ++++++------
 .../calendar/components/calendar/calendar.scss       |  1 -
 src/core/components/swipe-slides/swipe-slides.html   |  2 +-
 src/theme/theme.base.scss                            |  2 +-
 4 files changed, 8 insertions(+), 9 deletions(-)

diff --git a/src/addons/calendar/components/calendar/addon-calendar-calendar.html b/src/addons/calendar/components/calendar/addon-calendar-calendar.html
index b355dd1e5..3578f740c 100644
--- a/src/addons/calendar/components/calendar/addon-calendar-calendar.html
+++ b/src/addons/calendar/components/calendar/addon-calendar-calendar.html
@@ -33,7 +33,7 @@
         </ion-grid>
 
         <core-swipe-slides [manager]="manager">
-            <ng-template let-month="item">
+            <ng-template let-month="item" let-activeView="active">
                 <!-- Calendar view. -->
                 <ion-grid class="addon-calendar-months" role="table" aria-describedby="addon-calendar-monthname">
                     <div role="rowgroup">
@@ -57,9 +57,9 @@
                                     "today": month.isCurrentMonth && day.istoday,
                                     "weekend": day.isweekend,
                                     "duration_finish": day.haslastdayofevent
-                                }' [class.addon-calendar-event-past-day]="month.isPastMonth || day.ispast" role="cell" tabindex="0"
-                                (ariaButtonClick)="dayClicked(day.mday)">
-                                <p class="addon-calendar-day-number" role="button">
+                                }' [class.addon-calendar-event-past-day]="month.isPastMonth || day.ispast" role="cell"
+                                (ariaButtonClick)="dayClicked(day.mday)" [tabindex]="activeView ? 0 : -1">
+                                <p class="addon-calendar-day-number">
                                     <span aria-hidden="true">{{ day.mday }}</span>
                                     <span class="sr-only">{{ day.periodName | translate }}</span>
                                 </p>
@@ -72,8 +72,8 @@
                                 <div class="ion-hide-md-down addon-calendar-day-events" *ngIf="day.filteredEvents">
                                     <ng-container *ngFor="let event of day.filteredEvents | slice:0:4; let index = index">
                                         <div *ngIf="index < 3 || day.filteredEvents.length == 4" class="addon-calendar-event"
-                                            [class.addon-calendar-event-past]="event.ispast" role="button" tabindex="0"
-                                            (ariaButtonClick)="eventClicked(event, $event)">
+                                            [class.addon-calendar-event-past]="event.ispast" (ariaButtonClick)="eventClicked(event, $event)"
+                                            [tabindex]="activeView ? 0 : -1">
                                             <span class="calendar_event_type calendar_event_{{event.formattedType}}"></span>
                                             <ion-icon *ngIf="event.offline && !event.deleted" name="fas-clock"
                                                 [attr.aria-label]="'core.notsent' | translate"></ion-icon>
diff --git a/src/addons/calendar/components/calendar/calendar.scss b/src/addons/calendar/components/calendar/calendar.scss
index 7f6833c23..aea32bb2c 100644
--- a/src/addons/calendar/components/calendar/calendar.scss
+++ b/src/addons/calendar/components/calendar/calendar.scss
@@ -25,7 +25,6 @@
         @include border-end(1px, solid var(--addon-calendar-border-color));
         overflow: hidden;
         min-height: 60px;
-        cursor: pointer;
 
         &:first-child {
             @include padding-horizontal(10px, null);
diff --git a/src/core/components/swipe-slides/swipe-slides.html b/src/core/components/swipe-slides/swipe-slides.html
index 8b0860750..65ab4c92a 100644
--- a/src/core/components/swipe-slides/swipe-slides.html
+++ b/src/core/components/swipe-slides/swipe-slides.html
@@ -1,5 +1,5 @@
 <ion-slides *ngIf="loaded" (ionSlideWillChange)="slideWillChange()" (ionSlideDidChange)="slideDidChange()" [options]="options">
-    <ion-slide *ngFor="let item of items; index as index">
+    <ion-slide *ngFor="let item of items; index as index" [attr.aria-hidden]="!isActive(index)">
         <ng-container *ngIf="template" [ngTemplateOutlet]="template" [ngTemplateOutletContext]="{item: item, active: isActive(index)}">
         </ng-container>
     </ion-slide>
diff --git a/src/theme/theme.base.scss b/src/theme/theme.base.scss
index de26df5cb..38b019c0e 100644
--- a/src/theme/theme.base.scss
+++ b/src/theme/theme.base.scss
@@ -1581,7 +1581,7 @@ ion-item.item {
     outline: none;
 }
 
-textarea, button, select, input, a {
+textarea, button, select, input, a, .clickable {
     &:focus {
         @include core-focus-style();
         outline: none;