diff --git a/src/addons/calendar/pages/edit-event/edit-event.html b/src/addons/calendar/pages/edit-event/edit-event.html
index f949796e813..26592324da2 100644
--- a/src/addons/calendar/pages/edit-event/edit-event.html
+++ b/src/addons/calendar/pages/edit-event/edit-event.html
@@ -29,8 +29,14 @@
{{ title | translate }}
{{ 'core.date' | translate }}
-
+
+
+
+
+ {{'core.date' | translate}}
+
+
+
@@ -154,9 +160,15 @@ {{ title | translate }}
-
+
+
+
+
+ {{'addon.calendar.durationuntil' | translate}}
+
+
+
diff --git a/src/addons/calendar/pages/edit-event/edit-event.ts b/src/addons/calendar/pages/edit-event/edit-event.ts
index 20e9d23f480..7eb187dc49d 100644
--- a/src/addons/calendar/pages/edit-event/edit-event.ts
+++ b/src/addons/calendar/pages/edit-event/edit-event.ts
@@ -45,7 +45,6 @@ import { CoreForms } from '@singletons/form';
import { CoreReminders, CoreRemindersService, CoreRemindersUnits } from '@features/reminders/services/reminders';
import { CoreRemindersSetReminderMenuComponent } from '@features/reminders/components/set-reminder-menu/set-reminder-menu';
import moment from 'moment-timezone';
-import { CoreAppProvider } from '@services/app';
/**
* Page that displays a form to create/edit an event.
@@ -61,7 +60,6 @@ export class AddonCalendarEditEventPage implements OnInit, OnDestroy, CanLeave {
@ViewChild('editEventForm') formElement!: ElementRef;
title = 'addon.calendar.newevent';
- dateFormat: string;
component = AddonCalendarProvider.COMPONENT;
loaded = false;
hasOffline = false;
@@ -78,7 +76,6 @@ export class AddonCalendarEditEventPage implements OnInit, OnDestroy, CanLeave {
eventId?: number;
maxDate: string;
minDate: string;
- displayTimezone?: string;
// Form variables.
form: FormGroup;
@@ -107,11 +104,6 @@ export class AddonCalendarEditEventPage implements OnInit, OnDestroy, CanLeave {
required: Translate.instant('core.required'),
};
- // Calculate format to use. ion-datetime doesn't support escaping characters ([]), so we remove them.
- this.dateFormat = CoreTimeUtils.convertPHPToMoment(Translate.instant('core.strftimedatetimeshort'))
- .replace(/[[\]]/g, '');
- this.displayTimezone = CoreAppProvider.getForcedTimezone();
-
this.form = new FormGroup({});
// Initialize form variables.
diff --git a/src/addons/mod/data/fields/date/component/addon-mod-data-field-date.html b/src/addons/mod/data/fields/date/component/addon-mod-data-field-date.html
index 596b8cf4973..5e2b2c81703 100644
--- a/src/addons/mod/data/fields/date/component/addon-mod-data-field-date.html
+++ b/src/addons/mod/data/fields/date/component/addon-mod-data-field-date.html
@@ -1,12 +1,18 @@
-
+
-
+
+
+
+
+
+
+
{{ 'addon.mod_data.usedate' | translate }}
-
+
diff --git a/src/addons/mod/data/fields/date/component/date.ts b/src/addons/mod/data/fields/date/component/date.ts
index 91e9c4041d3..bcda3ada62e 100644
--- a/src/addons/mod/data/fields/date/component/date.ts
+++ b/src/addons/mod/data/fields/date/component/date.ts
@@ -13,9 +13,7 @@
// limitations under the License.
import { Component } from '@angular/core';
-import { CoreAppProvider } from '@services/app';
import { CoreTimeUtils } from '@services/utils/time';
-import { Translate } from '@singletons';
import moment, { Moment } from 'moment-timezone';
import { AddonModDataFieldPluginBaseComponent } from '../../../classes/base-field-plugin-component';
@@ -28,11 +26,9 @@ import { AddonModDataFieldPluginBaseComponent } from '../../../classes/base-fiel
})
export class AddonModDataFieldDateComponent extends AddonModDataFieldPluginBaseComponent {
- format!: string;
displayDate?: number;
maxDate?: string;
minDate?: string;
- displayTimezone?: string;
/**
* @inheritdoc
@@ -48,23 +44,18 @@ export class AddonModDataFieldDateComponent extends AddonModDataFieldPluginBaseC
let momentInstance: Moment;
- // Calculate format to use.
- this.format = CoreTimeUtils.fixFormatForDatetime(CoreTimeUtils.convertPHPToMoment(
- Translate.instant('core.strftimedate'),
- ));
this.maxDate = CoreTimeUtils.getDatetimeDefaultMax();
this.minDate = CoreTimeUtils.getDatetimeDefaultMin();
- this.displayTimezone = CoreAppProvider.getForcedTimezone();
- if (this.searchMode) {
+ if (this.searchMode && this.searchFields) {
this.addControl('f_' + this.field.id + '_z');
- momentInstance = this.searchFields!['f_' + this.field.id + '_y']
- ? moment(this.searchFields!['f_' + this.field.id + '_y'] + '-' +
- this.searchFields!['f_' + this.field.id + '_m'] + '-' + this.searchFields!['f_' + this.field.id + '_d'])
+ momentInstance = this.searchFields['f_' + this.field.id + '_y']
+ ? moment(this.searchFields['f_' + this.field.id + '_y'] + '-' +
+ this.searchFields['f_' + this.field.id + '_m'] + '-' + this.searchFields['f_' + this.field.id + '_d'])
: moment();
- this.searchFields!['f_' + this.field.id] = CoreTimeUtils.toDatetimeFormat(momentInstance.unix() * 1000);
+ this.searchFields['f_' + this.field.id] = CoreTimeUtils.toDatetimeFormat(momentInstance.unix() * 1000);
} else {
momentInstance = this.value?.content
? moment(parseInt(this.value.content, 10) * 1000)
diff --git a/src/addons/userprofilefield/datetime/component/addon-user-profile-field-datetime.html b/src/addons/userprofilefield/datetime/component/addon-user-profile-field-datetime.html
index 8e2a2134944..af214ff513e 100644
--- a/src/addons/userprofilefield/datetime/component/addon-user-profile-field-datetime.html
+++ b/src/addons/userprofilefield/datetime/component/addon-user-profile-field-datetime.html
@@ -18,7 +18,12 @@
[courseId]="courseId" [wsNotFiltered]="true" />
-
+
+
+
+
+
+
+
diff --git a/src/addons/userprofilefield/datetime/component/datetime.ts b/src/addons/userprofilefield/datetime/component/datetime.ts
index c97a0400a39..c65fec86f71 100644
--- a/src/addons/userprofilefield/datetime/component/datetime.ts
+++ b/src/addons/userprofilefield/datetime/component/datetime.ts
@@ -19,10 +19,7 @@ import { CoreTimeUtils } from '@services/utils/time';
import { CoreUtils } from '@services/utils/utils';
import { AuthEmailSignupProfileField } from '@features/login/services/login-helper';
import { CoreUserProfileField } from '@features/user/services/user';
-import { Translate } from '@singletons';
import { CoreUserProfileFieldBaseComponent } from '@features/user/classes/base-profilefield-component';
-import { CoreLang } from '@services/lang';
-import { CoreAppProvider } from '@services/app';
/**
* Directive to render a datetime user profile field.
@@ -33,13 +30,11 @@ import { CoreAppProvider } from '@services/app';
})
export class AddonUserProfileFieldDatetimeComponent extends CoreUserProfileFieldBaseComponent {
- format?: string;
+ ionDateTimePresentation = 'date';
min?: string;
max?: string;
valueNumber?: number;
displayValue?: string;
- monthNames?: string[];
- displayTimezone?: string;
/**
* Init the data when the field is meant to be displayed without editing.
@@ -64,16 +59,11 @@ export class AddonUserProfileFieldDatetimeComponent extends CoreUserProfileField
protected initForEdit(field: AuthEmailSignupProfileField): void {
super.initForEdit(field);
- this.monthNames = CoreLang.getMonthNames();
- this.displayTimezone = CoreAppProvider.getForcedTimezone();
-
// Check if it's only date or it has time too.
const hasTime = CoreUtils.isTrueOrOne(field.param3);
// Calculate format to use.
- this.format = CoreTimeUtils.fixFormatForDatetime(CoreTimeUtils.convertPHPToMoment(
- Translate.instant('core.' + (hasTime ? 'strftimedatetime' : 'strftimedate')),
- ));
+ this.ionDateTimePresentation = hasTime ? 'date-time' : 'date';
// Check min value.
if (field.param1 && Number(field.param1)) {
diff --git a/src/core/components/input-errors/input-errors.scss b/src/core/components/input-errors/input-errors.scss
index 32cabaf50f7..0d73958b97a 100644
--- a/src/core/components/input-errors/input-errors.scss
+++ b/src/core/components/input-errors/input-errors.scss
@@ -1,7 +1,8 @@
:host {
- width: 100%;
-
+ display: contents;
.core-input-error-container {
+ width: 100%;
+
.core-input-error {
padding: 4px;
color: var(--danger);
diff --git a/src/core/components/sheet-modal/sheet-modal.scss b/src/core/components/sheet-modal/sheet-modal.scss
index b1170cfcd4d..ce18b284911 100644
--- a/src/core/components/sheet-modal/sheet-modal.scss
+++ b/src/core/components/sheet-modal/sheet-modal.scss
@@ -2,6 +2,7 @@
:host {
--backdrop-opacity: var(--ion-backdrop-opacity, 0.4);
+ --border-radius: var(--modal-radius);
width: 100%;
height: 100%;
@@ -17,7 +18,7 @@
}
.sheet-modal--wrapper {
- border-radius: var(--radius-lg) var(--radius-lg) 0 0;
+ border-radius: var(--border-radius) var(--border-radius) 0 0;
@include padding(24px, 16px, 24px, 16px);
background-color: var(--ion-overlay-background-color, var(--ion-background-color, #fff));
diff --git a/src/theme/theme.base.scss b/src/theme/theme.base.scss
index df1ac60eec3..31fbe0ba54e 100644
--- a/src/theme/theme.base.scss
+++ b/src/theme/theme.base.scss
@@ -518,7 +518,7 @@ ion-alert .alert-button.timed-button{
}
ion-alert {
- --border-radius: var(--radius-xl);
+ --border-radius: var(--modal-radius);
&.md, &.ios {
--max-width: 80%;
@@ -545,7 +545,7 @@ ion-alert {
}
ion-loading {
- --border-radius: var(--radius-xl);
+ --border-radius: var(--modal-radius);
.loading-wrapper {
border-radius: var(--border-radius) !important;
@@ -1917,6 +1917,9 @@ ion-modal {
--border-radius: var(--modal-radius);
}
}
+ &.ion-datetime-button-overlay {
+ --border-radius: var(--modal-radius);
+ }
&.core-modal-lateral,
&.core-modal-fullscreen {
@@ -1974,3 +1977,10 @@ ion-popover {
[hidden] {
display: none !important;
}
+
+// Ion Datetime
+ion-item.item-label-stacked ion-datetime-button {
+ margin-top: 8px;
+ margin-bottom: 8px;
+ align-self: self-end;
+}
diff --git a/upgrade.txt b/upgrade.txt
index 69a177f0b50..76fb4cca7e8 100644
--- a/upgrade.txt
+++ b/upgrade.txt
@@ -9,6 +9,7 @@ For more information about upgrading, read the official documentation: https://m
- Renamed CoreLoginSitesComponent to CoreLoginSitesModalComponent to make it clear that it's a modal and to avoid confusing it with the new CoreSitesListComponent.
- Removed CoreToLocaleStringPipe deprecated since 3.6.0
- With the upgrade to Ionic 7 ion-slides is no longer supported and now you need to use swiper-container and swiper-slide. More info here: https://ionicframework.com/docs/angular/slides
+ - With the upgrade to Ionic7 ion-datetime has changed its usage. We recommend using ion-datetime-button. More info here: https://ionicframework.com/docs/updating/6-0#datetime
=== 4.3.0 ===