From 18617b32c99c33c1b0c442b608af98f2cc871cfb Mon Sep 17 00:00:00 2001
From: Victor Sales <36749678+v1ctorsales@users.noreply.github.com>
Date: Fri, 17 Oct 2025 17:45:53 +0300
Subject: [PATCH] refactor: reduce duplicated CSS using less variables

---
 src/routes/Calendar/Table/Cell/Cell.less | 64 +++++++++++-------------
 1 file changed, 30 insertions(+), 34 deletions(-)

diff --git a/src/routes/Calendar/Table/Cell/Cell.less b/src/routes/Calendar/Table/Cell/Cell.less
index c1f25fe46..2ea7c6a74 100644
--- a/src/routes/Calendar/Table/Cell/Cell.less
+++ b/src/routes/Calendar/Table/Cell/Cell.less
@@ -2,6 +2,25 @@
 
 @import (reference) '~stremio/common/screen-sizes.less';
 
+.disable-cell-items() {
+    .cell {
+        .items {
+            .item {
+                pointer-events: none;
+            }
+        }
+    }
+}
+
+.compact-items() {
+    .cell {
+        .items {
+            padding: 1px;
+            gap: 0.15rem;
+        }
+    }
+}
+
 .cell {
     position: relative;
     display: flex;
@@ -138,47 +157,26 @@
 }
 
 @media only screen and (max-width: @minimum) {
-    .cell {
-        .items {
-            .item {
-                pointer-events: none;
-            }
-        }
-    }
+    .disable-cell-items();
 }
 
 @media @phone-portrait {
     .cell {
         flex-direction: column;
         display: grid;
-
-        .items {
-            padding: 1px;
-            gap: 0.15rem;
-
-            .item {
-                pointer-events: none;
-            }
-        }
     }
+    .compact-items();
+    .disable-cell-items();
 }
 
 @media @phone-landscape {
     .cell {
         flex-direction: row;
-
-        .items {
-            padding: 1px;
-            gap: 0.15rem;
-
-            .item {
-                pointer-events: none;
-            }
-        }
     }
+    .compact-items();
+    .disable-cell-items();
 }
 
-
 @media only screen and (max-height: @medium) and (max-width: @medium) and (orientation: landscape) {
     .cell {
         gap: 0;
@@ -207,12 +205,10 @@
     }
 }
 
-@media screen and (min-width: @small-phone-portrait-size) and (max-width: @small) and (orientation: portrait) {
-    .cell {
-        .items {
-            .item {
-                pointer-events: none;
-            }
-        }
-    }
+@media screen and (max-width: @small) and (orientation: portrait) {
+    .disable-cell-items();
+}
+
+@media screen and (min-width: @small-phone-portrait-size) and (max-width: @small) and (orientation: portrait) {
+    .disable-cell-items();
 }