FrontendComponents/hotspots
8
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

poprawa linku + wersji + dodanie limitu produktow

Browse Source
This commit is contained in:
pawel.gaca
2025-12-08 11:15:34 +01:00
parent 12318caaba
commit 5f194e862f
4 changed files with 214 additions and 142 deletions
Download Patch File Download Diff File Expand all files Collapse all files

42
style.less
View File

@@ -1,5 +1,6 @@
.idm__hotspot .add_to_basket{
.idm__hotspot .add_to_basket, .idm__hotspot .add_to_basket__link{
display: flex;
justify-content: center;
}
.idm__hotspot .add_to_basket.--range{
flex-direction: column;
@@ -239,19 +240,33 @@
animation: idmPulseOpacity 3s infinite;
}
.idm__hotspot .product:has(.product__versions){
--idm-hotspot-version-height: 55px;
--idm-hotspot-version-height: 65px;
@media (min-width: 757px){
--idm-hotspot-version-height: 70px;
}
@media (min-width: 979px){
--idm-hotspot-version-height: 55px;
}
.product__versions{
display: grid;
grid-template-columns: repeat(5, 1fr);
grid-template-columns: repeat(var(--version-mobile-columns, 4), 1fr);
gap: 1rem;
z-index: 1;
background: #fff;
clip-path: inset(0% 0 100% 0);
padding: 0.3rem 1rem;
position: absolute;
top: 0;
width: 100%;
padding: 0.3rem 1.5rem;
@media (min-width: 757px){
padding: 0.3rem 2.5rem;
grid-template-columns: repeat(var(--version-tablet-columns, 3), 1fr);
}
@media (min-width: 979px){
padding: 0.3rem 1rem;
grid-template-columns: repeat(var(--version-desktop-columns, 5), 1fr);
}
height: var(--idm-hotspot-version-height);
align-items: center;
@@ -266,6 +281,22 @@
aspect-ratio: 1 / 1;
align-items: center;
justify-content: center;
@media (max-width: 756px){
&:has(.--mobile-more:empty), .--tablet-more, .--desktop-more{
display: none;
}
}
@media (min-width: 757px) and (max-width: 978px){
&:has(.--tablet-more:empty), .--desktop-more, .--mobile-more{
display: none;
}
}
@media (min-width: 979px){
&:has(.--desktop-more:empty), .--tablet-more, .--mobile-more{
display: none;
}
}
&:hover{
border-color: #111;
@@ -275,6 +306,7 @@
box-shadow: 0 0 0 1px var(--primary-color, #111);
}
}
.product__version_more{
background: #f2f2f2;
}