fix(capacitor, main.ts): fix android builder, disable darkmode

android/app/capacitor.build.gradle

@@ -0,0 +1,22 @@
+// DO NOT EDIT THIS FILE! IT IS GENERATED EACH TIME "capacitor update" IS RUN
+
+android {
+  compileOptions {
+      sourceCompatibility JavaVersion.VERSION_21
+      targetCompatibility JavaVersion.VERSION_21
+  }
+}
+
+apply from: "../capacitor-cordova-android-plugins/cordova.variables.gradle"
+dependencies {
+    implementation project(':capacitor-app')
+    implementation project(':capacitor-haptics')
+    implementation project(':capacitor-keyboard')
+    implementation project(':capacitor-status-bar')
+
+}
+
+
+if (hasProperty('postBuildExtras')) {
+  postBuildExtras()
+}

android/capacitor.settings.gradle

@@ -0,0 +1,15 @@
+// DO NOT EDIT THIS FILE! IT IS GENERATED EACH TIME "capacitor update" IS RUN
+include ':capacitor-android'
+project(':capacitor-android').projectDir = new File('../node_modules/@capacitor/android/capacitor')
+
+include ':capacitor-app'
+project(':capacitor-app').projectDir = new File('../node_modules/@capacitor/app/android')
+
+include ':capacitor-haptics'
+project(':capacitor-haptics').projectDir = new File('../node_modules/@capacitor/haptics/android')
+
+include ':capacitor-keyboard'
+project(':capacitor-keyboard').projectDir = new File('../node_modules/@capacitor/keyboard/android')
+
+include ':capacitor-status-bar'
+project(':capacitor-status-bar').projectDir = new File('../node_modules/@capacitor/status-bar/android')

src/main.ts

@@ -29,7 +29,7 @@ import '@ionic/vue/css/display.css';
 
 /* @import '@ionic/vue/css/palettes/dark.always.css'; */
 /* @import '@ionic/vue/css/palettes/dark.class.css'; */
-import '@ionic/vue/css/palettes/dark.system.css';
+// import '@ionic/vue/css/palettes/dark.system.css';
 
 /* Theme variables */
 import './theme/variables.css';

src/views/product/ProductListPage.vue

@@ -4,7 +4,7 @@
     <div class="bg-neutral-900 shallow-bow">
     </div>
     <ion-content class="bg-transparent">
-      <div class="h-max min-h-full">
+      <div class="h-max min-h-full mt-4">
         <div class="p-4">
           <div class="flex flex-col items-center aspect-auto mt-4">
             <img src="@/assets/images/Logo-KDM-merah.png" alt="Logo KDM" class="w-[20%]">

src/views/product/ProductSerialPage.vue

@@ -4,7 +4,7 @@
     <div class="bg-red-500 shallow-bow">
     </div>
     <ion-content class="bg-transparent">
-      <div class="h-max min-h-full">
+      <div class="h-max min-h-full mt-4">
         <div class="p-4">
           <div class="flex items-center justify-between w-full aspect-auto mb-6 mt-4">
             <div class="flex items-center gap-4">
@@ -48,7 +48,7 @@
               class="h-full aspect-square rounded-full bg-white flex items-center justify-center p-2 absolute left-0">
               <img src="@/assets/images/KDM.png" alt="Logo KDM small" class="h-full">
             </div>
-            <div class="flex-1 text-xl text-center font-semibold p-3">LOGIN DASHBOARD</div>
+            <div class="flex-1 text-xl text-center font-semibold p-3 dark:text-red-500">LOGIN DASHBOARD</div>
           </div>
         </ion-card>
         <AppFooter color="white" />