Skip to content

Commit c427ff1

Browse files
author
Kacper Chara
committed
Fix for Magnifier in inside mode
1 parent 48d9e3f commit c427ff1

File tree

3 files changed

+189
-183
lines changed

3 files changed

+189
-183
lines changed

app/design/frontend/Magento/luma/etc/view.xml

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -231,6 +231,7 @@
231231
<var name="height"></var> <!-- Height of magnifier block -->
232232
<var name="eventType">hover</var> <!-- Action that atcivates zoom (hover/click) -->
233233
<var name="enabled">false</var> <!-- Turn on/off magnifier (true/false) -->
234+
<var name="mode">outside</var> <!-- Zoom type (outside/inside) -->
234235
</var>
235236

236237
<var name="breakpoints">

lib/web/mage/gallery/gallery.less

Lines changed: 12 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -736,24 +736,30 @@
736736
text-align: center;
737737
top: 0;
738738
z-index: @z-index-10;
739+
overflow: hidden;
740+
741+
.magnifier-large {
742+
width: auto;
743+
height: auto;
744+
max-height: none;
745+
max-width: none;
746+
border: none;
747+
position: absolute;
748+
z-index: @z-index-1;
749+
}
739750
}
740751

741752
.magnifier-loader-text {
742753
margin-top: 10px;
743754
}
744755

745-
.magnifier-large {
746-
position: absolute;
747-
width: 32%;
748-
z-index: @z-index-1;
749-
}
750-
751756
.magnifier-preview {
752757
bottom: 0;
753758
left: 58%;
754759
overflow: hidden;
755760
padding: 0;
756761
position: absolute;
762+
z-index: 2;
757763
top: 215px;
758764
&:not(.hidden) {
759765
background-color: @color-white;

0 commit comments

Comments
 (0)