@bytebrand/fe-ui-core 4.1.186 → 4.1.187

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@bytebrand/fe-ui-core",
-  "version": "4.1.186",
+  "version": "4.1.187",
   "description": "UI components for the auto.de project",
   "main": "index.ts",
   "module": "dist/common.js",

package/source/components/VehicleSmallCard/VehicleData/VechiclePriceItem/VechiclePriceItem.styl

@@ -53,7 +53,7 @@
 .priceItemBuy
   border-top: 1px solid rgba(76, 78, 100, 0.12);
 
-  .priceItemPrice
+  +media-tablet-landscape-up()
     transform: translateX(-6px);
 
 .priceItemCategory
@@ -121,7 +121,8 @@
     display: inline-flex;
 
 .priceMtl
-  transform: translateX(6px);
+  &.priceMtlActive
+    transform: translateX(6px);
 
 .priceNewBlock
   flex-shrink: 0;

package/source/components/VehicleSmallCard/VehicleData/VechiclePriceItem/VechiclePriceItem.tsx

@@ -137,7 +137,7 @@ class VehiclePriceItem extends React.Component<IVehiclePriceItemProps> {
                       numbersAfterDot={0}
                       price={perMonthCurrent}
                       postfix={postfix}
-                      className={styles.priceMtl}
+                      className={classnames(styles.priceMtl, { [styles.priceMtlActive]: !!priceSub})}
                       isNew={isStrikeShown}
                       size='semimedium'
                       sub={priceSub}

package/source/components/VehicleSmallCard/VehicleData/VehiclePrice/VehiclePrice.tsx

@@ -140,7 +140,7 @@ class VehiclePrice extends React.Component<IVehiclePriceSectionProps> {
         title: t('vehicleProps:title.financing'),
         prefixOldPrice: vehicleComponentName === 'search' && !isMobileOnly && t('vehicleProps:value.prefixOldPrice'),
         postfix: '3',
-        priceSub: t('vehicleProps:value.priceSub'),
+        priceSub: isMobileOnly ? null : t('vehicleProps:value.priceSub'),
         tooltipDescription: !combineRefAlternative && t('vehicleProps:title.financingDescription')
       },
       {
@@ -150,7 +150,7 @@ class VehiclePrice extends React.Component<IVehiclePriceSectionProps> {
         postfix: '1,3',
         isPriceDisable: !isLeasingActive,
         title: t('vehicleProps:title.leasing'),
-        priceSub: t('vehicleProps:value.priceSub'),
+        priceSub: isMobileOnly ? null : t('vehicleProps:value.priceSub'),
         tooltipDescription: !combineRefAlternative && t('vehicleProps:title.leasingDescription')
       }
     ];
@@ -266,7 +266,7 @@ class VehiclePrice extends React.Component<IVehiclePriceSectionProps> {
         {vehicleComponentName !== 'favorite' && vehicleComponentName !== 'search' && (
           <span className={vehiclePriceTitleClassName}>{t('vehicleProps:title.monthlyFrom')}</span>
         )}
-        {vehicleComponentName === 'search' && isMobileOnly && (
+        {isMobileOnly && !showCompareCheckboxes && (
           <span className={vehiclePriceTitleClassName}>{t('vehicleProps:title.monthlyFrom')}</span>
         )}
         {ListPrices}
@@ -287,7 +287,7 @@ class VehiclePrice extends React.Component<IVehiclePriceSectionProps> {
           </Button>
         ) : null}
         {showOfferBtn ? (
-          <Button color='primary' className={buttonClassNames} onClick={this.onDetailsClick}>{t('vehicleProps:title.toOffer')}</Button>
+          <Button variant={vehicleComponentName === 'recently' ? 'outlined' : 'contained'} className={buttonClassNames} onClick={this.onDetailsClick}>{t('vehicleProps:title.toOffer')}</Button>
         ) : ''}
       </section>
     );

package/source/components/VehicleSmallCard/VehicleSmallCard.styl

@@ -58,7 +58,7 @@
     margin-bottom: 5px;
     padding-bottom: 8px;
     +media-tablet-landscape-up()
-      height: 252px;
+      min-height: 252px;
       box-sizing: border-box;
       border: 1px solid rgba(76, 78, 100, 0.12);
       padding: 10px;
@@ -101,7 +101,7 @@
     & [class*='withStats__topWrapper']
       left: 16px;
       right: 16px;
-      
+
     & [class*='withStats__controls']
       padding: 0 16px;
 
@@ -126,7 +126,7 @@
     & [class*='withStats__topWrapper']
       left: 16px;
       right: 16px;
-      
+
     & [class*='withStats__controls']
       padding: 0 16px;