@mythpe/quasar-ui-qui 0.1.55 → 0.1.57

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@mythpe/quasar-ui-qui",
-  "version": "0.1.55",
+  "version": "0.1.57",
   "description": "MyTh Quasar UI Kit App Extension",
   "author": {
     "name": "MyTh Ahmed Faiz",

package/src/components/datatable/MDatatable.vue

@@ -656,10 +656,7 @@ defineExpose({
                   :item="dialogItem"
                   name="title"
                 >
-                  <MCol
-                    v-if="!!getTableTitle"
-                    col="12"
-                  >
+                  <MCol col="12">
                     <div class="row justify-between q-col-gutter-md">
                       <div
                         v-if="!noBackBtn"
@@ -672,23 +669,24 @@ defineExpose({
                         />
                       </div>
                       <div class="col">
-                        <div class="text-h5 bordered-bottom ellipsis">
+                        <div
+                          class="text-h5 bordered-bottom ellipsis"
+                          v-if="!!getTableTitle"
+                        >
                           {{ getTableTitle }}
                         </div>
                       </div>
-
                       <!-- Add Btn -->
-                      <template
+                      <div
                         v-if="hasAddBtn && (addTopBtn===undefined?(pluginOptions.datatable?.addTopBtn===undefined?!0:pluginOptions.datatable?.addTopBtn):addTopBtn)"
+                        class="col-auto"
                       >
-                        <div class="col-auto">
-                          <MBtn
-                            :label="getFormTitle"
-                            no-caps
-                            @click="openCreateDialog()"
-                          />
-                        </div>
-                      </template>
+                        <MBtn
+                          :label="getFormTitle"
+                          no-caps
+                          @click="openCreateDialog()"
+                        />
+                      </div>
                     </div>
                   </MCol>
                 </slot>
@@ -1438,80 +1436,3 @@ defineExpose({
     </q-page-sticky>
   </div>
 </template>
-
-<style lang="sass">
-.touch
-  .m--datatable-fab-tooltip
-    display: none
-
-.body--light
-  .m--datatable
-    .q-table__top,
-    .q-table__bottom,
-    thead tr:first-child th
-      background: #fff
-
-.body--dark
-  .m--datatable
-    .q-table__top,
-    .q-table__bottom,
-    thead tr:first-child th
-      background: var(--q-dark-page)
-
-.m--datatable-component
-  .m--datatable.m--datatable-grid
-    .q-table__top
-      padding-left: 0
-      padding-right: 0
-
-  &__fab
-    margin-bottom: 12rem
-
-  &__fixed
-    thead tr th
-      position: sticky
-      z-index: 1
-
-    thead tr:first-child th
-      top: 0
-
-    .m--datatable:not(.m--datatable-grid)
-      max-height: 80vh
-
-    .m--datatable:not(.m--datatable-grid).q-table--dense
-      &.q-table--loading thead tr:last-child th
-        top: 26px
-
-      .m--datatable:not(.m--datatable-grid):not(.q-table--dense)
-        &.q-table--loading thead tr:last-child th
-          top: 55px
-
-  .q-table__bottom
-    justify-content: start !important
-
-    .q-table__separator.col
-      display: none !important
-
-  .q-table__top
-    align-items: center
-
-    .q-table__separator.col
-      display: none !important
-
-    .q-table__control:last-child
-      padding-left: 8px
-      display: block
-      flex: 10000 1 0
-      width: auto
-      min-width: 0
-      max-width: 100%
-
-.m--dialog-card
-  .q-card__actions
-    .q-btn
-      padding: 4px 16px !important
-
-.grid-style-transition
-  transition: transform .28s, background-color .28s
-
-</style>

package/src/index.sass

@@ -6,6 +6,8 @@
 
 //@import 'quasar/src/css/variables.sass'
 @import './style/ckeditor5.sass'
-@import './style/main.sass'
 @import './style/m-container.sass'
+@import './style/m-dt.sass'
+@import './style/main.sass'
 @import './style/print.sass'
+@import './style/transition'

package/src/style/ckeditor5.sass

@@ -1,8 +1,5 @@
 @import 'ckeditor5/ckeditor5.css' #{"/* rtl:ignore */"}
 
-$ck-z-dialog: 9999
-$ck-z-panel: calc(var(--ck-z-default) + var(--ck-z-dialog))
-
 :root
   --ck-z-dialog: 9999 !important
   --ck-z-panel: calc(var(--ck-z-default) + var(--ck-z-dialog)) !important

package/src/style/m-container.sass

@@ -1,4 +1,3 @@
-//@use "quasar/src/css/variables" as q
 
 $m--container-padding: $space-base !default
 $m--container-fluid-width: 1440px !default

package/src/style/m-dt.sass

@@ -0,0 +1,76 @@
+
+$fixed-dt-height: 80vh !default
+
+.touch
+  .m--datatable-fab-tooltip
+    display: none
+
+.body--light
+  .m--datatable
+    .q-table__top,
+    .q-table__bottom,
+    thead tr:first-child th
+      background: #fff
+
+.body--dark
+  .m--datatable
+    .q-table__top,
+    .q-table__bottom,
+    thead tr:first-child th
+      background: var(--q-dark-page)
+
+.m--datatable-component
+  .m--datatable.m--datatable-grid
+    .q-table__top
+      padding-left: 0
+      padding-right: 0
+
+  &__fab
+    margin-bottom: 12rem
+
+  &__fixed
+    thead tr th
+      position: sticky
+      z-index: 1
+
+    thead tr:first-child th
+      top: 0
+
+    .m--datatable:not(.m--datatable-grid)
+      max-height: $fixed-dt-height
+
+    .m--datatable:not(.m--datatable-grid).q-table--dense
+      &.q-table--loading thead tr:last-child th
+        top: 26px
+
+      .m--datatable:not(.m--datatable-grid):not(.q-table--dense)
+        &.q-table--loading thead tr:last-child th
+          top: 55px
+
+  .q-table__bottom
+    justify-content: start !important
+
+    .q-table__separator.col
+      display: none !important
+
+  .q-table__top
+    align-items: center
+
+    .q-table__separator.col
+      display: none !important
+
+    .q-table__control:last-child
+      padding-left: 8px
+      display: block
+      flex: 10000 1 0
+      width: auto
+      min-width: 0
+      max-width: 100%
+
+.m--dialog-card
+  .q-card__actions
+    .q-btn
+      padding: 4px 16px !important
+
+.grid-style-transition
+  transition: transform .28s, background-color .28s

package/src/style/main.sass

@@ -1,5 +1,4 @@
 @use 'sass:map'
-//@use "quasar/src/css/variables" as q
 
 $m--row-margin-top: 1rem !default
 $m--input-helpers-margin: 5px !default