- improve test page;

- fix comment;

Author: JoaoFerreira-FrontEnd

core/src/components/datetime/datetime.tsx

@@ -2392,7 +2392,7 @@ export class Datetime implements ComponentInterface {
                         ...referenceParts,
                       });
 
-                      // multiple only needs date info, so we can wipe out other fields like time
+                      // Multiple only needs date info so we can wipe out other fields like time.
                       if (multiple) {
                         this.setActiveParts(referenceParts, isActive);
                       } else {

core/src/components/datetime/test/show-adjacent-days/index.html

@@ -161,31 +161,36 @@ <h2>Change firstDayOfWeek</h2>
               <span>FirstDayOfWeek: <span id="start-of-week">1</span></span>
             </div>
           </div>
+
+          <div class="grid-item">
+            <h2>DateTime format with IonChange Event (console)</h2>
+            <ion-datetime
+              id="default2"
+              show-adjacent-days="true"
+              locale="en-US"
+              value="2022-10-14T16:22:00.000Z"
+              presentation="date"
+            ></ion-datetime>
+          </div>
         </div>
-        <div>
-          <label for="presentation">Presentation</label>
-          <select id="presentation" onchange="changePresentation(event)">
-            <option value="date-time" selected>date-time</option>
-            <option value="time-date">time-date</option>
-            <option value="date">date</option>
-            <option value="time">time</option>
-          </select>
-          <label for="size">Size</label>
-          <select id="size" onchange="changeSize(event)">
-            <option value="fixed" selected>fixed</option>
-            <option value="cover">cover</option>
-          </select>
-          <br /><br />
-          <ion-datetime show-adjacent-days="true" id="display" value="2022-02-22T16:30:00"></ion-datetime>
+        <div class="grid">
+          <div class="grid-item">
+            <label for="presentation">Presentation</label>
+            <select id="presentation" onchange="changePresentation(event)">
+              <option value="date-time" selected>date-time</option>
+              <option value="time-date">time-date</option>
+              <option value="date">date</option>
+              <option value="time">time</option>
+            </select>
+            <label for="size">Size</label>
+            <select id="size" onchange="changeSize(event)">
+              <option value="fixed" selected>fixed</option>
+              <option value="cover">cover</option>
+            </select>
+            <br /><br />
+            <ion-datetime show-adjacent-days="true" id="display" value="2022-02-22T16:30:00"></ion-datetime>
+          </div>
         </div>
-
-        <ion-datetime
-          id="default2"
-          show-adjacent-days="true"
-          locale="en-US"
-          value="2022-10-14T16:22:00.000Z"
-          presentation="date"
-        ></ion-datetime>
       </ion-content>
     </ion-app>