From 6232e6e9cfee4dc27ca2be46274c64d94a937564 Mon Sep 17 00:00:00 2001
From: andresin87 <andresin87@gmail.com>
Date: Thu, 19 Dec 2024 10:40:44 +0100
Subject: [PATCH] fix(utils/sui-theme): opacity native functionality

---
 utils/sui-theme/src/utils/_opacity.scss | 6 +++---
 1 file changed, 3 insertions(+), 3 deletions(-)

diff --git a/utils/sui-theme/src/utils/_opacity.scss b/utils/sui-theme/src/utils/_opacity.scss
index 78ea8fbe9..ef4ed88cb 100644
--- a/utils/sui-theme/src/utils/_opacity.scss
+++ b/utils/sui-theme/src/utils/_opacity.scss
@@ -4,11 +4,11 @@
 // @include bgcolor-opacity($c-black);
 
 @mixin bgcolor-opacity($color) {
-  background-color: rgba($color, 1);
+  background-color: color-mix(in srgb, $color 100%, transparent);
 
   @each $value in $c-opacity {
     &-#{$value} {
-      background-color: rgba($color, $value * 0.01);
+      background-color: color-mix(in srgb, #{$value '%'}, transparent);
     }
   }
 }
@@ -19,7 +19,7 @@
       position: relative;
 
       &::before {
-        background-color: rgba($color, $value * 0.01);
+        background-color: color-mix(in srgb, #{$value '%'}, transparent);
         content: '';
         display: block;
         height: 100%;