@wizishop/angular-components 0.0.237 → 0.0.241
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.
- package/angular-components.scss +611 -315
- package/bundles/wizishop-angular-components.umd.js +40 -8
- package/bundles/wizishop-angular-components.umd.js.map +1 -1
- package/bundles/wizishop-angular-components.umd.min.js +1 -1
- package/bundles/wizishop-angular-components.umd.min.js.map +1 -1
- package/esm2015/lib/components/button/button.component.js +4 -2
- package/esm2015/lib/components/switch/switch.component.js +40 -9
- package/fesm2015/wizishop-angular-components.js +41 -9
- package/fesm2015/wizishop-angular-components.js.map +1 -1
- package/lib/components/button/button.component.d.ts +1 -0
- package/lib/components/switch/switch.component.d.ts +13 -3
- package/package.json +1 -1
- package/wizishop-angular-components-0.0.241.tgz +0 -0
- package/wizishop-angular-components.metadata.json +1 -1
- package/wizishop-angular-components-0.0.237.tgz +0 -0
package/angular-components.scss
CHANGED
|
@@ -7,7 +7,7 @@ $wac-table-background-color: #fafafa!default;
|
|
|
7
7
|
$wac-bleu-color: #52aecd!default;
|
|
8
8
|
$wac-red-color: #ff1800!default;
|
|
9
9
|
$wac-border-color: #cfd4e4!default;
|
|
10
|
-
$wac-border-form: #
|
|
10
|
+
$wac-border-form: #DEE2ED!default;
|
|
11
11
|
$wac-border-light: #cfd4e4!default;
|
|
12
12
|
$wac-color-loader2: #a2c739!default;
|
|
13
13
|
$wac-color-loader: #4baed0!default;
|
|
@@ -534,97 +534,241 @@ $wac-subtitle-color: #7A87A1!default;
|
|
|
534
534
|
}
|
|
535
535
|
}
|
|
536
536
|
}
|
|
537
|
-
.
|
|
537
|
+
.wac-search {
|
|
538
538
|
width: 100%;
|
|
539
|
+
min-height: 50px;
|
|
540
|
+
border-radius: 3px;
|
|
541
|
+
background-color: $wac-white;
|
|
542
|
+
position: relative;
|
|
543
|
+
z-index: 2;
|
|
544
|
+
border: 1px solid $wac-border-light;
|
|
545
|
+
transition: 0.3s ease;
|
|
546
|
+
&.open {
|
|
547
|
+
border-color: $wac-wizishop-blue;
|
|
548
|
+
}
|
|
539
549
|
&__wrapper {
|
|
550
|
+
position: relative;
|
|
540
551
|
display: flex;
|
|
541
|
-
|
|
542
|
-
align-items:
|
|
543
|
-
|
|
544
|
-
|
|
552
|
+
justify-content: space-between;
|
|
553
|
+
align-items: stretch;
|
|
554
|
+
align-content: stretch;
|
|
555
|
+
flex-wrap: nowrap;
|
|
556
|
+
width: 100%;
|
|
557
|
+
min-height: 50px;
|
|
558
|
+
@include media('<tablet') {
|
|
559
|
+
padding: 0 12px;
|
|
560
|
+
}
|
|
561
|
+
input {
|
|
562
|
+
background: transparent;
|
|
563
|
+
border: none;
|
|
564
|
+
color: $wac-main-text;
|
|
565
|
+
font-size: rem(14);
|
|
566
|
+
height: 50px;
|
|
567
|
+
line-height: 50px;
|
|
568
|
+
padding: 0 20px 0 48px;
|
|
569
|
+
font-weight: 400;
|
|
545
570
|
width: 100%;
|
|
546
|
-
|
|
547
|
-
|
|
548
|
-
justify-content: space-between;
|
|
549
|
-
padding: 10px 20px;
|
|
550
|
-
background-color: $wac-gray-background;
|
|
551
|
-
margin: 0 0 10px;
|
|
552
|
-
> p {
|
|
553
|
-
display: flex;
|
|
554
|
-
align-items: center;
|
|
555
|
-
white-space: nowrap;
|
|
556
|
-
font-size: rem(16);
|
|
557
|
-
line-height: rem(19);
|
|
558
|
-
font-weight: 500;
|
|
571
|
+
@include media('<tablet') {
|
|
572
|
+
padding: 0 0 0 10px;
|
|
559
573
|
}
|
|
560
|
-
|
|
561
|
-
|
|
562
|
-
|
|
563
|
-
|
|
564
|
-
|
|
565
|
-
|
|
566
|
-
|
|
567
|
-
@include media('>=1024px') {
|
|
568
|
-
display: none;
|
|
569
|
-
}
|
|
574
|
+
&::-webkit-input-placeholder {
|
|
575
|
+
/* Chrome/Opera/Safari */
|
|
576
|
+
color: $wac-multiple-search-input-color;
|
|
577
|
+
opacity: 1;
|
|
578
|
+
font-weight: 400;
|
|
579
|
+
@include media('<tablet') {
|
|
580
|
+
font-size: rem(11);
|
|
570
581
|
}
|
|
571
|
-
|
|
572
|
-
|
|
573
|
-
|
|
574
|
-
|
|
575
|
-
|
|
582
|
+
}
|
|
583
|
+
&::-moz-placeholder {
|
|
584
|
+
/* Firefox 19+ */
|
|
585
|
+
color: $wac-multiple-search-input-color;
|
|
586
|
+
opacity: 1;
|
|
587
|
+
font-weight: 400;
|
|
588
|
+
@include media('<tablet') {
|
|
589
|
+
font-size: rem(11);
|
|
590
|
+
}
|
|
591
|
+
}
|
|
592
|
+
&:-ms-input-placeholder {
|
|
593
|
+
/* IE 10+ */
|
|
594
|
+
color: $wac-multiple-search-input-color;
|
|
595
|
+
opacity: 1;
|
|
596
|
+
font-weight: 400;
|
|
597
|
+
@include media('<tablet') {
|
|
598
|
+
font-size: rem(11);
|
|
599
|
+
}
|
|
600
|
+
}
|
|
601
|
+
&:-moz-placeholder {
|
|
602
|
+
/* Firefox 18- */
|
|
603
|
+
color: $wac-multiple-search-input-color;
|
|
604
|
+
opacity: 1;
|
|
605
|
+
font-weight: 400;
|
|
606
|
+
@include media('<tablet') {
|
|
607
|
+
font-size: rem(11);
|
|
608
|
+
}
|
|
609
|
+
}
|
|
610
|
+
&:focus {
|
|
611
|
+
& + button i {
|
|
612
|
+
color: $wac-main-text;
|
|
613
|
+
}
|
|
614
|
+
&::-webkit-input-placeholder {
|
|
615
|
+
/* Chrome/Opera/Safari */
|
|
616
|
+
color: $wac-white;
|
|
617
|
+
opacity: 1;
|
|
618
|
+
}
|
|
619
|
+
&::-moz-placeholder {
|
|
620
|
+
/* Firefox 19+ */
|
|
621
|
+
color: $wac-white;
|
|
622
|
+
opacity: 1;
|
|
623
|
+
}
|
|
624
|
+
&:-ms-input-placeholder {
|
|
625
|
+
/* IE 10+ */
|
|
626
|
+
color: $wac-white;
|
|
627
|
+
opacity: 1;
|
|
628
|
+
}
|
|
629
|
+
&:-moz-placeholder {
|
|
630
|
+
/* Firefox 18- */
|
|
631
|
+
color: $wac-white;
|
|
632
|
+
opacity: 1;
|
|
576
633
|
}
|
|
577
|
-
|
|
578
634
|
}
|
|
579
|
-
|
|
580
635
|
}
|
|
581
|
-
|
|
636
|
+
button {
|
|
637
|
+
display: flex;
|
|
638
|
+
align-items: center;
|
|
639
|
+
align-content: center;
|
|
640
|
+
justify-content: center;
|
|
641
|
+
width: 18px;
|
|
642
|
+
height: 18px;
|
|
643
|
+
border-radius: 3px;
|
|
644
|
+
position: absolute;
|
|
645
|
+
left: 20px;
|
|
646
|
+
top: 50%;
|
|
647
|
+
transform: translateY(-50%);
|
|
648
|
+
border: none;
|
|
649
|
+
cursor: pointer;
|
|
650
|
+
background-color: $wac-white;
|
|
651
|
+
i {
|
|
652
|
+
font-size: rem(18);
|
|
653
|
+
color: $wac-color-icon-search-multiple-search;
|
|
654
|
+
transition: 0.3s ease;
|
|
655
|
+
}
|
|
656
|
+
&:hover {
|
|
657
|
+
i {
|
|
658
|
+
color: $wac-wizishop-blue !important;
|
|
659
|
+
}
|
|
660
|
+
}
|
|
661
|
+
}
|
|
662
|
+
}
|
|
663
|
+
&__absolute {
|
|
664
|
+
position: absolute;
|
|
665
|
+
top: 100%;
|
|
666
|
+
margin-top: rem(14);
|
|
667
|
+
left: -1px;
|
|
668
|
+
width: auto;
|
|
669
|
+
min-width: calc(100% - 38px);
|
|
670
|
+
max-width: calc(100% + 2px);
|
|
671
|
+
border: 1px solid $wac-border-light;
|
|
672
|
+
border-radius: 3px;
|
|
673
|
+
display: flex;
|
|
674
|
+
flex-direction: column;
|
|
675
|
+
justify-content: flex-start;
|
|
676
|
+
align-items: flex-start;
|
|
677
|
+
background-color: $wac-white;
|
|
678
|
+
max-height: 260px;
|
|
679
|
+
height: auto;
|
|
680
|
+
visibility: visible;
|
|
681
|
+
opacity: 1;
|
|
682
|
+
box-shadow: 3px 3px 20px $wac-select-box-shadow;
|
|
683
|
+
padding: 10px;
|
|
684
|
+
&.hidden {
|
|
685
|
+
visibility: hidden;
|
|
686
|
+
opacity: 0;
|
|
687
|
+
& > * {
|
|
688
|
+
opacity: 0;
|
|
689
|
+
transition: 0s;
|
|
690
|
+
}
|
|
691
|
+
}
|
|
692
|
+
.ps {
|
|
693
|
+
max-height: 240px;
|
|
694
|
+
}
|
|
695
|
+
&.open,
|
|
696
|
+
&.open.hidden {
|
|
697
|
+
position: relative;
|
|
698
|
+
left: auto;
|
|
699
|
+
top: 0;
|
|
700
|
+
transform: translateX(-1px);
|
|
701
|
+
visibility: visible;
|
|
702
|
+
opacity: 1;
|
|
703
|
+
& > * {
|
|
704
|
+
opacity: 1;
|
|
705
|
+
transition: 0s;
|
|
706
|
+
}
|
|
707
|
+
}
|
|
708
|
+
&__item {
|
|
582
709
|
width: 100%;
|
|
710
|
+
font-size: rem(14);
|
|
711
|
+
line-height: rem(30);
|
|
712
|
+
cursor: pointer;
|
|
713
|
+
transition: 0.3s ease;
|
|
714
|
+
position: relative;
|
|
583
715
|
display: flex;
|
|
584
|
-
flex-wrap: wrap;
|
|
585
|
-
align-items: flex-start;
|
|
586
|
-
align-content: flex-start;
|
|
587
716
|
justify-content: flex-start;
|
|
588
|
-
|
|
589
|
-
|
|
590
|
-
|
|
591
|
-
|
|
592
|
-
|
|
593
|
-
color: $wac-second-color;
|
|
594
|
-
height: rem(40);
|
|
717
|
+
align-content: center;
|
|
718
|
+
align-items: center;
|
|
719
|
+
color: $wac-second-color;
|
|
720
|
+
> div {
|
|
721
|
+
width: 100%;
|
|
595
722
|
display: flex;
|
|
596
|
-
justify-content: center;
|
|
597
723
|
align-items: center;
|
|
598
|
-
|
|
599
|
-
|
|
600
|
-
|
|
601
|
-
|
|
602
|
-
|
|
603
|
-
|
|
604
|
-
|
|
605
|
-
|
|
606
|
-
|
|
607
|
-
|
|
608
|
-
|
|
609
|
-
|
|
610
|
-
|
|
611
|
-
|
|
612
|
-
|
|
613
|
-
|
|
614
|
-
|
|
724
|
+
align-content: center;
|
|
725
|
+
}
|
|
726
|
+
.icon {
|
|
727
|
+
width: 24px;
|
|
728
|
+
margin: 0 10px 0 0;
|
|
729
|
+
height: auto;
|
|
730
|
+
max-height: 24px;
|
|
731
|
+
}
|
|
732
|
+
&:not(:last-child) {
|
|
733
|
+
margin: 0 0 rem(10);
|
|
734
|
+
}
|
|
735
|
+
&:empty {
|
|
736
|
+
display: none;
|
|
737
|
+
}
|
|
738
|
+
&:first-child {
|
|
739
|
+
border-width: 1px 0 1px;
|
|
740
|
+
}
|
|
741
|
+
&:hover,
|
|
742
|
+
&:focus {
|
|
743
|
+
background-color: $wac-gray-background;
|
|
744
|
+
color: $wac-main-text;
|
|
745
|
+
}
|
|
746
|
+
> div {
|
|
747
|
+
padding: 0 10px;
|
|
748
|
+
&.selected {
|
|
749
|
+
background-color: $wac-gray-background;
|
|
615
750
|
color: $wac-main-text;
|
|
616
|
-
> i {
|
|
617
|
-
max-width: unset;
|
|
618
|
-
margin: 0 0 0 10px;
|
|
619
|
-
}
|
|
620
|
-
}
|
|
621
|
-
&:first-child {
|
|
622
|
-
margin-left: 18px;
|
|
623
751
|
}
|
|
624
752
|
}
|
|
625
753
|
}
|
|
754
|
+
&__empty {
|
|
755
|
+
display: flex;
|
|
756
|
+
width: 100%;
|
|
757
|
+
justify-content: center;
|
|
758
|
+
align-items: center;
|
|
759
|
+
padding: 10px;
|
|
760
|
+
span {
|
|
761
|
+
font-size: rem(16);
|
|
762
|
+
font-weight: 400;
|
|
763
|
+
text-align: center;
|
|
764
|
+
color: $wac-second-color;
|
|
765
|
+
display: inline-block;
|
|
766
|
+
line-height: rem(25);
|
|
767
|
+
}
|
|
768
|
+
}
|
|
626
769
|
}
|
|
627
|
-
}
|
|
770
|
+
}
|
|
771
|
+
.wac-alert-popup {
|
|
628
772
|
.alert {
|
|
629
773
|
z-index: 999999;
|
|
630
774
|
position: fixed;
|
|
@@ -846,241 +990,97 @@ $wac-subtitle-color: #7A87A1!default;
|
|
|
846
990
|
}
|
|
847
991
|
|
|
848
992
|
}
|
|
849
|
-
.
|
|
993
|
+
.selected-list {
|
|
850
994
|
width: 100%;
|
|
851
|
-
min-height: 50px;
|
|
852
|
-
border-radius: 3px;
|
|
853
|
-
background-color: $wac-white;
|
|
854
|
-
position: relative;
|
|
855
|
-
z-index: 2;
|
|
856
|
-
border: 1px solid $wac-border-light;
|
|
857
|
-
transition: 0.3s ease;
|
|
858
|
-
&.open {
|
|
859
|
-
border-color: $wac-wizishop-blue;
|
|
860
|
-
}
|
|
861
995
|
&__wrapper {
|
|
862
|
-
position: relative;
|
|
863
996
|
display: flex;
|
|
864
|
-
|
|
865
|
-
align-items:
|
|
866
|
-
|
|
867
|
-
|
|
868
|
-
width: 100%;
|
|
869
|
-
min-height: 50px;
|
|
870
|
-
@include media('<tablet') {
|
|
871
|
-
padding: 0 12px;
|
|
872
|
-
}
|
|
873
|
-
input {
|
|
874
|
-
background: transparent;
|
|
875
|
-
border: none;
|
|
876
|
-
color: $wac-main-text;
|
|
877
|
-
font-size: rem(14);
|
|
878
|
-
height: 50px;
|
|
879
|
-
line-height: 50px;
|
|
880
|
-
padding: 0 20px 0 48px;
|
|
881
|
-
font-weight: 400;
|
|
997
|
+
flex-direction: column;
|
|
998
|
+
align-items: flex-start;
|
|
999
|
+
justify-content: flex-start;
|
|
1000
|
+
&__head {
|
|
882
1001
|
width: 100%;
|
|
883
|
-
|
|
884
|
-
padding: 0 0 0 10px;
|
|
885
|
-
}
|
|
886
|
-
&::-webkit-input-placeholder {
|
|
887
|
-
/* Chrome/Opera/Safari */
|
|
888
|
-
color: $wac-multiple-search-input-color;
|
|
889
|
-
opacity: 1;
|
|
890
|
-
font-weight: 400;
|
|
891
|
-
@include media('<tablet') {
|
|
892
|
-
font-size: rem(11);
|
|
893
|
-
}
|
|
894
|
-
}
|
|
895
|
-
&::-moz-placeholder {
|
|
896
|
-
/* Firefox 19+ */
|
|
897
|
-
color: $wac-multiple-search-input-color;
|
|
898
|
-
opacity: 1;
|
|
899
|
-
font-weight: 400;
|
|
900
|
-
@include media('<tablet') {
|
|
901
|
-
font-size: rem(11);
|
|
902
|
-
}
|
|
903
|
-
}
|
|
904
|
-
&:-ms-input-placeholder {
|
|
905
|
-
/* IE 10+ */
|
|
906
|
-
color: $wac-multiple-search-input-color;
|
|
907
|
-
opacity: 1;
|
|
908
|
-
font-weight: 400;
|
|
909
|
-
@include media('<tablet') {
|
|
910
|
-
font-size: rem(11);
|
|
911
|
-
}
|
|
912
|
-
}
|
|
913
|
-
&:-moz-placeholder {
|
|
914
|
-
/* Firefox 18- */
|
|
915
|
-
color: $wac-multiple-search-input-color;
|
|
916
|
-
opacity: 1;
|
|
917
|
-
font-weight: 400;
|
|
918
|
-
@include media('<tablet') {
|
|
919
|
-
font-size: rem(11);
|
|
920
|
-
}
|
|
921
|
-
}
|
|
922
|
-
&:focus {
|
|
923
|
-
& + button i {
|
|
924
|
-
color: $wac-main-text;
|
|
925
|
-
}
|
|
926
|
-
&::-webkit-input-placeholder {
|
|
927
|
-
/* Chrome/Opera/Safari */
|
|
928
|
-
color: $wac-white;
|
|
929
|
-
opacity: 1;
|
|
930
|
-
}
|
|
931
|
-
&::-moz-placeholder {
|
|
932
|
-
/* Firefox 19+ */
|
|
933
|
-
color: $wac-white;
|
|
934
|
-
opacity: 1;
|
|
935
|
-
}
|
|
936
|
-
&:-ms-input-placeholder {
|
|
937
|
-
/* IE 10+ */
|
|
938
|
-
color: $wac-white;
|
|
939
|
-
opacity: 1;
|
|
940
|
-
}
|
|
941
|
-
&:-moz-placeholder {
|
|
942
|
-
/* Firefox 18- */
|
|
943
|
-
color: $wac-white;
|
|
944
|
-
opacity: 1;
|
|
945
|
-
}
|
|
946
|
-
}
|
|
947
|
-
}
|
|
948
|
-
button {
|
|
1002
|
+
min-height: rem(60);
|
|
949
1003
|
display: flex;
|
|
950
|
-
|
|
951
|
-
|
|
952
|
-
|
|
953
|
-
|
|
954
|
-
|
|
955
|
-
|
|
956
|
-
|
|
957
|
-
|
|
958
|
-
|
|
959
|
-
|
|
960
|
-
|
|
961
|
-
cursor: pointer;
|
|
962
|
-
background-color: $wac-white;
|
|
963
|
-
i {
|
|
964
|
-
font-size: rem(18);
|
|
965
|
-
color: $wac-color-icon-search-multiple-search;
|
|
966
|
-
transition: 0.3s ease;
|
|
1004
|
+
justify-content: space-between;
|
|
1005
|
+
padding: 10px 20px;
|
|
1006
|
+
background-color: $wac-gray-background;
|
|
1007
|
+
margin: 0 0 10px;
|
|
1008
|
+
> p {
|
|
1009
|
+
display: flex;
|
|
1010
|
+
align-items: center;
|
|
1011
|
+
white-space: nowrap;
|
|
1012
|
+
font-size: rem(16);
|
|
1013
|
+
line-height: rem(19);
|
|
1014
|
+
font-weight: 500;
|
|
967
1015
|
}
|
|
968
|
-
|
|
969
|
-
|
|
970
|
-
|
|
1016
|
+
|
|
1017
|
+
&__button {
|
|
1018
|
+
height: rem(40);
|
|
1019
|
+
width: fit-content;
|
|
1020
|
+
margin-left: auto;
|
|
1021
|
+
|
|
1022
|
+
&__mobile {
|
|
1023
|
+
@include media('>=1024px') {
|
|
1024
|
+
display: none;
|
|
1025
|
+
}
|
|
971
1026
|
}
|
|
1027
|
+
|
|
1028
|
+
&__notMobile {
|
|
1029
|
+
@include media('<1024px') {
|
|
1030
|
+
display: none;
|
|
1031
|
+
}
|
|
1032
|
+
}
|
|
1033
|
+
|
|
972
1034
|
}
|
|
1035
|
+
|
|
973
1036
|
}
|
|
974
|
-
|
|
975
|
-
&__absolute {
|
|
976
|
-
position: absolute;
|
|
977
|
-
top: 100%;
|
|
978
|
-
margin-top: rem(14);
|
|
979
|
-
left: -1px;
|
|
980
|
-
width: auto;
|
|
981
|
-
min-width: calc(100% - 38px);
|
|
982
|
-
max-width: calc(100% + 2px);
|
|
983
|
-
border: 1px solid $wac-border-light;
|
|
984
|
-
border-radius: 3px;
|
|
985
|
-
display: flex;
|
|
986
|
-
flex-direction: column;
|
|
987
|
-
justify-content: flex-start;
|
|
988
|
-
align-items: flex-start;
|
|
989
|
-
background-color: $wac-white;
|
|
990
|
-
max-height: 260px;
|
|
991
|
-
height: auto;
|
|
992
|
-
visibility: visible;
|
|
993
|
-
opacity: 1;
|
|
994
|
-
box-shadow: 3px 3px 20px $wac-select-box-shadow;
|
|
995
|
-
padding: 10px;
|
|
996
|
-
&.hidden {
|
|
997
|
-
visibility: hidden;
|
|
998
|
-
opacity: 0;
|
|
999
|
-
& > * {
|
|
1000
|
-
opacity: 0;
|
|
1001
|
-
transition: 0s;
|
|
1002
|
-
}
|
|
1003
|
-
}
|
|
1004
|
-
.ps {
|
|
1005
|
-
max-height: 240px;
|
|
1006
|
-
}
|
|
1007
|
-
&.open,
|
|
1008
|
-
&.open.hidden {
|
|
1009
|
-
position: relative;
|
|
1010
|
-
left: auto;
|
|
1011
|
-
top: 0;
|
|
1012
|
-
transform: translateX(-1px);
|
|
1013
|
-
visibility: visible;
|
|
1014
|
-
opacity: 1;
|
|
1015
|
-
& > * {
|
|
1016
|
-
opacity: 1;
|
|
1017
|
-
transition: 0s;
|
|
1018
|
-
}
|
|
1019
|
-
}
|
|
1020
|
-
&__item {
|
|
1037
|
+
&__content {
|
|
1021
1038
|
width: 100%;
|
|
1022
|
-
font-size: rem(14);
|
|
1023
|
-
line-height: rem(30);
|
|
1024
|
-
cursor: pointer;
|
|
1025
|
-
transition: 0.3s ease;
|
|
1026
|
-
position: relative;
|
|
1027
1039
|
display: flex;
|
|
1040
|
+
flex-wrap: wrap;
|
|
1041
|
+
align-items: flex-start;
|
|
1042
|
+
align-content: flex-start;
|
|
1028
1043
|
justify-content: flex-start;
|
|
1029
|
-
|
|
1030
|
-
|
|
1031
|
-
|
|
1032
|
-
|
|
1033
|
-
|
|
1034
|
-
|
|
1035
|
-
|
|
1036
|
-
|
|
1037
|
-
|
|
1038
|
-
|
|
1039
|
-
|
|
1040
|
-
|
|
1041
|
-
|
|
1042
|
-
|
|
1043
|
-
|
|
1044
|
-
|
|
1045
|
-
|
|
1046
|
-
|
|
1047
|
-
|
|
1048
|
-
|
|
1049
|
-
|
|
1050
|
-
|
|
1051
|
-
|
|
1052
|
-
|
|
1053
|
-
|
|
1054
|
-
|
|
1055
|
-
|
|
1056
|
-
color: $wac-main-text;
|
|
1057
|
-
}
|
|
1058
|
-
> div {
|
|
1059
|
-
padding: 0 10px;
|
|
1060
|
-
&.selected {
|
|
1061
|
-
background-color: $wac-gray-background;
|
|
1044
|
+
&__item {
|
|
1045
|
+
white-space: nowrap;
|
|
1046
|
+
margin: 0 10px 10px 0;
|
|
1047
|
+
border: 1px solid $wac-border-form;
|
|
1048
|
+
border-radius: 2px;
|
|
1049
|
+
color: $wac-second-color;
|
|
1050
|
+
height: rem(40);
|
|
1051
|
+
display: flex;
|
|
1052
|
+
justify-content: center;
|
|
1053
|
+
align-items: center;
|
|
1054
|
+
padding: 0 20px;
|
|
1055
|
+
transition: .3s ease;
|
|
1056
|
+
font-size: rem(16);
|
|
1057
|
+
line-height: rem(19);
|
|
1058
|
+
font-weight: 500;
|
|
1059
|
+
cursor: pointer;
|
|
1060
|
+
&:hover, &:focus {
|
|
1061
|
+
border: 1px solid $wac-main-text;
|
|
1062
|
+
}
|
|
1063
|
+
> i {
|
|
1064
|
+
color: $wac-green-color;
|
|
1065
|
+
max-width: 0;
|
|
1066
|
+
display: block;
|
|
1067
|
+
transition: .3s ease;
|
|
1068
|
+
overflow: hidden;
|
|
1069
|
+
}
|
|
1070
|
+
&.active {
|
|
1062
1071
|
color: $wac-main-text;
|
|
1072
|
+
> i {
|
|
1073
|
+
max-width: unset;
|
|
1074
|
+
margin: 0 0 0 10px;
|
|
1075
|
+
}
|
|
1076
|
+
}
|
|
1077
|
+
&:first-child {
|
|
1078
|
+
margin-left: 18px;
|
|
1063
1079
|
}
|
|
1064
|
-
}
|
|
1065
|
-
}
|
|
1066
|
-
&__empty {
|
|
1067
|
-
display: flex;
|
|
1068
|
-
width: 100%;
|
|
1069
|
-
justify-content: center;
|
|
1070
|
-
align-items: center;
|
|
1071
|
-
padding: 10px;
|
|
1072
|
-
span {
|
|
1073
|
-
font-size: rem(16);
|
|
1074
|
-
font-weight: 400;
|
|
1075
|
-
text-align: center;
|
|
1076
|
-
color: $wac-second-color;
|
|
1077
|
-
display: inline-block;
|
|
1078
|
-
line-height: rem(25);
|
|
1079
1080
|
}
|
|
1080
1081
|
}
|
|
1081
1082
|
}
|
|
1082
|
-
}
|
|
1083
|
-
.wac-block {
|
|
1083
|
+
}.wac-block {
|
|
1084
1084
|
background-color: $white;
|
|
1085
1085
|
@include padding(rem(30));
|
|
1086
1086
|
box-shadow: 0 rem(2) rem(5) rgba(45, 62, 85, 0.05);
|
|
@@ -3251,6 +3251,28 @@ $wac-subtitle-color: #7A87A1!default;
|
|
|
3251
3251
|
}
|
|
3252
3252
|
}
|
|
3253
3253
|
.wac-text-area {
|
|
3254
|
+
|
|
3255
|
+
::-webkit-input-placeholder {
|
|
3256
|
+
/* Chrome/Opera/Safari */
|
|
3257
|
+
color: $wac-placeholder-color !important;
|
|
3258
|
+
opacity: 1;
|
|
3259
|
+
}
|
|
3260
|
+
::-moz-placeholder {
|
|
3261
|
+
/* Firefox 19+ */
|
|
3262
|
+
color: $wac-placeholder-color !important;
|
|
3263
|
+
opacity: 1;
|
|
3264
|
+
}
|
|
3265
|
+
:-ms-input-placeholder {
|
|
3266
|
+
/* IE 10+ */
|
|
3267
|
+
color: $wac-placeholder-color !important;
|
|
3268
|
+
opacity: 1;
|
|
3269
|
+
}
|
|
3270
|
+
:-moz-placeholder {
|
|
3271
|
+
/* Firefox 18- */
|
|
3272
|
+
color: $wac-placeholder-color !important;
|
|
3273
|
+
opacity: 1;
|
|
3274
|
+
}
|
|
3275
|
+
|
|
3254
3276
|
label {
|
|
3255
3277
|
padding: 0!important;
|
|
3256
3278
|
font-size: rem(14)!important;
|
|
@@ -4215,6 +4237,11 @@ span.wac-tooltip {
|
|
|
4215
4237
|
color: $wac-white;
|
|
4216
4238
|
}
|
|
4217
4239
|
}
|
|
4240
|
+
|
|
4241
|
+
.wac-button__tooltips {
|
|
4242
|
+
background-color: $wac-wizishop-blue-button!important;
|
|
4243
|
+
color: $white!important;
|
|
4244
|
+
}
|
|
4218
4245
|
}
|
|
4219
4246
|
|
|
4220
4247
|
&.animationText {
|
|
@@ -4417,6 +4444,59 @@ span.wac-tooltip {
|
|
|
4417
4444
|
background-color: $wac-main-text;
|
|
4418
4445
|
}
|
|
4419
4446
|
|
|
4447
|
+
.wac-button__tooltips {
|
|
4448
|
+
background-color: $wac-main-text-lighten!important;
|
|
4449
|
+
color: $wac-white!important;
|
|
4450
|
+
|
|
4451
|
+
&.right {
|
|
4452
|
+
&:before {
|
|
4453
|
+
border-color: transparent $wac-main-text-lighten transparent transparent;
|
|
4454
|
+
}
|
|
4455
|
+
}
|
|
4456
|
+
|
|
4457
|
+
&.left {
|
|
4458
|
+
&:before {
|
|
4459
|
+
border-color: transparent transparent transparent $wac-main-text-lighten;
|
|
4460
|
+
}
|
|
4461
|
+
}
|
|
4462
|
+
|
|
4463
|
+
&.top-center {
|
|
4464
|
+
&:before {
|
|
4465
|
+
border-color: $wac-main-text-lighten transparent transparent transparent;
|
|
4466
|
+
}
|
|
4467
|
+
}
|
|
4468
|
+
|
|
4469
|
+
&.top-right {
|
|
4470
|
+
&:before {
|
|
4471
|
+
border-color: $wac-main-text-lighten transparent transparent transparent;
|
|
4472
|
+
}
|
|
4473
|
+
}
|
|
4474
|
+
|
|
4475
|
+
&.top-left {
|
|
4476
|
+
&:before {
|
|
4477
|
+
border-color: $wac-main-text-lighten transparent transparent transparent;
|
|
4478
|
+
}
|
|
4479
|
+
}
|
|
4480
|
+
|
|
4481
|
+
&.bottom-center {
|
|
4482
|
+
&:before {
|
|
4483
|
+
border-color: transparent transparent $wac-main-text-lighten transparent;
|
|
4484
|
+
}
|
|
4485
|
+
}
|
|
4486
|
+
|
|
4487
|
+
&.bottom-right {
|
|
4488
|
+
&:before {
|
|
4489
|
+
border-color: transparent transparent $wac-main-text-lighten transparent;
|
|
4490
|
+
}
|
|
4491
|
+
}
|
|
4492
|
+
|
|
4493
|
+
&.bottom-left {
|
|
4494
|
+
&:before {
|
|
4495
|
+
border-color: transparent transparent $wac-main-text-lighten transparent;
|
|
4496
|
+
}
|
|
4497
|
+
}
|
|
4498
|
+
}
|
|
4499
|
+
|
|
4420
4500
|
&:hover,
|
|
4421
4501
|
&.hover {
|
|
4422
4502
|
background-color: $wac-main-text-lighten;
|
|
@@ -4700,6 +4780,59 @@ span.wac-tooltip {
|
|
|
4700
4780
|
background-color: $wac-background-color-darken;
|
|
4701
4781
|
}
|
|
4702
4782
|
|
|
4783
|
+
.wac-button__tooltips {
|
|
4784
|
+
background-color: $wac-background-color-darken!important;
|
|
4785
|
+
color: $wac-main-text!important;
|
|
4786
|
+
|
|
4787
|
+
&.right {
|
|
4788
|
+
&:before {
|
|
4789
|
+
border-color: transparent $wac-background-color-darken transparent transparent;
|
|
4790
|
+
}
|
|
4791
|
+
}
|
|
4792
|
+
|
|
4793
|
+
&.left {
|
|
4794
|
+
&:before {
|
|
4795
|
+
border-color: transparent transparent transparent $wac-background-color-darken;
|
|
4796
|
+
}
|
|
4797
|
+
}
|
|
4798
|
+
|
|
4799
|
+
&.top-center {
|
|
4800
|
+
&:before {
|
|
4801
|
+
border-color: $wac-background-color-darken transparent transparent transparent;
|
|
4802
|
+
}
|
|
4803
|
+
}
|
|
4804
|
+
|
|
4805
|
+
&.top-right {
|
|
4806
|
+
&:before {
|
|
4807
|
+
border-color: $wac-background-color-darken transparent transparent transparent;
|
|
4808
|
+
}
|
|
4809
|
+
}
|
|
4810
|
+
|
|
4811
|
+
&.top-left {
|
|
4812
|
+
&:before {
|
|
4813
|
+
border-color: $wac-background-color-darken transparent transparent transparent;
|
|
4814
|
+
}
|
|
4815
|
+
}
|
|
4816
|
+
|
|
4817
|
+
&.bottom-center {
|
|
4818
|
+
&:before {
|
|
4819
|
+
border-color: transparent transparent $wac-background-color-darken transparent;
|
|
4820
|
+
}
|
|
4821
|
+
}
|
|
4822
|
+
|
|
4823
|
+
&.bottom-right {
|
|
4824
|
+
&:before {
|
|
4825
|
+
border-color: transparent transparent $wac-background-color-darken transparent;
|
|
4826
|
+
}
|
|
4827
|
+
}
|
|
4828
|
+
|
|
4829
|
+
&.bottom-left {
|
|
4830
|
+
&:before {
|
|
4831
|
+
border-color: transparent transparent $wac-background-color-darken transparent;
|
|
4832
|
+
}
|
|
4833
|
+
}
|
|
4834
|
+
}
|
|
4835
|
+
|
|
4703
4836
|
.wac-button__wrapper, .wac-button__animation {
|
|
4704
4837
|
color: $wac-second-color;
|
|
4705
4838
|
transition: color 0.3s ease-in-out;
|
|
@@ -4764,6 +4897,58 @@ span.wac-tooltip {
|
|
|
4764
4897
|
background-color: $wac-primary-button-darken;
|
|
4765
4898
|
}
|
|
4766
4899
|
|
|
4900
|
+
.wac-button__tooltips {
|
|
4901
|
+
background-color: $wac-primary-button-darken!important;
|
|
4902
|
+
color: $wac-white!important;
|
|
4903
|
+
&.right {
|
|
4904
|
+
&:before {
|
|
4905
|
+
border-color: transparent $wac-primary-button-darken transparent transparent;
|
|
4906
|
+
}
|
|
4907
|
+
}
|
|
4908
|
+
|
|
4909
|
+
&.left {
|
|
4910
|
+
&:before {
|
|
4911
|
+
border-color: transparent transparent transparent $wac-primary-button-darken;
|
|
4912
|
+
}
|
|
4913
|
+
}
|
|
4914
|
+
|
|
4915
|
+
&.top-center {
|
|
4916
|
+
&:before {
|
|
4917
|
+
border-color: $wac-primary-button-darken transparent transparent transparent;
|
|
4918
|
+
}
|
|
4919
|
+
}
|
|
4920
|
+
|
|
4921
|
+
&.top-right {
|
|
4922
|
+
&:before {
|
|
4923
|
+
border-color: $wac-primary-button-darken transparent transparent transparent;
|
|
4924
|
+
}
|
|
4925
|
+
}
|
|
4926
|
+
|
|
4927
|
+
&.top-left {
|
|
4928
|
+
&:before {
|
|
4929
|
+
border-color: $wac-primary-button-darken transparent transparent transparent;
|
|
4930
|
+
}
|
|
4931
|
+
}
|
|
4932
|
+
|
|
4933
|
+
&.bottom-center {
|
|
4934
|
+
&:before {
|
|
4935
|
+
border-color: transparent transparent $wac-primary-button-darken transparent;
|
|
4936
|
+
}
|
|
4937
|
+
}
|
|
4938
|
+
|
|
4939
|
+
&.bottom-right {
|
|
4940
|
+
&:before {
|
|
4941
|
+
border-color: transparent transparent $wac-primary-button-darken transparent;
|
|
4942
|
+
}
|
|
4943
|
+
}
|
|
4944
|
+
|
|
4945
|
+
&.bottom-left {
|
|
4946
|
+
&:before {
|
|
4947
|
+
border-color: transparent transparent $wac-primary-button-darken transparent;
|
|
4948
|
+
}
|
|
4949
|
+
}
|
|
4950
|
+
}
|
|
4951
|
+
|
|
4767
4952
|
&:hover,
|
|
4768
4953
|
&.hover {
|
|
4769
4954
|
background-color: $wac-primary-button-darken;
|
|
@@ -4819,6 +5004,60 @@ span.wac-tooltip {
|
|
|
4819
5004
|
}
|
|
4820
5005
|
}
|
|
4821
5006
|
|
|
5007
|
+
&.is-green {
|
|
5008
|
+
.wac-button__tooltips {
|
|
5009
|
+
background-color: $wac-green-color-darken!important;
|
|
5010
|
+
color: $wac-white!important;
|
|
5011
|
+
&.right {
|
|
5012
|
+
&:before {
|
|
5013
|
+
border-color: transparent $wac-green-color-darken transparent transparent;
|
|
5014
|
+
}
|
|
5015
|
+
}
|
|
5016
|
+
|
|
5017
|
+
&.left {
|
|
5018
|
+
&:before {
|
|
5019
|
+
border-color: transparent transparent transparent $wac-green-color-darken;
|
|
5020
|
+
}
|
|
5021
|
+
}
|
|
5022
|
+
|
|
5023
|
+
&.top-center {
|
|
5024
|
+
&:before {
|
|
5025
|
+
border-color: $wac-green-color-darken transparent transparent transparent;
|
|
5026
|
+
}
|
|
5027
|
+
}
|
|
5028
|
+
|
|
5029
|
+
&.top-right {
|
|
5030
|
+
&:before {
|
|
5031
|
+
border-color: $wac-green-color-darken transparent transparent transparent;
|
|
5032
|
+
}
|
|
5033
|
+
}
|
|
5034
|
+
|
|
5035
|
+
&.top-left {
|
|
5036
|
+
&:before {
|
|
5037
|
+
border-color: $wac-green-color-darken transparent transparent transparent;
|
|
5038
|
+
}
|
|
5039
|
+
}
|
|
5040
|
+
|
|
5041
|
+
&.bottom-center {
|
|
5042
|
+
&:before {
|
|
5043
|
+
border-color: transparent transparent $wac-green-color-darken transparent;
|
|
5044
|
+
}
|
|
5045
|
+
}
|
|
5046
|
+
|
|
5047
|
+
&.bottom-right {
|
|
5048
|
+
&:before {
|
|
5049
|
+
border-color: transparent transparent $wac-green-color-darken transparent;
|
|
5050
|
+
}
|
|
5051
|
+
}
|
|
5052
|
+
|
|
5053
|
+
&.bottom-left {
|
|
5054
|
+
&:before {
|
|
5055
|
+
border-color: transparent transparent $wac-green-color-darken transparent;
|
|
5056
|
+
}
|
|
5057
|
+
}
|
|
5058
|
+
}
|
|
5059
|
+
}
|
|
5060
|
+
|
|
4822
5061
|
&.is-success {
|
|
4823
5062
|
background-color: $wac-green-color;
|
|
4824
5063
|
border-color: $wac-green-color;
|
|
@@ -4828,6 +5067,58 @@ span.wac-tooltip {
|
|
|
4828
5067
|
background-color: $wac-green-color-darken;
|
|
4829
5068
|
}
|
|
4830
5069
|
|
|
5070
|
+
.wac-button__tooltips {
|
|
5071
|
+
background-color: $wac-green-color-darken!important;
|
|
5072
|
+
color: $wac-white!important;
|
|
5073
|
+
&.right {
|
|
5074
|
+
&:before {
|
|
5075
|
+
border-color: transparent $wac-green-color-darken transparent transparent;
|
|
5076
|
+
}
|
|
5077
|
+
}
|
|
5078
|
+
|
|
5079
|
+
&.left {
|
|
5080
|
+
&:before {
|
|
5081
|
+
border-color: transparent transparent transparent $wac-green-color-darken;
|
|
5082
|
+
}
|
|
5083
|
+
}
|
|
5084
|
+
|
|
5085
|
+
&.top-center {
|
|
5086
|
+
&:before {
|
|
5087
|
+
border-color: $wac-green-color-darken transparent transparent transparent;
|
|
5088
|
+
}
|
|
5089
|
+
}
|
|
5090
|
+
|
|
5091
|
+
&.top-right {
|
|
5092
|
+
&:before {
|
|
5093
|
+
border-color: $wac-green-color-darken transparent transparent transparent;
|
|
5094
|
+
}
|
|
5095
|
+
}
|
|
5096
|
+
|
|
5097
|
+
&.top-left {
|
|
5098
|
+
&:before {
|
|
5099
|
+
border-color: $wac-green-color-darken transparent transparent transparent;
|
|
5100
|
+
}
|
|
5101
|
+
}
|
|
5102
|
+
|
|
5103
|
+
&.bottom-center {
|
|
5104
|
+
&:before {
|
|
5105
|
+
border-color: transparent transparent $wac-green-color-darken transparent;
|
|
5106
|
+
}
|
|
5107
|
+
}
|
|
5108
|
+
|
|
5109
|
+
&.bottom-right {
|
|
5110
|
+
&:before {
|
|
5111
|
+
border-color: transparent transparent $wac-green-color-darken transparent;
|
|
5112
|
+
}
|
|
5113
|
+
}
|
|
5114
|
+
|
|
5115
|
+
&.bottom-left {
|
|
5116
|
+
&:before {
|
|
5117
|
+
border-color: transparent transparent $wac-green-color-darken transparent;
|
|
5118
|
+
}
|
|
5119
|
+
}
|
|
5120
|
+
}
|
|
5121
|
+
|
|
4831
5122
|
&:hover,
|
|
4832
5123
|
&.hover {
|
|
4833
5124
|
background-color: $wac-green-color-darken;
|
|
@@ -4999,16 +5290,21 @@ span.wac-tooltip {
|
|
|
4999
5290
|
&__tooltips {
|
|
5000
5291
|
position: absolute;
|
|
5001
5292
|
width: auto;
|
|
5002
|
-
padding:
|
|
5293
|
+
padding: 4px;
|
|
5003
5294
|
border-radius: 3px;
|
|
5004
|
-
background: $
|
|
5295
|
+
background: $wizishop-blue;
|
|
5005
5296
|
color: $wac-white;
|
|
5006
5297
|
min-width: 100%;
|
|
5007
5298
|
visibility: hidden;
|
|
5008
|
-
font-size:
|
|
5299
|
+
font-size: 12px;
|
|
5009
5300
|
opacity: 0;
|
|
5010
5301
|
transition: opacity .3s ease 0s, visibility 0s linear .35s;
|
|
5011
5302
|
|
|
5303
|
+
&.oneline {
|
|
5304
|
+
width: auto!important;
|
|
5305
|
+
white-space: nowrap;
|
|
5306
|
+
}
|
|
5307
|
+
|
|
5012
5308
|
@include media('>=tablet') {
|
|
5013
5309
|
min-width: 600px;
|
|
5014
5310
|
}
|
|
@@ -5026,7 +5322,7 @@ span.wac-tooltip {
|
|
|
5026
5322
|
height: 0;
|
|
5027
5323
|
border-style: solid;
|
|
5028
5324
|
border-width: 10px 10px 0 10px;
|
|
5029
|
-
border-color:
|
|
5325
|
+
border-color: $wizishop-blue transparent transparent transparent;
|
|
5030
5326
|
}
|
|
5031
5327
|
|
|
5032
5328
|
&.right {
|
|
@@ -6675,6 +6971,26 @@ div.wac-field-input-search {
|
|
|
6675
6971
|
}
|
|
6676
6972
|
}
|
|
6677
6973
|
.wac-input {
|
|
6974
|
+
::-webkit-input-placeholder {
|
|
6975
|
+
/* Chrome/Opera/Safari */
|
|
6976
|
+
color: $wac-placeholder-color !important;
|
|
6977
|
+
opacity: 1;
|
|
6978
|
+
}
|
|
6979
|
+
::-moz-placeholder {
|
|
6980
|
+
/* Firefox 19+ */
|
|
6981
|
+
color: $wac-placeholder-color !important;
|
|
6982
|
+
opacity: 1;
|
|
6983
|
+
}
|
|
6984
|
+
:-ms-input-placeholder {
|
|
6985
|
+
/* IE 10+ */
|
|
6986
|
+
color: $wac-placeholder-color !important;
|
|
6987
|
+
opacity: 1;
|
|
6988
|
+
}
|
|
6989
|
+
:-moz-placeholder {
|
|
6990
|
+
/* Firefox 18- */
|
|
6991
|
+
color: $wac-placeholder-color !important;
|
|
6992
|
+
opacity: 1;
|
|
6993
|
+
}
|
|
6678
6994
|
.field-label {
|
|
6679
6995
|
margin-bottom: 0!important;
|
|
6680
6996
|
&.is-normal {
|
|
@@ -6723,26 +7039,6 @@ div.wac-field-input-search {
|
|
|
6723
7039
|
background-color: transparent;
|
|
6724
7040
|
}
|
|
6725
7041
|
}
|
|
6726
|
-
::-webkit-input-placeholder {
|
|
6727
|
-
/* Chrome/Opera/Safari */
|
|
6728
|
-
color: $wac-placeholder-color !important;
|
|
6729
|
-
opacity: 1;
|
|
6730
|
-
}
|
|
6731
|
-
::-moz-placeholder {
|
|
6732
|
-
/* Firefox 19+ */
|
|
6733
|
-
color: $wac-placeholder-color !important;
|
|
6734
|
-
opacity: 1;
|
|
6735
|
-
}
|
|
6736
|
-
:-ms-input-placeholder {
|
|
6737
|
-
/* IE 10+ */
|
|
6738
|
-
color: $wac-placeholder-color !important;
|
|
6739
|
-
opacity: 1;
|
|
6740
|
-
}
|
|
6741
|
-
:-moz-placeholder {
|
|
6742
|
-
/* Firefox 18- */
|
|
6743
|
-
color: $wac-placeholder-color !important;
|
|
6744
|
-
opacity: 1;
|
|
6745
|
-
}
|
|
6746
7042
|
}
|
|
6747
7043
|
|
|
6748
7044
|
label {
|