From cddce21f7ba2e653fe59db235736c9a531784d3c Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Javi=20Mart=C3=ADn?= <javim@elretirao.net>
Date: Fri, 28 Feb 2025 13:26:33 +0100
Subject: [PATCH] Simplify calc rules with rem-calc inside

The interpolation of the rem-calc function made the code harder to read.
Besides, for new code we've already agreed upon using rem units instead
of `rem-calc`.

For instance, we had the following code:

```
width: calc(100% - #{2 * rem-calc(10)});
```

Now, `2 * rem-calc(10)` is the same as `rem-calc(20)`, but we were using
`2 *` to make it clear that this value was related to the value of the
`margin-left` property, which was `rem-calc(10)`.

IMHO using `0.625rem` for the margin and `2 * 0.625rem` for the width
the code is easier to read because there are no interpolation and no
complex operations involved.
---
 app/assets/stylesheets/admin/budgets/index.scss           | 2 +-
 .../stylesheets/admin/machine_learning/settings.scss      | 2 +-
 app/assets/stylesheets/legislation_process_form.scss      | 8 ++++----
 3 files changed, 6 insertions(+), 6 deletions(-)

diff --git a/app/assets/stylesheets/admin/budgets/index.scss b/app/assets/stylesheets/admin/budgets/index.scss
index 6de3c0a0b..baf365ea2 100644
--- a/app/assets/stylesheets/admin/budgets/index.scss
+++ b/app/assets/stylesheets/admin/budgets/index.scss
@@ -2,7 +2,7 @@
 
   .budget-completed,
   .budget-draft {
-    padding-left: calc(1em + #{rem-calc(10)});
+    padding-left: calc(1em + 0.625rem);
     position: relative;
 
     &::before {
diff --git a/app/assets/stylesheets/admin/machine_learning/settings.scss b/app/assets/stylesheets/admin/machine_learning/settings.scss
index 9ec712617..51da29948 100644
--- a/app/assets/stylesheets/admin/machine_learning/settings.scss
+++ b/app/assets/stylesheets/admin/machine_learning/settings.scss
@@ -5,7 +5,7 @@
     flex-wrap: wrap;
 
     > * {
-      flex-basis: calc((#{rem-calc(720)} - 100%) * 999);
+      flex-basis: calc((45rem - 100%) * 999);
       flex-grow: 1;
     }
 
diff --git a/app/assets/stylesheets/legislation_process_form.scss b/app/assets/stylesheets/legislation_process_form.scss
index 14ccdf86e..c94afb042 100644
--- a/app/assets/stylesheets/legislation_process_form.scss
+++ b/app/assets/stylesheets/legislation_process_form.scss
@@ -9,13 +9,13 @@
       bottom: 0;
       content: "";
       display: block;
-      margin-left: rem-calc(16);
+      margin-left: 1rem;
       position: absolute;
-      width: calc(100% - #{2 * rem-calc(16)});
+      width: calc(100% - 2 * 1rem);
 
       @include breakpoint(small only) {
-        margin-left: rem-calc(10);
-        width: calc(100% - #{2 * rem-calc(10)});
+        margin-left: 0.625rem;
+        width: calc(100% - 2 * 0.625rem);
       }
     }