Steve-Dee-Designs
/
woocommerce
mirror of https://github.com/woocommerce/woocommerce.git
1
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

Fix media queries for iOS Simulator in in-app marketplace (#51979) 

* Replace `@media (width <= $breakpoint-medium)` queries with `@media screen and (max-width: $breakpoint-medium)`. iOS Simulator doesn't seem to support the previous query syntax.

* Add changefile(s) from automation for the following project(s): woocommerce

---------

Co-authored-by: github-actions <github-actions@github.com>
This commit is contained in:
And Finally 2024-10-10 09:37:47 +01:00 committed by GitHub
parent 6a5a4f14d1
commit 485f00f97b
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
4 changed files with 13 additions and 9 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

14
plugins/woocommerce-admin/client/marketplace/components/header/header.scss
View File

@ -14,8 +14,8 @@
top: var(--wp-admin--admin-bar--height, 32px);
z-index: 1;
/* On narrow screens, "stack" header items and hide the bottom border */
@media (width <= $breakpoint-medium) {
// On narrow screens, "stack" header items and hide the bottom border
@media screen and (max-width: $breakpoint-medium) {
border-bottom: 0;
grid-template: "mktpl-title mktpl-meta" 60px
"mktpl-tabs mktpl-tabs" 48px
@ -29,14 +29,14 @@
margin: 0;
padding: 10px 0 0;
@media (width <= $breakpoint-medium) {
@media screen and (max-width: $breakpoint-medium) {
padding-left: var(--large-gap);
}
}
}
.woocommerce-marketplace--my-subscriptions {
@media (width <= $breakpoint-medium) {
@media screen and (max-width: $breakpoint-medium) {
.woocommerce-marketplace__search {
display: none;
}
@ -50,7 +50,7 @@
grid-area: mktpl-title;
line-height: 18px;
@media (width <= $breakpoint-medium) {
@media screen and (max-width: $breakpoint-medium) {
padding: 0 $content-spacing-small;
}
}
@ -60,7 +60,7 @@
justify-self: end;
padding-top: 10px;
@media (width <= $breakpoint-medium) {
@media screen and (max-width: $breakpoint-medium) {
margin-right: $content-spacing-small;
padding: 0;
}
@ -70,7 +70,7 @@
align-self: end;
grid-area: mktpl-tabs;
@media (width <= $breakpoint-medium) {
@media screen and (max-width: $breakpoint-medium) {
padding: 0 $content-spacing-small;
}
}

2
plugins/woocommerce-admin/client/marketplace/components/search/search.scss
View File

@ -5,7 +5,7 @@
margin-top: 15px;
width: 320px;
@media (width <= $breakpoint-medium) {
@media screen and (max-width: $breakpoint-medium) {
margin: $grid-unit-20 $grid-unit-20 $grid-unit-10 $grid-unit-20;
width: calc(100% - $grid-unit-20 * 2);

2
plugins/woocommerce-admin/client/marketplace/components/tabs/tabs.scss
View File

@ -59,7 +59,7 @@
}
}
@media (width <= $breakpoint-medium) {
@media screen and (max-width: $breakpoint-medium) {
.woocommerce-marketplace__tabs {
border-bottom: 1px solid $gutenberg-gray-300;

4
plugins/woocommerce/changelog/51979-update-wccom-21880-marketplace-media-queries Normal file
View File

@ -0,0 +1,4 @@
Significance: patch
Type: tweak
Comment: Changes in-app marketplace media queries to use older `min-width` syntax.