pxt-core 12.3.13 → 12.3.14

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/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "pxt-core",
3
- "version": "12.3.13",
3
+ "version": "12.3.14",
4
4
  "description": "Microsoft MakeCode provides Blocks / JavaScript / Python tools and editors",
5
5
  "keywords": [
6
6
  "TypeScript",
package/theme/home.less CHANGED
@@ -259,7 +259,13 @@
259
259
  grid-column-start: 1;
260
260
  grid-column-end: -1;
261
261
  min-width: 0;
262
- width: 100%;
262
+ // Negative horizontal margins extend the detail view past the
263
+ // `.search-segment` horizontal padding so it spans edge-to-edge,
264
+ // matching the non-search detail view (which is a sibling of
265
+ // the padded `.carouselcontainer`).
266
+ margin-left: -@carouselArrowSize;
267
+ margin-right: -@carouselArrowSize;
268
+ width: calc(100% + 2 * @carouselArrowSize);
263
269
  }
264
270
 
265
271
  .search-empty-state {
@@ -926,6 +932,12 @@
926
932
  /* Carousel */
927
933
  .gallerysegment.search-segment {
928
934
  padding: 1rem @carouselArrowSizeTablet;
935
+
936
+ .search-detailview.detailview {
937
+ margin-left: -@carouselArrowSizeTablet;
938
+ margin-right: -@carouselArrowSizeTablet;
939
+ width: calc(100% + 2 * @carouselArrowSizeTablet);
940
+ }
929
941
  }
930
942
  .ui.segment.gallerysegment.mystuff-segment.search-mode {
931
943
  .gallery-heading-column {
@@ -966,25 +978,57 @@
966
978
  }
967
979
  }
968
980
  .detailview {
969
- .actions .card-action {
970
- max-width: 10rem;
971
- .button.attached .icon:not(.xicon) {
972
- line-height: 6rem;
973
- }
974
- }
975
- .actions .card-action > .item,
976
- .actions .card-action > .icon {
977
- height: 6rem;
978
- max-width: 10rem;
979
- background-size: 60%;
981
+ .project-info .segment {
982
+ padding-bottom: 1.5rem;
980
983
  }
981
- .actions .segment {
982
- margin-top: 4rem;
983
- margin-right: 2rem;
984
+ .ui.grid.stackable .actions {
985
+ // Switch to flex so multiple action cards shrink to fit on
986
+ // narrower (e.g. iPad portrait, ~834px) viewports instead of
987
+ // overflowing the column and being clipped by the parent
988
+ // `.detailview { overflow: hidden }`.
989
+ padding-right: 1.5rem !important;
990
+
991
+ .segment {
992
+ display: flex;
993
+ flex-wrap: nowrap;
994
+ justify-content: flex-end;
995
+ align-items: flex-start;
996
+ gap: 0.75rem;
997
+ margin-top: 4rem;
998
+ margin-right: 0.5rem;
999
+ white-space: normal;
1000
+ }
1001
+
1002
+ .card-action {
1003
+ flex: 0 1 8rem;
1004
+ min-width: 0;
1005
+ max-width: 8rem;
1006
+ margin: 0;
1007
+
1008
+ .button.attached .icon:not(.xicon) {
1009
+ font-size: 3.5rem;
1010
+ line-height: 6rem;
1011
+ }
1012
+ }
1013
+ .card-action.custom-icon i.xicon {
1014
+ font-size: 4.5rem;
1015
+ padding-top: 2rem;
1016
+ }
1017
+ .card-action > .item,
1018
+ .card-action > .icon {
1019
+ height: 6rem;
1020
+ max-width: 100%;
1021
+ background-size: 60%;
1022
+ }
1023
+ .card-action-title {
1024
+ font-size: 1.1rem;
1025
+ }
984
1026
  }
985
1027
  .ui.button.approve {
986
- font-size: 1rem!important;
987
- padding: 0.7rem 1rem;
1028
+ font-size: 0.9rem!important;
1029
+ padding: 0.6rem 0.75rem;
1030
+ white-space: normal;
1031
+ line-height: 1.2;
988
1032
  }
989
1033
  }
990
1034
  }
@@ -1010,6 +1054,12 @@
1010
1054
  /* Carousel */
1011
1055
  .gallerysegment.search-segment {
1012
1056
  padding: 1rem @carouselArrowSizeMobile;
1057
+
1058
+ .search-detailview.detailview {
1059
+ margin-left: -@carouselArrowSizeMobile;
1060
+ margin-right: -@carouselArrowSizeMobile;
1061
+ width: calc(100% + 2 * @carouselArrowSizeMobile);
1062
+ }
1013
1063
  }
1014
1064
  .ui.segment.gallerysegment.mystuff-segment.search-mode {
1015
1065
  .gallery-heading-column {
@@ -1152,9 +1202,12 @@
1152
1202
  padding-bottom: 1rem;
1153
1203
  }
1154
1204
  }
1205
+ // Match the `.ui.grid.stackable` specificity used at the tablet
1206
+ // breakpoint so the mobile segment overrides win when stacked.
1207
+ .ui.grid.stackable .actions,
1155
1208
  .actions {
1156
1209
  height: auto;
1157
- padding-right: @carouselArrowSizeMobile !important;
1210
+ padding-right: 0.5rem !important;
1158
1211
  .card-action {
1159
1212
  display: inline-block;
1160
1213
  width: 8rem;
@@ -1170,6 +1223,8 @@
1170
1223
  .button.approve {
1171
1224
  font-size: 0.9rem !important;
1172
1225
  padding: .35em 0.75em .5em;
1226
+ white-space: normal;
1227
+ line-height: 1.2;
1173
1228
  }
1174
1229
  .button.attached .icon:not(.xicon) {
1175
1230
  font-size: 2rem;
@@ -1184,7 +1239,7 @@
1184
1239
 
1185
1240
  .segment {
1186
1241
  position: static;
1187
- margin: 0 0.5rem 0.5rem;
1242
+ margin: 0 0 0.5rem;
1188
1243
  text-align: right;
1189
1244
  white-space: nowrap;
1190
1245
  }