From 1cd39b094e1499d15f2db9e928f80eeb3a96c35f Mon Sep 17 00:00:00 2001
From: gnezim <gnezim@gmail.com>
Date: Mon, 20 Apr 2026 03:30:15 +0300
Subject: [PATCH] Match Angular per-carrier OperatorLogo aspect ratios (120x31
 SU, etc)

---
 src/ui/flights/OperatorLogo.scss | 46 +++++++++++++++++++++++++-------
 1 file changed, 37 insertions(+), 9 deletions(-)

diff --git a/src/ui/flights/OperatorLogo.scss b/src/ui/flights/OperatorLogo.scss
index 6abcc31a..865ae4b2 100644
--- a/src/ui/flights/OperatorLogo.scss
+++ b/src/ui/flights/OperatorLogo.scss
@@ -1,29 +1,57 @@
+// Mirrors Angular's `_logos.scss` sizing: per-carrier @include scale()
+// with a 120px base width and aspect-ratio-specific height. Most wide
+// logos (SU, F7, KL…) render at ~120×31; FV/Rossiya is narrower, HZ/Aurora
+// tall-square. We bake in the common ratios instead of a one-size-fits-all
+// 90×24 that previously clipped SU's ascender.
 .operator-logo {
   display: inline-block;
-  width: 90px;
-  height: 24px;
+  width: 120px;
+  height: 31px;
   background-repeat: no-repeat;
   background-size: contain;
   background-position: left center;
   flex-shrink: 0;
 
   &--round {
-    // Angular: round badges are 36×36px square, designed as round
-    // icons (separate `round.png` asset). `contain` keeps the icon
-    // intact without cropping the wide-logo SVG.
     width: 36px;
     height: 36px;
     background-size: contain;
     background-position: center;
   }
 
+  // Large (1.5× scale) used in the details-header badge. Angular keeps
+  // round icons the same size even when 'large' is set.
   &--large {
-    width: 140px;
-    height: 36px;
+    width: 180px;
+    height: 46px;
+
+    &.operator-logo--round { width: 36px; height: 36px; }
+  }
+
+  // Carrier-specific aspect ratios transcribed from Angular's _logos.scss
+  // @include scale($width-base, $ratio) calls.
+  &--SU,
+  &--F7 { width: 120px; height: 31px; }
+  &--HZ { width: 80px; height: 44px; }
+  &--FV { width: 90px; height: 15px; }
+  &--RO { width: 120px; height: 40px; }
+  &--DP { width: 120px; height: 23px; }
+  &--KL { width: 120px; height: 53px; }
+  &--S7 { width: 120px; height: 40px; }
+  &--SN { width: 120px; height: 20px; }
+  &--FB { width: 120px; height: 36px; }
+  &--CI { width: 120px; height: 19px; }
+  &--AF { width: 120px; height: 15px; }
+  &--AZ { width: 120px; height: 29px; }
+
+  @media (min-width: 641px) and (max-width: 1050px) {
+    // Angular's tablets() scale: width & height * 0.75.
+    width: 90px;
+    height: 23px;
   }
 }
 
 .details-header-badge__airline .operator-logo {
-  width: 140px;
-  height: 36px;
+  width: 180px;
+  height: 46px;
 }