@mythpe/quasar-ui-qui 0.4.13 → 0.4.15

package/package.json

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

package/src/fonts/Almarai/index.sass

@@ -0,0 +1,68 @@
+/*
+ * MyTh Ahmed Faiz Copyright © 2016-2024 All rights reserved.
+ * Email: mythpe@gmail.com
+ * Mobile: +966590470092
+ * Website: https://www.4myth.com
+ * Github: https://github.com/mythpe
+ */
+
+@font-face
+  font-family: 'Almarai'
+  src: url('./Almarai-Regular.ttf') format('truetype')
+  font-style: normal
+  font-display: swap
+
+@font-face
+  font-family: 'Almarai'
+  src: url('./Almarai-Light.ttf') format('truetype')
+  font-weight: 300
+  font-style: normal
+  font-display: swap
+
+
+@font-face
+  font-family: 'Almarai'
+  src: url('./Almarai-Regular.ttf') format('truetype')
+  font-weight: 400
+  font-style: normal
+  font-display: swap
+
+
+@font-face
+  font-family: 'Almarai'
+  src: url('./Almarai-Bold.ttf') format('truetype')
+  font-weight: 700
+  font-style: normal
+  font-display: swap
+
+
+@font-face
+  font-family: 'Almarai'
+  src: url('./Almarai-ExtraBold.ttf') format('truetype')
+  font-weight: 800
+  font-style: normal
+  font-display: swap
+
+
+.font-almarai
+  font-family: 'Almarai', sans-serif
+
+
+.almarai-light
+  font-family: 'Almarai', sans-serif
+  font-weight: 300
+
+
+.almarai-regular
+  font-family: 'Almarai', sans-serif
+  font-weight: 400
+
+
+.almarai-bold
+  font-family: 'Almarai', sans-serif
+  font-weight: 700
+
+
+.almarai-extrabold
+  font-family: 'Almarai', sans-serif
+  font-weight: 800

package/src/fonts/Noto_Kufi/index.sass

@@ -0,0 +1,149 @@
+/*
+ * MyTh Ahmed Faiz Copyright © 2016-2024 All rights reserved.
+ * Email: mythpe@gmail.com
+ * Mobile: +966590470092
+ * Website: https://www.4myth.com
+ * Github: https://github.com/mythpe
+ */
+
+$font-family: 'Noto Kufi Arabic', sans-serif
+
+@font-face
+  font-family: 'Noto Kufi Arabic'
+  src: url('./NotoKufiArabic-VariableFont_wght.ttf') format('truetype')
+  font-weight: 100 900
+  font-style: normal
+  font-display: swap
+  unicode-range: U+0600-06FF, U+0750-077F, U+08A0-08FF, U+FB50-FDFF, U+FE70-FEFF, U+1EE00-1EEFF
+
+@font-face
+  font-family: 'Noto Kufi Arabic'
+  src: url('./NotoKufiArabic-Thin.ttf') format('truetype')
+  font-weight: 100
+  font-style: normal
+  font-display: swap
+
+@font-face
+  font-family: 'Noto Kufi Arabic'
+  src: url('./NotoKufiArabic-ExtraLight.ttf') format('truetype')
+  font-weight: 200
+  font-style: normal
+  font-display: swap
+
+@font-face
+  font-family: 'Noto Kufi Arabic'
+  src: url('./NotoKufiArabic-Light.ttf') format('truetype')
+  font-weight: 300
+  font-style: normal
+  font-display: swap
+
+@font-face
+  font-family: 'Noto Kufi Arabic'
+  src: url('./NotoKufiArabic-Regular.ttf') format('truetype')
+  font-weight: 400
+  font-style: normal
+  font-display: swap
+
+@font-face
+  font-family: 'Noto Kufi Arabic'
+  src: url('./NotoKufiArabic-Medium.ttf') format('truetype')
+  font-weight: 500
+  font-style: normal
+  font-display: swap
+
+@font-face
+  font-family: 'Noto Kufi Arabic'
+  src: url('./NotoKufiArabic-SemiBold.ttf') format('truetype')
+  font-weight: 600
+  font-style: normal
+  font-display: swap
+
+@font-face
+  font-family: 'Noto Kufi Arabic'
+  src: url('./NotoKufiArabic-Bold.ttf') format('truetype')
+  font-weight: 700
+  font-style: normal
+  font-display: swap
+
+@font-face
+  font-family: 'Noto Kufi Arabic'
+  src: url('./NotoKufiArabic-ExtraBold.ttf') format('truetype')
+  font-weight: 800
+  font-style: normal
+  font-display: swap
+
+@font-face
+  font-family: 'Noto Kufi Arabic'
+  src: url('./NotoKufiArabic-Black.ttf') format('truetype')
+  font-weight: 900
+  font-style: normal
+  font-display: swap
+
+=noto-kufi($weight: 400)
+  font-family: $font-family
+  font-weight: $weight
+  font-feature-settings: 'calt' 1, 'liga' 1, 'kern' 1
+
+.noto-kufi
+  +noto-kufi(400)
+
+  &-thin
+    +noto-kufi(100)
+
+  &-extralight
+    +noto-kufi(200)
+
+  &-light
+    +noto-kufi(300)
+
+  &-regular
+    +noto-kufi(400)
+
+  &-medium
+    +noto-kufi(500)
+
+  &-semibold
+    +noto-kufi(600)
+
+  &-bold
+    +noto-kufi(700)
+
+  &-extrabold
+    +noto-kufi(800)
+
+  &-black
+    +noto-kufi(900)
+
+// $typography-font-family: $font-family !default
+//
+// [dir="rtl"],
+// [lang="ar"],
+// .ar-text
+//   +noto-kufi(400)
+//
+//   .q-btn,
+//   .q-field,
+//   .q-input,
+//   .q-select,
+//   .q-tab,
+//   .q-menu,
+//   .q-dialog,
+//   .q-table,
+//   .q-tooltip
+//     +noto-kufi(400)
+//
+//   .text-h1, .text-h2, .text-h3,
+//   .text-h4, .text-h5, .text-h6,
+//   .text-subtitle1, .text-subtitle2,
+//   .text-body1, .text-body2,
+//   .text-caption, .text-overline
+//     +noto-kufi()
+//
+//   .text-h1, .text-h2
+//     +noto-kufi(700)
+//
+//   .text-h3, .text-h4
+//     +noto-kufi(600)
+//
+//   .text-h5, .text-h6
+//     +noto-kufi(500)

package/src/fonts/Tajawal/index.sass

@@ -0,0 +1,79 @@
+/*
+ * MyTh Ahmed Faiz Copyright © 2016-2024 All rights reserved.
+ * Email: mythpe@gmail.com
+ * Mobile: +966590470092
+ * Website: https://www.4myth.com
+ * Github: https://github.com/mythpe
+ */
+
+@font-face
+  font-family: 'Tajawal'
+  src: url('./Tajawal-ExtraLight.ttf') format('truetype')
+  font-weight: 200
+  font-style: normal
+  font-display: swap
+
+@font-face
+  font-family: 'Tajawal'
+  src: url('./Tajawal-Light.ttf') format('truetype')
+  font-weight: 300
+  font-style: normal
+  font-display: swap
+
+@font-face
+  font-family: 'Tajawal'
+  src: url('./Tajawal-Regular.ttf') format('truetype')
+  font-weight: 400
+  font-style: normal
+  font-display: swap
+
+@font-face
+  font-family: 'Tajawal'
+  src: url('./Tajawal-Medium.ttf') format('truetype')
+  font-weight: 500
+  font-style: normal
+  font-display: swap
+
+@font-face
+  font-family: 'Tajawal'
+  src: url('./Tajawal-Bold.ttf') format('truetype')
+  font-weight: 700
+  font-style: normal
+  font-display: swap
+
+@font-face
+  font-family: 'Tajawal'
+  src: url('./Tajawal-ExtraBold.ttf') format('truetype')
+  font-weight: 800
+  font-style: normal
+  font-display: swap
+
+@font-face
+  font-family: 'Tajawal'
+  src: url('./Tajawal-Black.ttf') format('truetype')
+  font-weight: 900
+  font-style: normal
+  font-display: swap
+
+.font-almarai
+  font-family: 'Tajawal', sans-serif
+
+.tajawal-light
+  font-family: 'Tajawal', sans-serif
+  font-weight: 300
+
+.tajawal-regular
+  font-family: 'Tajawal', sans-serif
+  font-weight: 400
+
+.tajawal-bold
+  font-family: 'Tajawal', sans-serif
+  font-weight: 700
+
+.tajawal-extrabold
+  font-family: 'Tajawal', sans-serif
+  font-weight: 800
+
+.tajawal-black
+  font-family: 'Tajawal', sans-serif
+  font-weight: 900

package/src/fonts/index.sass

@@ -0,0 +1,10 @@
+/*
+ * MyTh Ahmed Faiz Copyright © 2016-2024 All rights reserved.
+ * Email: mythpe@gmail.com
+ * Mobile: +966590470092
+ * Website: https://www.4myth.com
+ * Github: https://github.com/mythpe
+ */
+@import './Almarai'
+@import './Noto_Kufi'
+@import './Tajawal'

package/src/index.sass

@@ -4,9 +4,11 @@
 // Website: https://www.4myth.com
 // Github: https://github.com/mythpe
 
-//@import 'quasar/src/css/variables.sass'
 @import './style/main'
+@import './style/brands'
 @import './style/ckeditor5'
+@import './style/effect'
+@import './style/fonts'
 @import './style/m-container'
 @import './style/m-dt'
 @import './style/m-help-row'
@@ -15,5 +17,8 @@
 @import './style/m-select'
 @import './style/m-toggle'
 @import './style/print'
+@import './style/sar-font.sass'
+@import './style/scrollbar'
 @import './style/transition'
 @import './style/typography'
+@import './fonts'

package/src/style/brands.sass

@@ -0,0 +1,46 @@
+/*!
+ / MyTh Ahmed Faiz Copyright © 2016-2025 All rights reserved.
+ / Email: mythpe@gmail.com
+ / Mobile: +966590470092
+ / Website: https://www.4myth.com
+ / Github: https://github.com/mythpe
+ /
+
+$myth-primary: #004E7B !default
+$myth-secondary: #C59C78 !default
+$body-light: #ffffff !default
+$body-dark: #111111 !default
+
+:root
+  --q-myth-primary: $myth-primary
+  --q-myth-secondary: $myth-secondary
+
+.body--light
+  --q-body: $body-light
+
+.body--dark
+  --q-body: $body-dark
+
+.text-myth-primary
+  color: var(--q-myth-primary) !important
+
+.bg-myth-primary
+  background: var(--q-myth-primary) !important
+
+.text-myth-secondary
+  color: var(--q-myth-secondary) !important
+
+.bg-myth-secondary
+  background: var(--q-myth-secondary) !important
+
+.text-body
+  color: var(--q-body) !important
+
+.bg-body
+  background: var(--q-body) !important
+
+.bg-on-primary
+  background: var(--q-on-primary) !important
+
+.text-on-primary
+  color: var(--q-on-primary) !important

package/src/style/ckeditor5.sass

@@ -1,3 +1,11 @@
+/*!
+ / MyTh Ahmed Faiz Copyright © 2016-2025 All rights reserved.
+ / Email: mythpe@gmail.com
+ / Mobile: +966590470092
+ / Website: https://www.4myth.com
+ / Github: https://github.com/mythpe
+ /
+
 //@import 'ckeditor5/ckeditor5.css' #{"/* rtl:ignore */"}
 
 :root

package/src/style/effect.sass

@@ -0,0 +1,143 @@
+/*!
+ / MyTh Ahmed Faiz Copyright © 2016-2025 All rights reserved.
+ / Email: mythpe@gmail.com
+ / Mobile: +966590470092
+ / Website: https://www.4myth.com
+ / Github: https://github.com/mythpe
+ /
+.effect-dissolve
+  opacity: 0
+  animation: dissolveEffect 2s ease-in-out infinite
+
+.effect-wave
+  animation: waveRevealEffect 3s ease-in-out infinite
+
+.effect-pixel
+  animation: pixelRevealEffect 2.5s ease-in-out infinite
+
+.effect-glitch
+  animation: glitchEffect 2s ease-in-out infinite
+
+.effect-morph
+  animation: morphEffect 3s cubic-bezier(0.23, 1, 0.32, 1) infinite
+
+.effect-pulse
+  animation: pulseEffect 2s ease-in-out infinite
+
+.effect-slide
+  animation: slideEffect 4s ease-in-out infinite
+
+.effect-breathe
+  animation: breatheEffect 3s ease-in-out infinite
+
+@keyframes dissolveEffect
+  0%
+    opacity: 0
+    filter: brightness(1.5) contrast(0.5)
+  50%
+    opacity: 1
+    filter: brightness(1) contrast(1)
+  100%
+    opacity: 0
+    filter: brightness(1.5) contrast(0.5)
+
+@keyframes waveRevealEffect
+  0%
+    opacity: 0
+    clip-path: polygon(0 0, 0 0, 0 100%, 0% 100%)
+  50%
+    opacity: 1
+    clip-path: polygon(0 0, 100% 0, 100% 100%, 0% 100%)
+  100%
+    opacity: 0
+    clip-path: polygon(0 0, 0 0, 0 100%, 0% 100%)
+
+
+@keyframes pixelRevealEffect
+  0%
+    opacity: 0
+    filter: contrast(0) brightness(2) blur(20px)
+    transform: scale(1.2)
+  50%
+    opacity: 1
+    filter: contrast(1) brightness(1) blur(0)
+    transform: scale(1)
+  100%
+    opacity: 0
+    filter: contrast(0) brightness(2) blur(20px)
+    transform: scale(1.2)
+
+
+@keyframes glitchEffect
+  0%
+    opacity: 1
+    filter: hue-rotate(0deg) contrast(1)
+    transform: translateX(0)
+  25%
+    opacity: 0.8
+    filter: hue-rotate(90deg) contrast(1.5)
+    transform: translateX(-5px)
+  50%
+    opacity: 1
+    filter: hue-rotate(180deg) contrast(1)
+    transform: translateX(5px)
+  75%
+    opacity: 0.8
+    filter: hue-rotate(270deg) contrast(1.5)
+    transform: translateX(-3px)
+  100%
+    opacity: 1
+    filter: hue-rotate(360deg) contrast(1)
+    transform: translateX(0)
+
+
+@keyframes morphEffect
+  0%
+    opacity: 0
+    filter: grayscale(100%) brightness(1.5) blur(20px)
+    transform: scale(0.8) rotate(-5deg)
+  50%
+    opacity: 1
+    filter: grayscale(0%) brightness(1) blur(0)
+    transform: scale(1) rotate(0deg)
+  100%
+    opacity: 0
+    filter: grayscale(100%) brightness(1.5) blur(20px)
+    transform: scale(0.8) rotate(5deg)
+
+
+@keyframes pulseEffect
+  0%
+    opacity: 0.3
+    transform: scale(0.95)
+  50%
+    opacity: 1
+    transform: scale(1)
+  100%
+    opacity: 0.3
+    transform: scale(0.95)
+
+@keyframes slideEffect
+  0%
+    opacity: 0
+    transform: translateX(-100%)
+  45%
+    opacity: 1
+    transform: translateX(0)
+  55%
+    opacity: 1
+    transform: translateX(0)
+  100%
+    opacity: 0
+    transform: translateX(100%)
+
+
+@keyframes breatheEffect
+  0%, 100%
+    opacity: 0.5
+    filter: brightness(0.8) saturate(0.8)
+    transform: scale(1)
+  50%
+    opacity: 1
+    filter: brightness(1.2) saturate(1.2)
+    transform: scale(1.02)

package/src/style/fonts.sass

@@ -0,0 +1,20 @@
+/*!
+ / MyTh Ahmed Faiz Copyright © 2016-2025 All rights reserved.
+ / Email: mythpe@gmail.com
+ / Mobile: +966590470092
+ / Website: https://www.4myth.com
+ / Github: https://github.com/mythpe
+ /
+
+:root
+  --q-font-family: #{$typography-font-family}
+
+.driver-popover *
+  font-family: var(--q-font-family)
+  font-feature-settings: "lnum" 0, "tnum" 0, "onum" 1 !important
+
+.font-ltr
+  font-family: var(--q-font-ltr) !important
+
+.font-rtl
+  font-family: var(--q-font-rtl) !important

package/src/style/m-container.sass

@@ -1,3 +1,11 @@
+/*!
+ / MyTh Ahmed Faiz Copyright © 2016-2025 All rights reserved.
+ / Email: mythpe@gmail.com
+ / Mobile: +966590470092
+ / Website: https://www.4myth.com
+ / Github: https://github.com/mythpe
+ /
+
 
 $m-container-padding: $space-base !default
 $m-container-fluid-width: 1440px !default

package/src/style/m-dt.sass

@@ -1,3 +1,11 @@
+/*!
+ / MyTh Ahmed Faiz Copyright © 2016-2025 All rights reserved.
+ / Email: mythpe@gmail.com
+ / Mobile: +966590470092
+ / Website: https://www.4myth.com
+ / Github: https://github.com/mythpe
+ /
+
 $m-control-max-width: 200px !default
 $m-dt-fixed-height: 80vh !default
 $m-dt-desc-width: 150px !default

package/src/style/m-help-row.sass

@@ -1,3 +1,11 @@
+/*!
+ / MyTh Ahmed Faiz Copyright © 2016-2025 All rights reserved.
+ / Email: mythpe@gmail.com
+ / Mobile: +966590470092
+ / Website: https://www.4myth.com
+ / Github: https://github.com/mythpe
+ /
+
 $m-help-row-margin-top: 4px !default
 
 .m-help-row

package/src/style/m-input.sass

@@ -1,3 +1,11 @@
+/*!
+ / MyTh Ahmed Faiz Copyright © 2016-2025 All rights reserved.
+ / Email: mythpe@gmail.com
+ / Mobile: +966590470092
+ / Website: https://www.4myth.com
+ / Github: https://github.com/mythpe
+ /
+
 $m-input-helpers-margin: 5px !default
 $radius-value: $generic-border-radius !default
 

package/src/style/m-picker.sass

@@ -1,3 +1,11 @@
+/*!
+ / MyTh Ahmed Faiz Copyright © 2016-2025 All rights reserved.
+ / Email: mythpe@gmail.com
+ / Mobile: +966590470092
+ / Website: https://www.4myth.com
+ / Github: https://github.com/mythpe
+ /
+
 .m-date__picker,
 .m-time__picker
   .q-date__calendar-item

package/src/style/m-select.sass

@@ -1,3 +1,11 @@
+/*!
+ / MyTh Ahmed Faiz Copyright © 2016-2025 All rights reserved.
+ / Email: mythpe@gmail.com
+ / Mobile: +966590470092
+ / Website: https://www.4myth.com
+ / Github: https://github.com/mythpe
+ /
+
 $m-select__popup-content: 300px !default
 
 .m-select__popup-content

package/src/style/m-toggle.sass

@@ -1,3 +1,11 @@
+/*!
+ / MyTh Ahmed Faiz Copyright © 2016-2025 All rights reserved.
+ / Email: mythpe@gmail.com
+ / Mobile: +966590470092
+ / Website: https://www.4myth.com
+ / Github: https://github.com/mythpe
+ /
+
 
 .m-toggle__col + .m-toggle__col
   padding-left: 10px

package/src/style/main.sass

@@ -1,3 +1,11 @@
+/*!
+ / MyTh Ahmed Faiz Copyright © 2016-2025 All rights reserved.
+ / Email: mythpe@gmail.com
+ / Mobile: +966590470092
+ / Website: https://www.4myth.com
+ / Github: https://github.com/mythpe
+ /
+
 @use 'sass:map'
 
 $m-row-margin-top: 1rem !default

package/src/style/print.sass

@@ -1,3 +1,11 @@
+/*!
+ / MyTh Ahmed Faiz Copyright © 2016-2025 All rights reserved.
+ / Email: mythpe@gmail.com
+ / Mobile: +966590470092
+ / Website: https://www.4myth.com
+ / Github: https://github.com/mythpe
+ /
+
 @media print
   .q-notifications
     display: none !important

package/src/style/sar-font.sass

@@ -0,0 +1,21 @@
+/*!
+ / MyTh Ahmed Faiz Copyright © 2025 All rights reserved.
+ / Email: mythpe@gmail.com
+ / Mobile: +966590470092
+ / Website: https://www.4myth.com
+ / Github: https://github.com/mythpe
+ /
+
+@font-face
+  font-family: SarIcon
+  font-style: normal
+  font-weight: 400
+  src: url("data:application/x-font-ttf;charset=utf-8;base64,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") format("truetype")
+  font-display: block
+
+.sar-icon
+  font-family: SarIcon, sans-serif !important
+  font-style: normal !important
+  font-weight: 400 !important
+  font-variant: normal !important
+  text-transform: none !important

package/src/style/scrollbar.sass

@@ -0,0 +1,37 @@
+/*!
+ / MyTh Ahmed Faiz Copyright © 2025 All rights reserved.
+ / Email: mythpe@gmail.com
+ / Mobile: +966590470092
+ / Website: https://www.4myth.com
+ / Github: https://github.com/mythpe
+ /
+
+$scrollbar-border-radius: 8px !default
+$scrollbar-width: 8px !default
+$scrollbar-height: 8px !default
+
+.body--dark
+  --q-scrollbar-thumb: var(--q-primary)
+  --q-scrollbar-track: #dddddd
+  --q-scrollbar-hover: var(--q-scrollbar-thumb)
+
+.body--light
+  --q-scrollbar-thumb: var(--q-primary)
+  --q-scrollbar-track: #dddddd
+  --q-scrollbar-hover: var(--q-scrollbar-thumb)
+
+::-webkit-scrollbar
+  width: $scrollbar-width
+  height: $scrollbar-width
+
+::-webkit-scrollbar-thumb
+  background-color: var(--q-scrollbar-thumb)
+  border-radius: $scrollbar-border-radius
+
+::-webkit-scrollbar-track
+  background-color: var(--q-scrollbar-track)
+  border-radius: $scrollbar-border-radius
+
+
+::-webkit-scrollbar-thumb:hover
+  background-color: var(--q-scrollbar-hover)

package/src/style/transition.sass

@@ -1,3 +1,11 @@
+/*!
+ / MyTh Ahmed Faiz Copyright © 2016-2025 All rights reserved.
+ / Email: mythpe@gmail.com
+ / Mobile: +966590470092
+ / Website: https://www.4myth.com
+ / Github: https://github.com/mythpe
+ /
+
 .myth-transition__fade-enter-from,
 .myth-transition__fade-leave-to
   opacity: 0

package/src/style/typography.sass

@@ -1,3 +1,11 @@
+/*!
+ / MyTh Ahmed Faiz Copyright © 2016-2025 All rights reserved.
+ / Email: mythpe@gmail.com
+ / Mobile: +966590470092
+ / Website: https://www.4myth.com
+ / Github: https://github.com/mythpe
+ /
+
 [dir="rtl"]
   body
     text-rendering: optimizeLegibility