title: ion-datetime not displaying like a full calendar
body: <p>I'm new with ionic development and I'm having issues with the ion-datetime component. According to the documentation, the component should be showing like <a href="https://i.stack.imgur.com/YKpSN.png" rel="nofollow noreferrer">this</a>. But when I put it in the app it shows like <a href="https://i.stack.imgur.com/eBjzF.png" rel="nofollow noreferrer">this</a>.</p>
  <p>I've been messing around with the properties but it still shows the datetime like a bottom picker instead of a full calendar. The page where I need the datetime is shown as a modal, but I get the same result if put it in a normal page.</p>
  <p>Here what my ionic info shows</p>
  <pre><code>Ionic:
  
     Ionic CLI                     : 6.18.1 
     Ionic Framework               : @ionic/angular 5.9.1
     @angular-devkit/build-angular : 12.1.4
     @angular-devkit/schematics    : 12.1.4
     @angular/cli                  : 12.1.4
     @ionic/angular-toolkit        : 4.0.0
  
  Capacitor:
  
     Capacitor CLI      : 3.3.2
     @capacitor/android : 3.3.3
     @capacitor/core    : 3.3.2
     @capacitor/ios     : 3.3.3
  
  Utility:
  
     cordova-res : not installed globally
     native-run  : 1.5.0
  
  System:
  
     NodeJS : v14.16.0 
     npm    : 6.14.11
     OS     : Windows 10
  </code></pre>