1"use strict";(self.webpackChunk_N_E=self.webpackChunk_N_E||[]).push([[5394],{85394:function(a,b,c){c.d(b,{Z:function(){return A}});var d=c(85893),e=c(67294),f=c(25617),g=c(41664),h=c.n(g),i=c(11163),j=c(42298),k=c(23855),l=c(63457),m=c(7739),n=c.n(m),o=c(7297),p=c(19521);function q(){var a=(0,o.Z)(['\n width: 100%;\n position: relative;\n z-index: 1;\n\n \n @media (max-width: 1281px) {\n .cars-page-btn {\n position: absolute;\n top: 10px;\n right: 196px;\n }\n\n &.oldest {\n .cars-page-btn {\n top: 44px;\n right: -3px;\n }\n }\n }\n @media (max-width: 385px) {\n .cars-page-btn {\n white-space: nowrap;\n }\n }\n\n .share-wrap {\n margin-right: 14px;\n position: absolute;\n top: 10px;\n right: 97px;\n }\n &.share-active {\n z-index: 9;\n }\n &.oldest {\n .link-wrap {\n border-top: 4px solid #E4001E;\n .car-image {\n margin-top: -4px;\n }\n }\n }\n @media (min-width: 768px) {\n width: calc(50% - 8px);\n .share-wrap {\n top: 10px;\n }\n }\n @media (min-width: 1280px) {\n width: 100%;\n .share-wrap {\n margin-right: 14px;\n position: static;\n }\n }\n .link-wrap {\n display: flex;\n margin-bottom: 25px;\n position: relative;\n border: 1px solid #DCD8D8;\n border-radius: 15px;\n box-shadow: 0 1px 7px 0 rgba(0, 0, 0, 0.09);\n cursor: pointer;\n color: inherit;\n text-decoration: none;\n background: #ffffff;\n &:hover {\n box-shadow: 0 2px 10px 0 rgb(0 0 0 / 7%), 0 2px 5px 0 rgb(0 0 0 / 6%);\n }\n\n .car-title {\n max-width: 250px;\n }\n \n flex-direction: column;\n @media (min-width: 1280px) {\n flex-direction: row;\n height: 257px;\n }\n .item-bg {\n pointer-events: none;\n border-bottom-right-radius: 15px;\n position: absolute;\n left: 0;\n top: 0;\n overflow: hidden;\n z-index: 1;\n width: 100%;\n height: 100%;\n &:after {\n content: "";\n position: absolute;\n width: 600px;\n height: 600px;\n border-radius: 110px;\n background: linear-gradient(-17deg,#E30019 55%,#8B0D4B 100%);\n z-index: 15;\n right: -265px;\n bottom: -570px;\n transform: rotate(-41deg);\n @media (min-width: 1280px) {\n bottom: -505px;\n right: -272px;\n }\n }\n }\n .top-car {\n position: absolute;\n z-index: 1;\n left: 10px;\n top: 10px;\n color: #FFFFFF;\n font-size: 10px;\n font-weight: 700;\n letter-spacing: 0;\n line-height: 11px;\n padding: 4px;\n border-radius: 4px;\n background-color: #E4001E;\n text-transform: uppercase;\n }\n .car-image-wrapper {\n overflow: hidden;\n border-top-left-radius: 15px;\n border-top-right-radius: 15px;\n @media (min-width: 1280px) {\n border-bottom-left-radius: 15px;\n border-top-right-radius: 0px;\n }\n }\n .car-image {\n \n @media (min-width: 1280px) {\n width: 294px;\n height: 100%;\n display: flex;\n align-items: center;\n }\n @media (min-width: 1376px) {\n width: auto;\n height: auto;\n display: block;\n align-items: center;\n }\n img {\n border-radius: unset;\n }\n }\n .car-description-wrap {\n padding: 15px 10px 5px 14px;\n flex-grow: 2;\n .car-description-btns button, .share-wrap {\n background: rgba(255, 255, 255, 0.67);\n border-radius: 3px;\n padding: 3px 8px;\n }\n @media (max-width: 767px) {\n .share-wrap {\n padding: 0;\n }\n }\n .car-title {\n font-size: 14px;\n font-weight: 700;\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n @media (min-width: 767px) {\n font-size: 18px; \n }\n @media (min-width: 1280px) {\n font-size: 20px;\n }\n }\n }\n .car-overview-wrap {\n display: flex;\n flex-wrap: wrap;\n margin-top: 9px;\n \n @media (min-width: 1280px) {\n max-width: 405px;
1 \n }\n li {\n width: calc(100% / 2);\n white-space: nowrap;\n margin-top: 6px;\n font-size: 14px;\n letter-spacing: -0.3px;\n line-height: 23px;\n @media (min-width: 1280px) {\n font-size: 16px;\n width: calc(100% / 3);\n }\n div {\n font-size: 12px;\n color: #595959;\n display: none;\n @media (min-width: 1280px) {\n display: block; \n line-height: 14px;\n }\n }\n }\n }\n .tile-footer {\n display: flex;\n justify-content: space-between;\n position: relative;\n z-index: 16;\n margin-top: 0;\n @media (min-width: 576px) {\n margin-top: 20px;\n }\n .tile-footer-left {\n flex-basis: 55%;\n @media (min-width: 576px) {\n flex-basis: 55%;\n }\n @media (min-width: 1280px) {\n flex-basis: auto;\n }\n .highlights {\n margin-top: 25px;\n font-size: 12px;\n display: flex;\n flex-direction: column;\n min-height: 20px;\n @media (min-width: 1280px) {\n flex-direction: row;\n }\n @media (min-width: 576px) {\n margin-top: 10px;\n }\n & > div {\n margin-right: 5px;\n position: relative;\n padding-left: 16px;\n letter-spacing: 0;\n line-height: 20px;\n min-height: 20px;\n white-space: nowrap;\n &.show-tick {\n &:before {\n content: "";\n position: absolute;\n width: 12px;\n height: 6px;\n left: 0;\n top: calc(50% - 7px);\n border-bottom: 1px solid #E4001E;\n border-left: 1px solid #E4001E;\n transform: rotate(-45deg);\n }\n }\n @media (min-width: 1280px) {\n margin-right: 10px;\n }\n }\n }\n .consumption-text {\n font-size: 10px;\n letter-spacing: 0;\n line-height: 14px;\n color: #595959;\n margin-top: 23px;\n @media (min-width: 1280px) {\n font-size: 12px;\n }\n @media (min-width: 576px) {\n margin-top: 10px;\n }\n\n .br {\n @media (min-width: 1280px) {\n display: none;\n }\n }\n }\n }\n .tile-footer-right {\n text-align: right;\n color: #ffffff;\n display: flex;\n align-items: end;\n \n @media (min-width: 1280px) {\n padding-top: 0;\n }\n .price-wrap {\n &.external-car {\n margin-top: 0;\n @media (min-width: 1280px) {\n margin-top: 20px;\n }\n }\n .price {\n font-size: 20px;\n font-weight: bold;\n letter-spacing: -0.54px;\n line-height: 22px;\n @media (min-width: 1280px) {\n font-size: 32px;\n font-weight: 700;\n letter-spacing: -0.39px;\n line-height: 35px;\n display: inline-block;\n margin-bottom: 8px;\n }\n }\n div {\n font-size: 10px;\n line-height: 11px;\n @media (min-width: 1280px) {\n font-size: 12px;\n line-height: 13px;\n }\n }\n }\n .monthly-price-wrap {\n font-size: 12px;\n font-weight: 500;\n letter-spacing: -0.15px;\n line-height: 13px;\n text-decoration: underline;\n @media (min-width: 1280px) {\n font-size: 16px;\n letter-spacing: -0.22px;\n line-height: 24px;\n }\n }\n }\n }\n }\n']);return q=function(){return a},a}var r=p.ZP.li.withConfig({componentId:"sc-c2be4eed-0"})(q()),s=c(949),t=c(79046),u=c(30527),v=c(81077),w=c(5076),x=c(5900),y=c(77768),z=c(58122);function A(a){var b,g,m=(0,e.useState)(!1),o=m[0],p=m[1],q=(0,f.v9)(function(a){return a.lists}),A=q.locations,B=(0,f.v9)(function(a){return a.favorites}),C=B.favorites,D=B.compared,E=(0,i.useRouter)().route,F=a.car,G=a.carListContent,H=a.index,I="i3"===F.modelName,J=(0,f.I0)(),K=null===(b=A.concat({i
1d:1,name:"Deutschlandweit"}).find(function(a){return a.id===F.locationId}))|| void 0===b?void 0:b.name,L=(0,l.Z)("(min-width: 1280px)"),M=!!C.find(function(a){return Number(a.id)===(null==F?void 0:F.id)}),N=!!D.find(function(a){return Number(a.id)===(null==F?void 0:F.id)}),O=1===F.exportFinancingParams?I?24:F.leasLaufzeit:F.financingTime,P=1===F.exportFinancingParams?(0,s.bP)(F.modelName,{duration:Number(O),mileage:Number(F.leasKilometerlaufleistung),listenPreisBrutto:null==F?void 0:F.listenpreisBrutto,faktorOhneSonderzahlung:null==F?void 0:F.faktorOhneSonderzahlung,prozRwOhneSonderzahlung:null==F?void 0:F.prozRwOhneSonderzahlung,prozRwMitSonderzahlung:null==F?void 0:F.prozRwMitSonderzahlung,faktorMitSonderzahlung:null==F?void 0:F.faktorMitSonderzahlung},null==F?void 0:F.leasMonatsrate):(0,s.uY)(null==F?void 0:F.financingMonthlyRate);return(0,d.jsx)(r,{className:"list-unstyled ".concat(F.isOldest?"oldest":""," ").concat(o?"share-active ":""),children:(0,d.jsx)(h(),{href:"/gebrauchtwagen/cars/".concat(F.id),prefetch:!1,children:(0,d.jsxs)("a",{className:"link-wrap",onClick:function(){J({type:w.SET_VISITED_URL,payload:window.location.href}),(0,u.Db)({eventCategory:"filter-".concat((0,u.ZX)({route:E})),model:(0,s.bJ)(F),price:F.price})},children:[F.isOldest&&(0,d.jsx)("div",{className:"top-car",children:"TOP Angebot"}),(0,d.jsx)("div",{className:"car-image-wrapper",children:(0,d.jsx)("div",{className:"car-image",children:(0,d.jsx)(x.Z,{priority:0===H,width:L?351:516,height:L?255:344,src:decodeURIComponent(F.image),alt:"".concat(F.brandName," ").concat((0,s.BL)(F.title)," Gebrauchtwagen")})})}),(0,d.jsx)("div",{className:"car-description-wrap",children:(0,d.jsxs)("div",{className:"car-description",children:[(0,d.jsxs)("div",{className:"d-flex justify-content-between align-items-center car-description-btns",children:[(0,d.jsxs)("div",{className:"car-title",title:"".concat(F.brandName," ").concat((0,s.BL)(F.title)),children:[F.brandName," ",(0,s.BL)(F.title)]}),(0,d.jsx)(y.Z,{className:"cars-page-btn",isCompareActive:N,handleClick:function(a){a.preventDefault(),(0,z.S)(a,{id:F.id,title:F.title,fuel:F.fuel,gear:F.gear,mileage:(0,s.uY)(F.mileage),locationId:F.locationId,price:(0,s.uY)(F.price),addedAt:(0,j.default)(new Date,"dd.MM.yyyy"),ps:F.ps,registrationDate:F.registrationDate,brandName:(null==F?void 0:F.brandName)||"",modelName:F.modelName||"",locationName:K||""},J)}}),(0,d.jsx)("div",{className:"share-wrap",children:(0,d.jsx)(v.Z,{handleClick:function(a){a.preventDefault(),p(!0)},pricePerMonth:P,car:F,handleClickAway:function(){return p(!1)}})}),(0,d.jsx)(t.Z,{hasText:!0,isBlack:!0,isFavorite:M,handleClick:function(a){a.preventDefault(),M||(0,u.M8)({eventCategory:"filter-".concat((0,u.ZX)({route:E})),model:(0,s.bJ)(F),price:F.price}),c.e(9536).then(c.bind(c,29536)).then(function(b){b.storeFavorite(a,{id:F.id,title:F.title,fuel:F.fuel,gear:F.gear,mileage:(0,s.uY)(F.mileage),locationId:F.locationId,price:(0,s.uY)(F.price),addedAt:(0,j.default)(new Date,"dd.MM.yyyy"),ps:F.ps,registrationDate:F.registrationDate,brandName:(null==F?void 0:F.brandName)||"",modelName:F.modelName||"",locationName:K||""},J)})}})]}),(0,d.jsxs)("ul",{className:"car-overview-wrap list-unstyled",children:[(0,d.jsxs)("li",{children:[(0,d.jsx)("div",{children:"Kilometerstand"}),(0,d.jsxs)("span",{children:[(0,s.uY)(F.mileage)," km"]})]}),(0,d.jsxs)("li",{children:[(0,d.jsx)("div",{children:"Erstzulassung"}),(0,d.jsx)("span",{children:(0,j.default)((0,k.default)(F.registrationDate),"MM/yyyy")})]}),(0,d.jsxs)("li",{children:[(0,d.jsx)("div",{children:"Leistung"}),(0,d.jsxs)("span",{children:[F.ps," PS/",F.kw," kW"]})]}),(0,d.jsxs)("li",{children:[(0,d.jsx)("div",{children:"Treibstoff"}),(0,d.jsx)("span",{children:F.fuel})]}),(0,d.jsxs)("li",{children:[(0,d.jsx)("div",{children:"Getriebe"}),(0,d.jsx)("span",{children:F.gear})]}),(0,d.jsxs)("li",{children:[(0,d.jsx)("div",{children:"Standort"}),(0,d.jsx)("span",{children:K})]})]}),(0,d.jsxs)("div",{className:"tile-footer",children:[(0,d.jsxs)("div",{className:"tile-footer-left",children:[(0,d.jsxs)("div",{className:"highlights d-flex",children:[F.highlights1?(0,d.jsx)("div",{className:F.highlights1?"show-tick":"",children:F.highlights1}):null,F.highlights2?(0,d.jsx)("div",{className:F.highlights2?"show-tick":"",children:F.highlights2}):null,F.batteryCertificateUrl?(0,d.jsx)("div",{className:F.batteryCertificateUrl?"show-tick":"",children:"Batteriezertifikat"}):null]}),(0,d.jsxs)("div",{className:"consumption-text",children:[(0,d.jsx)("div",{children:"Energieverbrauch (".concat(F.isPluginHybrid?"gewichtet, kombiniert)":"kombiniert)",": ").concat((0,s.DE)(F))}),(0,d.jsx)("div",{children:"COâ-Emissionen kombiniert: ".concat((0,s.S6)(F)," ").concat("k.A."===(0,s.S6)(F)?"":"g/km")}),(0,d.jsx)("div",{children:"COâ-Klasse: ".concat((0,s.Qo)(F))})]})]}),(0,d.jsx)("div",{className:"tile-footer-right",children:F.external?(null===(g=F.offers)|| void 0===g?void 0:g.length)&&(0,d.jsx)("div",{className:"price-wrap external-car",children:(0,d.jsxs)("div",{children:[(0,d.jsxs)("span",{className:"price",children:[(0,s.uY)(function(){if(!(null===(a=F.offers)|| void 0===a?void 0:a.length))return 0;var a,b,c=n()(F.offers,"runningTime");return((null===(b=F.offers)|| void 0===b?void 0:b.find(function(a){return a.default}))||c[Object.keys(c).sort()[0]][0]).monthlyPrice||0}())," ","â¬"]}),(0,d.jsx)("div",{children:"mtl. inkl. MwSt"})]})}):(0,d.jsxs)("div",{className:"price-button-wrap",children:[(0,d.jsx)("div",{className:"price-wrap align-self-md-end",children:(0,d.jsxs)("div",{children:[(0,d.jsxs)("span",{className:"price",children:[(0,s.uY)(F.price),"â¬"]})," ",(0,d.jsx)("div",{children:"inkl.MwSt."})]})}),0!==F.exportFinancingParams&&(0,d.jsxs)("div",{className:"monthly-price-wrap",children:[(0,d.jsx)("span",{dangerouslySetInnerHTML:{__html:G.price.value.replace(/{.*}/,String(P))}})," ",1===F.exportFinancingParams?"leasen":"finanzieren"]})]})})]})]})}),(0,d.jsx)("div",{className:"item-bg"})]})})})}}}])
Line numbers count LF bytes from the start of the resource, as the search results do. Vendor segments are library code the classifier recognised; they are stored but not indexed. Bytes are shown as Latin1 characters, one per byte.