From 838debaad24cc6f3d5be98ef26f6ea2feeb93a88 Mon Sep 17 00:00:00 2001
From: Isabelle Chanclou <isabelle.chanclou@orange.com>
Date: Mon, 3 Oct 2022 19:51:30 +0200
Subject: [PATCH] Add new css vars for Offcanvas (#36815)

* Add 3 new css vars for Offcanvas feature

* Fix new css variable after review

* Update _offcanvas.scss

Co-authored-by: Mark Otto <otto@github.com>
---
 scss/_offcanvas.scss | 7 +++++--
 1 file changed, 5 insertions(+), 2 deletions(-)

diff --git a/scss/_offcanvas.scss b/scss/_offcanvas.scss
index 23fc357f2b..b68f802718 100644
--- a/scss/_offcanvas.scss
+++ b/scss/_offcanvas.scss
@@ -12,6 +12,9 @@
   --#{$prefix}offcanvas-border-width: #{$offcanvas-border-width};
   --#{$prefix}offcanvas-border-color: #{$offcanvas-border-color};
   --#{$prefix}offcanvas-box-shadow: #{$offcanvas-box-shadow};
+  --#{$prefix}offcanvas-zindex: #{$zindex-offcanvas};
+  --#{$prefix}offcanvas-transition: #{transform $offcanvas-transition-duration ease-in-out};
+  --#{$prefix}offcanvas-title-line-height: #{$offcanvas-title-line-height};
   // scss-docs-end offcanvas-css-vars
 }
 
@@ -42,7 +45,7 @@
       background-clip: padding-box;
       outline: 0;
       @include box-shadow(var(--#{$prefix}offcanvas-box-shadow));
-      @include transition(transform $offcanvas-transition-duration ease-in-out);
+      @include transition(var(--#{$prefix}offcanvas-transition));
 
       &.offcanvas-start {
         top: 0;
@@ -134,7 +137,7 @@
 
 .offcanvas-title {
   margin-bottom: 0;
-  line-height: $offcanvas-title-line-height;
+  line-height: var(--#{$prefix}offcanvas-title-line-height);
 }
 
 .offcanvas-body {