@wizishop/angular-components 15.1.143 → 15.1.144

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.
@@ -958,6 +958,135 @@ wac-block {
958
958
  margin-right: 0;
959
959
  }
960
960
  }
961
+ .wac-breadcrumbs {
962
+ width: 100%;
963
+ display: flex;
964
+ align-items: center;
965
+ padding: 0;
966
+ margin: 0 0 10px;
967
+ border-radius: 3px;
968
+
969
+ @include media('<tablet') {
970
+ &:not(.no-responsive) {
971
+ max-width: 100%;
972
+ overflow: hidden;
973
+ .wac-breadcrumbs {
974
+ &__wrapper {
975
+ @include media('<tablet') {
976
+ width: auto;
977
+ overflow-x: scroll;
978
+ }
979
+ }
980
+ &__item {
981
+ @include media('<tablet') {
982
+ width: auto;
983
+ min-width: unset;
984
+ max-width: unset;
985
+ .name {
986
+ white-space: nowrap;
987
+ }
988
+ }
989
+ }
990
+ }
991
+ }
992
+ }
993
+
994
+ &__wrapper {
995
+ width: 100%;
996
+ display: flex;
997
+ align-items: center;
998
+ }
999
+
1000
+ &__item {
1001
+ width: 100%;
1002
+ max-width: 50%;
1003
+ display: flex;
1004
+ align-items: center;
1005
+ justify-content: center;
1006
+ position: relative;
1007
+ padding: 10px;
1008
+ cursor: pointer;
1009
+ &:before {
1010
+ content: '';
1011
+ display: block;
1012
+ position: absolute;
1013
+ bottom: -5px;
1014
+ left: 50%;
1015
+ transform: translateX(-50%);
1016
+ width: calc(100% - 5px);
1017
+ height: 3px;
1018
+ background-color: $wac-round-breadcrumbs;
1019
+ }
1020
+ &.current, &.valid {
1021
+ &:before {
1022
+ background-color: $wac-wizishop-blue;
1023
+ }
1024
+ &:hover, &:focus {
1025
+ .round {
1026
+ background-color: $wac-wizishop-blue;
1027
+ border-color: $wac-wizishop-blue;
1028
+ > span, > i {
1029
+ color: $wac-white;
1030
+ }
1031
+ }
1032
+ .name {
1033
+ color: $wac-wizishop-blue;
1034
+ }
1035
+ }
1036
+ }
1037
+
1038
+
1039
+ &.current {
1040
+ &:before {
1041
+ height: 5px;
1042
+ }
1043
+ }
1044
+ .round {
1045
+ min-width: 30px;
1046
+ height: 30px;
1047
+ border-radius: 30px;
1048
+ display: flex;
1049
+ justify-content: center;
1050
+ align-items: center;
1051
+ border: 2px solid $wac-round-breadcrumbs;
1052
+ background-color: $wac-round-breadcrumbs;
1053
+ transition: .3s ease;
1054
+ margin: 0 15px 0 0;
1055
+ > span {
1056
+ font-size: rem(12);
1057
+ font-weight: 500;
1058
+ color: $wac-second-color;
1059
+ line-height: 1;
1060
+ }
1061
+ > i {
1062
+ font-size: rem(14);
1063
+ color: $wac-wizishop-blue;
1064
+ }
1065
+ &.valid {
1066
+ background-color: transparent;
1067
+ border-color: $wac-wizishop-blue;
1068
+ color: $wac-wizishop-blue;
1069
+ }
1070
+ &.current:not(.valid) {
1071
+ background-color: $wac-wizishop-blue;
1072
+ border-color: $wac-wizishop-blue;
1073
+ > span, > i {
1074
+ color: $wac-white;
1075
+ }
1076
+ }
1077
+ }
1078
+ .name {
1079
+ font-size: rem(14);
1080
+ font-weight: 500;
1081
+ color: $wac-second-color;
1082
+ line-height: 1;
1083
+ transition: .3s ease;
1084
+ &.valid, &.current {
1085
+ color: $wac-wizishop-blue;
1086
+ }
1087
+ }
1088
+ }
1089
+ }
961
1090
  .w-border-picker {
962
1091
  display: flex;
963
1092
  flex-direction: column;
@@ -1105,136 +1234,7 @@ wac-block {
1105
1234
  }
1106
1235
 
1107
1236
  }
1108
- }.wac-breadcrumbs {
1109
- width: 100%;
1110
- display: flex;
1111
- align-items: center;
1112
- padding: 0;
1113
- margin: 0 0 10px;
1114
- border-radius: 3px;
1115
-
1116
- @include media('<tablet') {
1117
- &:not(.no-responsive) {
1118
- max-width: 100%;
1119
- overflow: hidden;
1120
- .wac-breadcrumbs {
1121
- &__wrapper {
1122
- @include media('<tablet') {
1123
- width: auto;
1124
- overflow-x: scroll;
1125
- }
1126
- }
1127
- &__item {
1128
- @include media('<tablet') {
1129
- width: auto;
1130
- min-width: unset;
1131
- max-width: unset;
1132
- .name {
1133
- white-space: nowrap;
1134
- }
1135
- }
1136
- }
1137
- }
1138
- }
1139
- }
1140
-
1141
- &__wrapper {
1142
- width: 100%;
1143
- display: flex;
1144
- align-items: center;
1145
- }
1146
-
1147
- &__item {
1148
- width: 100%;
1149
- max-width: 50%;
1150
- display: flex;
1151
- align-items: center;
1152
- justify-content: center;
1153
- position: relative;
1154
- padding: 10px;
1155
- cursor: pointer;
1156
- &:before {
1157
- content: '';
1158
- display: block;
1159
- position: absolute;
1160
- bottom: -5px;
1161
- left: 50%;
1162
- transform: translateX(-50%);
1163
- width: calc(100% - 5px);
1164
- height: 3px;
1165
- background-color: $wac-round-breadcrumbs;
1166
- }
1167
- &.current, &.valid {
1168
- &:before {
1169
- background-color: $wac-wizishop-blue;
1170
- }
1171
- &:hover, &:focus {
1172
- .round {
1173
- background-color: $wac-wizishop-blue;
1174
- border-color: $wac-wizishop-blue;
1175
- > span, > i {
1176
- color: $wac-white;
1177
- }
1178
- }
1179
- .name {
1180
- color: $wac-wizishop-blue;
1181
- }
1182
- }
1183
- }
1184
-
1185
-
1186
- &.current {
1187
- &:before {
1188
- height: 5px;
1189
- }
1190
- }
1191
- .round {
1192
- min-width: 30px;
1193
- height: 30px;
1194
- border-radius: 30px;
1195
- display: flex;
1196
- justify-content: center;
1197
- align-items: center;
1198
- border: 2px solid $wac-round-breadcrumbs;
1199
- background-color: $wac-round-breadcrumbs;
1200
- transition: .3s ease;
1201
- margin: 0 15px 0 0;
1202
- > span {
1203
- font-size: rem(12);
1204
- font-weight: 500;
1205
- color: $wac-second-color;
1206
- line-height: 1;
1207
- }
1208
- > i {
1209
- font-size: rem(14);
1210
- color: $wac-wizishop-blue;
1211
- }
1212
- &.valid {
1213
- background-color: transparent;
1214
- border-color: $wac-wizishop-blue;
1215
- color: $wac-wizishop-blue;
1216
- }
1217
- &.current:not(.valid) {
1218
- background-color: $wac-wizishop-blue;
1219
- border-color: $wac-wizishop-blue;
1220
- > span, > i {
1221
- color: $wac-white;
1222
- }
1223
- }
1224
- }
1225
- .name {
1226
- font-size: rem(14);
1227
- font-weight: 500;
1228
- color: $wac-second-color;
1229
- line-height: 1;
1230
- transition: .3s ease;
1231
- &.valid, &.current {
1232
- color: $wac-wizishop-blue;
1233
- }
1234
- }
1235
- }
1236
- }
1237
- .wac-button {
1237
+ }.wac-button {
1238
1238
  @include flexbox();
1239
1239
  @include justify-content(center);
1240
1240
  @include align-items(center);
@@ -4955,7 +4955,7 @@ wac-grid {
4955
4955
  .wac-info {
4956
4956
  display: inline-block;
4957
4957
  width: 40px;
4958
- height: 40px;
4958
+ height: auto;
4959
4959
 
4960
4960
  &__color-picker {
4961
4961
  height: inherit;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@wizishop/angular-components",
3
- "version": "15.1.143",
3
+ "version": "15.1.144",
4
4
  "peerDependencies": {
5
5
  "@angular/animations": "~15.0.2",
6
6
  "@angular/cdk": "^15.0.1",