@visns-studio/visns-components 4.5.5 → 4.5.7

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -340,8 +340,8 @@ function Navigation({
340
340
  <aside
341
341
  className={
342
342
  isOpen
343
- ? `${styles['aside--cms']}`
344
- : `${styles['aside--cms']} ${styles['aside--cms--open']}`
343
+ ? `${styles['aside--cms']} ${styles['aside--cms--open']}`
344
+ : `${styles['aside--cms']}`
345
345
  }
346
346
  >
347
347
  <div className={styles.logo}>
@@ -371,8 +371,8 @@ function Navigation({
371
371
  <button
372
372
  className={
373
373
  isOpen
374
- ? `${styles.mobmenu}`
375
- : `${styles.mobmenu} ${styles['mobmenu--open']}`
374
+ ? `${styles.mobmenu} ${styles['mobmenu--open']}`
375
+ : `${styles.mobmenu}`
376
376
  }
377
377
  onClick={() => setOpen(!isOpen)}
378
378
  >
@@ -214,3 +214,32 @@ select:not(:placeholder-shown) + .fi__span {
214
214
  background: var(--tertiary-color);
215
215
  font-weight: 300;
216
216
  }
217
+
218
+ @media (max-width: 1024px) {
219
+ body {
220
+ font-size: 85%;
221
+ }
222
+
223
+ .aside {
224
+ width: 100%;
225
+ transform: translateX(-2000px);
226
+ transition: all 0.55s cubic-bezier(0.25, 0.8, 0.25, 1);
227
+ will-change: transform;
228
+ z-index: 500;
229
+ }
230
+
231
+ .logincontainer {
232
+ margin-left: 0;
233
+ min-height: 100vh;
234
+ flex-grow: 1;
235
+ display: flex;
236
+ align-items: center;
237
+ justify-content: center;
238
+ align-content: center;
239
+ flex-wrap: wrap;
240
+ }
241
+
242
+ .login {
243
+ width: 95%;
244
+ }
245
+ }
@@ -31,6 +31,7 @@ function useConfig(setting, tabs, filters, setRowsSelected, tableSetting) {
31
31
  const [subnav, setSubnav] = useState(filters || []);
32
32
 
33
33
  useEffect(() => {
34
+ console.info(setting);
34
35
  setConfig({
35
36
  ajaxSetting: setting.ajaxSetting,
36
37
  form: setting.form,
@@ -186,8 +187,10 @@ function GenericIndex({ layout = 'full', setting, userProfile }) {
186
187
 
187
188
  const handleCheckboxUpdate = useCallback(async () => {
188
189
  try {
189
- const { data, method, message, url } =
190
- setting.functions.checkboxUpdate;
190
+ const { data, method, message, url } = setting?.functions
191
+ ?.checkboxUpdate
192
+ ? setting.functions.checkboxUpdate
193
+ : config.form.functions.checkboxUpdate;
191
194
  if (!Object.keys(rowsSelected).length) {
192
195
  toast.warning(message.warning);
193
196
  return;
@@ -316,6 +319,16 @@ function GenericIndex({ layout = 'full', setting, userProfile }) {
316
319
  </button>
317
320
  </div>
318
321
  )}
322
+ {config?.form?.functions?.checkboxUpdate && (
323
+ <div className={styles.polActions}>
324
+ <button
325
+ className={styles.btn}
326
+ onClick={handleCheckboxUpdate}
327
+ >
328
+ {config.form.functions.checkboxUpdate.label || 'Update'}
329
+ </button>
330
+ </div>
331
+ )}
319
332
  </>
320
333
  );
321
334
  }
@@ -575,3 +575,328 @@
575
575
  background: rgba(var(--tertiary-color-rgb), 1.05);
576
576
  }
577
577
  }
578
+
579
+ @media (max-width: 1600px) {
580
+ body {
581
+ font-size: 90%;
582
+ }
583
+
584
+ .grid {
585
+ width: 100%;
586
+ max-width: 1150px;
587
+ margin: 0 auto;
588
+ }
589
+ }
590
+
591
+ @media (max-width: 1024px) {
592
+ body {
593
+ font-size: 85%;
594
+ }
595
+
596
+ .app-container {
597
+ width: 100%;
598
+ min-height: 100vh;
599
+ }
600
+
601
+ .aside--cms {
602
+ width: 100%;
603
+ transform: translateX(-2000px);
604
+ transition: all 0.55s cubic-bezier(0.25, 0.8, 0.25, 1);
605
+ will-change: transform;
606
+ z-index: 600;
607
+ }
608
+
609
+ .aside--cms--open {
610
+ transform: translateX(0);
611
+ transition: all 0.55s cubic-bezier(0.25, 0.8, 0.25, 1);
612
+ }
613
+
614
+ .content .content-title .mobmenu {
615
+ display: block;
616
+ visibility: visible;
617
+ }
618
+
619
+ .mobmenu {
620
+ width: 60px;
621
+ height: 45px;
622
+ position: absolute;
623
+ margin: 0;
624
+ transform: rotate(0deg) scale(0.4);
625
+ transition: 0.5s ease-in-out;
626
+ cursor: pointer;
627
+ border: none;
628
+ outline: none;
629
+ background: none;
630
+ appearance: none;
631
+ top: 5px;
632
+ left: 5px;
633
+ z-index: 999;
634
+ }
635
+
636
+ .mobmenu span {
637
+ display: block;
638
+ position: absolute;
639
+ height: 5px;
640
+ width: 50%;
641
+ background: var(--secondary-color);
642
+ opacity: 1;
643
+ transform: rotate(0deg);
644
+ transition: 0.25s ease-in-out;
645
+ }
646
+
647
+ .mobmenu span:nth-child(even) {
648
+ left: 50%;
649
+ border-radius: 0 9px 9px 0;
650
+ }
651
+
652
+ .mobmenu span:nth-child(odd) {
653
+ left: 0px;
654
+ border-radius: 9px 0 0 9px;
655
+ }
656
+
657
+ .mobmenu span:nth-child(1),
658
+ .mobmenu span:nth-child(2) {
659
+ top: 0px;
660
+ }
661
+
662
+ .mobmenu span:nth-child(3),
663
+ .mobmenu span:nth-child(4) {
664
+ top: 18px;
665
+ }
666
+
667
+ .mobmenu span:nth-child(5),
668
+ .mobmenu span:nth-child(6) {
669
+ top: 36px;
670
+ }
671
+
672
+ .mobmenu--open span:nth-child(1),
673
+ .mobmenu--open span:nth-child(6) {
674
+ transform: rotate(45deg);
675
+ }
676
+
677
+ .mobmenu--open span:nth-child(2),
678
+ .mobmenu--open span:nth-child(5) {
679
+ transform: rotate(-45deg);
680
+ }
681
+
682
+ .mobmenu--open span:nth-child(1) {
683
+ left: 5px;
684
+ top: 7px;
685
+ }
686
+
687
+ .mobmenu--open span:nth-child(2) {
688
+ left: calc(50% - 5px);
689
+ top: 7px;
690
+ }
691
+
692
+ .mobmenu--open span:nth-child(3) {
693
+ left: -50%;
694
+ opacity: 0;
695
+ }
696
+
697
+ .mobmenu--open span:nth-child(4) {
698
+ left: 100%;
699
+ opacity: 0;
700
+ }
701
+
702
+ .mobmenu--open span:nth-child(5) {
703
+ left: 5px;
704
+ top: 29px;
705
+ }
706
+
707
+ .mobmenu--open span:nth-child(6) {
708
+ left: calc(50% - 5px);
709
+ top: 29px;
710
+ }
711
+
712
+ .content {
713
+ margin-left: 0;
714
+ }
715
+
716
+ .popup-content {
717
+ width: 90%;
718
+ }
719
+
720
+ .modalwrap .modal__header .modal__close {
721
+ padding: 5px;
722
+ }
723
+
724
+ .djobs {
725
+ flex-wrap: wrap;
726
+ }
727
+
728
+ .djobs__item {
729
+ width: 100%;
730
+ padding: 0.25rem 0.25rem;
731
+ }
732
+
733
+ .djobs__item--select {
734
+ flex-basis: 100%;
735
+ padding: 0.25rem 0.25rem;
736
+ }
737
+
738
+ .djobs__item--select select {
739
+ width: 100%;
740
+ cursor: pointer;
741
+ font-size: 0.95rem;
742
+ padding: 0.25rem 0.75rem;
743
+ }
744
+
745
+ .djobs__item--date {
746
+ flex-basis: 100%;
747
+ padding: 0.25rem 0.25rem;
748
+ }
749
+
750
+ .djobs__item--date input {
751
+ width: 100%;
752
+ cursor: pointer;
753
+ font-size: 0.95rem;
754
+ padding: 0.25rem 0.75rem !important;
755
+ }
756
+
757
+ .djobs__item--btns {
758
+ width: 100%;
759
+ margin-left: 0;
760
+ display: flex;
761
+ flex-wrap: nowrap;
762
+ }
763
+
764
+ .djobs__item--btns button {
765
+ width: 100%;
766
+ padding: 0.25rem 0.75rem;
767
+ font-size: 0.75rem;
768
+ margin-left: 5px;
769
+ }
770
+
771
+ .dassigned {
772
+ flex-wrap: wrap;
773
+ }
774
+
775
+ .dassigned__left {
776
+ flex: 100%;
777
+ display: flex;
778
+ flex-wrap: wrap;
779
+ flex-direction: column;
780
+ align-items: flex-start;
781
+ justify-content: flex-start;
782
+ min-height: auto;
783
+ height: auto;
784
+ margin-right: 0;
785
+ }
786
+
787
+ .dassigned__left h1 {
788
+ font-size: 0.85rem;
789
+ padding: 0.75rem;
790
+ }
791
+
792
+ .dassigned__right {
793
+ flex: 100%;
794
+ height: auto;
795
+ overflow-y: auto;
796
+ }
797
+
798
+ .dassigned__table {
799
+ width: 100%;
800
+ display: block;
801
+ }
802
+
803
+ .dassigned__table table tr td {
804
+ font-size: 0.75rem;
805
+ padding: 5px 5px 5px 5px;
806
+ }
807
+
808
+ .dassigned__emp {
809
+ width: 100%;
810
+ display: flex;
811
+ flex-wrap: wrap;
812
+ }
813
+
814
+ .dassigned__emp h2 {
815
+ font-size: 1rem;
816
+ display: flex;
817
+ flex-wrap: nowrap;
818
+ align-items: center;
819
+ width: 100%;
820
+ padding: 0.25rem;
821
+ background: rgba(var(--primary-color), 0.15);
822
+ margin: 0;
823
+ font-weight: bold;
824
+ border-bottom: 1px solid #e7e7e7;
825
+ }
826
+
827
+ .dassigned__emp h2 > div {
828
+ width: max-content;
829
+ margin-left: auto;
830
+ display: flex;
831
+ align-items: center;
832
+ flex-wrap: nowrap;
833
+ }
834
+
835
+ .dassigned__emp h2 > div small {
836
+ font-size: 0.7rem;
837
+ color: var(--paragraph-color);
838
+ font-weight: 300;
839
+ display: block;
840
+ padding-right: 5px;
841
+ }
842
+
843
+ .dassigned__emp h2 > div button {
844
+ display: flex;
845
+ align-items: center;
846
+ appearance: none;
847
+ border: none;
848
+ padding: 0;
849
+ margin: 0;
850
+ outline: none;
851
+ background: none;
852
+ }
853
+
854
+ .dassigned__emp h2 > div button svg {
855
+ width: 100%;
856
+ max-width: 28px;
857
+ height: auto;
858
+ }
859
+
860
+ .dassigned__emp h2 > div button .toff {
861
+ opacity: 0.5;
862
+ }
863
+ }
864
+
865
+ @media (max-width: 960px) {
866
+ .padding {
867
+ padding: 0.15rem;
868
+ }
869
+
870
+ .userdetails {
871
+ display: none;
872
+ visibility: hidden;
873
+ }
874
+
875
+ .subtitle h2 {
876
+ font-size: 1em;
877
+ line-height: 1.45;
878
+ }
879
+
880
+ .dashlist a {
881
+ width: 100%;
882
+ height: auto;
883
+ margin: 0.25rem 0 0.25rem 0;
884
+ padding: 0.65rem;
885
+ }
886
+
887
+ .dashlist a:nth-child(3n) {
888
+ margin: 0.25rem 0 0.25rem 0;
889
+ }
890
+
891
+ .dashlist a:nth-child(-n + 3) {
892
+ margin: 0.25rem 0 0.25rem 0;
893
+ }
894
+
895
+ .grid__subcontent {
896
+ flex: 100%;
897
+ }
898
+
899
+ .pagination {
900
+ padding: 0 1rem;
901
+ }
902
+ }
package/package.json CHANGED
@@ -14,7 +14,7 @@
14
14
  "axios": "^1.7.2",
15
15
  "dayjs": "^1.11.12",
16
16
  "file-saver": "^2.0.5",
17
- "framer-motion": "^11.3.8",
17
+ "framer-motion": "^11.3.18",
18
18
  "html-react-parser": "^5.1.12",
19
19
  "lodash": "^4.17.21",
20
20
  "lodash.debounce": "^4.0.8",
@@ -35,7 +35,7 @@
35
35
  "react-quill": "^2.0.0",
36
36
  "react-reveal": "^1.2.2",
37
37
  "react-select": "^5.8.0",
38
- "react-signature-pad-wrapper": "^4.0.1",
38
+ "react-signature-pad-wrapper": "^4.0.2",
39
39
  "react-slugify": "^4.0.1",
40
40
  "react-sortable-hoc": "^2.0.0",
41
41
  "react-to-print": "^2.15.1",
@@ -58,7 +58,7 @@
58
58
  "react-dom": "^17.0.1"
59
59
  },
60
60
  "name": "@visns-studio/visns-components",
61
- "version": "4.5.5",
61
+ "version": "4.5.7",
62
62
  "description": "Various packages to assist in the development of our Custom Applications.",
63
63
  "main": "index.js",
64
64
  "scripts": {