From ad28240bdf136efa9e07b742af1fa409b61ceaaa Mon Sep 17 00:00:00 2001
From: Hannelore Verbraekel <hannelore.verbraekel@mylighthouse.com>
Date: Tue, 28 May 2024 15:37:44 +0200
Subject: [PATCH 1/4] Added support for css variables in ember-power-calendar
 mixin

---
 ember-power-calendar/scss/base.scss | 32 ++++++++++++++---------------
 1 file changed, 16 insertions(+), 16 deletions(-)

diff --git a/ember-power-calendar/scss/base.scss b/ember-power-calendar/scss/base.scss
index cfc0afa3..dd82a598 100644
--- a/ember-power-calendar/scss/base.scss
+++ b/ember-power-calendar/scss/base.scss
@@ -90,15 +90,15 @@
   $cell-size: null,
   $cell-width: $cell-size,
   $cell-height: $cell-size,
-  $cell-with-spacing-width: $cell-width + 2px,
+  $cell-with-spacing-width: calc(#{$cell-width} + 2px)
   $row-padding-top: 0,
   $row-padding-bottom: 0,
   $row-padding-left: 0,
   $row-padding-right: 0,
-  $row-width: (
-    $cell-with-spacing-width * 7 - 2px + $row-padding-left + $row-padding-right,
+  $row-width: calc(
+    #{$cell-with-spacing-width} * 7 - 2px + #{$row-padding-left} + #{$row-padding-right},
   ),
-  $row-height: $cell-height + 2px,
+  $row-height: calc(#{$cell-height} + 2px),
   $primary-color: #0078c9,
   $nav-button-color: $primary-color,
   $nav-button-color--focus: lighten($nav-button-color, 20%),
@@ -124,53 +124,53 @@
 
   .ember-power-calendar-week:first-child {
     &[data-missing-days="1"] {
-      padding-left: $cell-with-spacing-width * 1;
+      padding-left: calc(#{$cell-with-spacing-width} * 1);
     }
 
     &[data-missing-days="2"] {
-      padding-left: $cell-with-spacing-width * 2;
+      padding-left: calc(#{$cell-with-spacing-width} * 2);
     }
 
     &[data-missing-days="3"] {
-      padding-left: $cell-with-spacing-width * 3;
+      padding-left: calc(#{$cell-with-spacing-width} * 3);
     }
 
     &[data-missing-days="4"] {
-      padding-left: $cell-with-spacing-width * 4;
+      padding-left: calc(#{$cell-with-spacing-width} * 4);
     }
 
     &[data-missing-days="5"] {
-      padding-left: $cell-with-spacing-width * 5;
+      padding-left: calc(#{$cell-with-spacing-width} * 5);
     }
 
     &[data-missing-days="6"] {
-      padding-left: $cell-with-spacing-width * 6;
+      padding-left: calc(#{$cell-with-spacing-width} * 6);
     }
   }
 
   .ember-power-calendar-week:last-child {
     &[data-missing-days="1"] {
-      padding-right: $cell-with-spacing-width * 1;
+      padding-right: calc(#{$cell-with-spacing-width} * 1);
     }
 
     &[data-missing-days="2"] {
-      padding-right: $cell-with-spacing-width * 2;
+      padding-right: calc(#{$cell-with-spacing-width} * 2);
     }
 
     &[data-missing-days="3"] {
-      padding-right: $cell-with-spacing-width * 3;
+      padding-right: calc(#{$cell-with-spacing-width} * 3);
     }
 
     &[data-missing-days="4"] {
-      padding-right: $cell-with-spacing-width * 4;
+      padding-right: calc(#{$cell-with-spacing-width} * 4);
     }
 
     &[data-missing-days="5"] {
-      padding-right: $cell-with-spacing-width * 5;
+      padding-right: calc(#{$cell-with-spacing-width} * 5);
     }
 
     &[data-missing-days="6"] {
-      padding-right: $cell-with-spacing-width * 6;
+      padding-right: calc(#{$cell-with-spacing-width} * 6);
     }
   }
 

From 33484a712bb5dc5ba88cd025be57b5b2788c4d71 Mon Sep 17 00:00:00 2001
From: Hannelore Verbraekel <hannelore.verbraekel@mylighthouse.com>
Date: Tue, 28 May 2024 16:01:44 +0200
Subject: [PATCH 2/4] Add missing comma

---
 ember-power-calendar/scss/base.scss | 33 +++++++++++++++--------------
 1 file changed, 17 insertions(+), 16 deletions(-)

diff --git a/ember-power-calendar/scss/base.scss b/ember-power-calendar/scss/base.scss
index dd82a598..c34e34f0 100644
--- a/ember-power-calendar/scss/base.scss
+++ b/ember-power-calendar/scss/base.scss
@@ -90,14 +90,15 @@
   $cell-size: null,
   $cell-width: $cell-size,
   $cell-height: $cell-size,
-  $cell-with-spacing-width: calc(#{$cell-width} + 2px)
+  $cell-with-spacing-width: calc(#{$cell-width} + 2px),
   $row-padding-top: 0,
   $row-padding-bottom: 0,
   $row-padding-left: 0,
   $row-padding-right: 0,
-  $row-width: calc(
-    #{$cell-with-spacing-width} * 7 - 2px + #{$row-padding-left} + #{$row-padding-right},
-  ),
+  $row-width:
+    calc(
+      #{$cell-with-spacing-width} * 7 - 2px + #{$row-padding-left} + #{$row-padding-right}
+    ),
   $row-height: calc(#{$cell-height} + 2px),
   $primary-color: #0078c9,
   $nav-button-color: $primary-color,
@@ -123,53 +124,53 @@
   width: $row-width;
 
   .ember-power-calendar-week:first-child {
-    &[data-missing-days="1"] {
+    &[data-missing-days='1'] {
       padding-left: calc(#{$cell-with-spacing-width} * 1);
     }
 
-    &[data-missing-days="2"] {
+    &[data-missing-days='2'] {
       padding-left: calc(#{$cell-with-spacing-width} * 2);
     }
 
-    &[data-missing-days="3"] {
+    &[data-missing-days='3'] {
       padding-left: calc(#{$cell-with-spacing-width} * 3);
     }
 
-    &[data-missing-days="4"] {
+    &[data-missing-days='4'] {
       padding-left: calc(#{$cell-with-spacing-width} * 4);
     }
 
-    &[data-missing-days="5"] {
+    &[data-missing-days='5'] {
       padding-left: calc(#{$cell-with-spacing-width} * 5);
     }
 
-    &[data-missing-days="6"] {
+    &[data-missing-days='6'] {
       padding-left: calc(#{$cell-with-spacing-width} * 6);
     }
   }
 
   .ember-power-calendar-week:last-child {
-    &[data-missing-days="1"] {
+    &[data-missing-days='1'] {
       padding-right: calc(#{$cell-with-spacing-width} * 1);
     }
 
-    &[data-missing-days="2"] {
+    &[data-missing-days='2'] {
       padding-right: calc(#{$cell-with-spacing-width} * 2);
     }
 
-    &[data-missing-days="3"] {
+    &[data-missing-days='3'] {
       padding-right: calc(#{$cell-with-spacing-width} * 3);
     }
 
-    &[data-missing-days="4"] {
+    &[data-missing-days='4'] {
       padding-right: calc(#{$cell-with-spacing-width} * 4);
     }
 
-    &[data-missing-days="5"] {
+    &[data-missing-days='5'] {
       padding-right: calc(#{$cell-with-spacing-width} * 5);
     }
 
-    &[data-missing-days="6"] {
+    &[data-missing-days='6'] {
       padding-right: calc(#{$cell-with-spacing-width} * 6);
     }
   }

From 5cb1f8032fb51a2e6cc01d8d5355ff5c4a3b03e3 Mon Sep 17 00:00:00 2001
From: Hannelore Verbraekel <hannelore.verbraekel@mylighthouse.com>
Date: Wed, 29 May 2024 14:07:00 +0200
Subject: [PATCH 3/4] Add support for css variables in less

---
 ember-power-calendar/less/base.less | 68 +++++++++++++++--------------
 1 file changed, 35 insertions(+), 33 deletions(-)

diff --git a/ember-power-calendar/less/base.less b/ember-power-calendar/less/base.less
index 98da4349..7b7139e5 100644
--- a/ember-power-calendar/less/base.less
+++ b/ember-power-calendar/less/base.less
@@ -12,7 +12,8 @@
   box-sizing: border-box;
 }
 
-.ember-power-calendar-days, .ember-power-calendar-days * {
+.ember-power-calendar-days,
+.ember-power-calendar-days * {
   box-sizing: border-box;
 }
 
@@ -93,20 +94,20 @@
   @cell-size: null,
   @cell-width: @cell-size,
   @cell-height: @cell-size,
-  @cell-with-spacing-width: @cell-width + 2px,
+  @cell-with-spacing-width: calc(~"@{cell-width} + 2px");
   @row-padding-top: 0,
   @row-padding-bottom: 0,
   @row-padding-left: 0,
   @row-padding-right: 0,
-  @row-width: @cell-with-spacing-width * 7 - 2px + @row-padding-left + @row-padding-right,
-  @row-height: @cell-height + 2px,
+  @row-width: calc(~"(@{cell-with-spacing-width} * 7) - 2px + @{row-padding-left} + @{row-padding-right}");
+  @row-height: calc(~"@{cell-height} + 2px");
   @primary-color: #0078c9,
   @nav-button-color: @primary-color,
   @nav-button-color--focus: lighten(@nav-button-color, 20%),
   @day-default-text-color: #bbb,
   @day-current-month-color: #F5F7FA,
   @day-weekday-text-color: #333333,
-  @day-current-month-text-color: #656D78,
+  @day-current-month-text-color: #656d78,
   @day-other-month-text-color--hover: @day-current-month-text-color,
   @day-focus-shadow-color: @primary-color,
   @day-today-color: #eee,
@@ -118,58 +119,59 @@
   @day-range-end-background-color--hover: @day-range-end-background-color,
   @day-selected-color: lighten(@primary-color, 50%),
   @day-selected-color--hover: @day-selected-color,
-  @day-selected-text-color: #656D78,
+  @day-selected-text-color: #656d78,
   @day-selected-text-color--hover: @day-selected-text-color
 ) {
-
   width: @row-width;
   .ember-power-calendar-week:first-child {
-    &[data-missing-days="1"] {
-      padding-left: @cell-with-spacing-width * 1;
+    &[data-missing-days='1'] {
+      padding-left: calc(~"@{cell-with-spacing-width} * 1");
     }
-    &[data-missing-days="2"] {
-      padding-left: @cell-with-spacing-width * 2;
+    &[data-missing-days='2'] {
+      padding-left: calc(~"@{cell-with-spacing-width} * 2");
     }
-    &[data-missing-days="3"] {
-      padding-left: @cell-with-spacing-width * 3;
+    &[data-missing-days='3'] {
+      padding-left: calc(~"@{cell-with-spacing-width} * 3");
     }
-    &[data-missing-days="4"] {
-      padding-left: @cell-with-spacing-width * 4;
+    &[data-missing-days='4'] {
+      padding-left: calc(~"@{cell-with-spacing-width} * 4");
     }
-    &[data-missing-days="5"] {
-      padding-left: @cell-with-spacing-width * 5;
+    &[data-missing-days='5'] {
+      padding-left: calc(~"@{cell-with-spacing-width} * 5");
     }
-    &[data-missing-days="6"] {
-      padding-left: @cell-with-spacing-width * 6;
+    &[data-missing-days='6'] {
+      padding-left: calc(~"@{cell-with-spacing-width} * 6");
     }
   }
   .ember-power-calendar-week:last-child {
-    &[data-missing-days="1"] {
-      padding-right: @cell-with-spacing-width * 1;
+    &[data-missing-days='1'] {
+      padding-right: calc(~"@{cell-with-spacing-width} * 1");
     }
-    &[data-missing-days="2"] {
-      padding-right: @cell-with-spacing-width * 2;
+    &[data-missing-days='2'] {
+      padding-right: calc(~"@{cell-with-spacing-width} * 2");
     }
-    &[data-missing-days="3"] {
-      padding-right: @cell-with-spacing-width * 3;
+    &[data-missing-days='3'] {
+      padding-right: calc(~"@{cell-with-spacing-width} * 3");
     }
-    &[data-missing-days="4"] {
-      padding-right: @cell-with-spacing-width * 4;
+    &[data-missing-days='4'] {
+      padding-right: calc(~"@{cell-with-spacing-width} * 4");
     }
-    &[data-missing-days="5"] {
-      padding-right: @cell-with-spacing-width * 5;
+    &[data-missing-days='5'] {
+      padding-right: calc(~"@{cell-with-spacing-width} * 5");
     }
-    &[data-missing-days="6"] {
-      padding-right: @cell-with-spacing-width * 6;
+    &[data-missing-days='6'] {
+      padding-right: calc(~"@{cell-with-spacing-width} * 6");
     }
   }
-  .ember-power-calendar-day, .ember-power-calendar-weekday {
+  .ember-power-calendar-day,
+  .ember-power-calendar-weekday {
     max-width: @cell-width;
     max-height: @cell-height;
     width: @cell-width;
     height: @cell-height;
   }
-  .ember-power-calendar-weekdays, .ember-power-calendar-week {
+  .ember-power-calendar-weekdays,
+  .ember-power-calendar-week {
     height: @row-height;
     padding-left: @row-padding-left;
     padding-right: @row-padding-right;

From 84c51ccf787bf1d4169bda0d5890d278aef14092 Mon Sep 17 00:00:00 2001
From: Hannelore Verbraekel <hannelore.verbraekel@mylighthouse.com>
Date: Wed, 29 May 2024 17:50:53 +0200
Subject: [PATCH 4/4] Fix syntax errors and remove beautify changes

---
 ember-power-calendar/less/base.less | 43 ++++++++++++++---------------
 ember-power-calendar/scss/base.scss | 24 ++++++++--------
 2 files changed, 32 insertions(+), 35 deletions(-)

diff --git a/ember-power-calendar/less/base.less b/ember-power-calendar/less/base.less
index 7b7139e5..92b584a6 100644
--- a/ember-power-calendar/less/base.less
+++ b/ember-power-calendar/less/base.less
@@ -12,8 +12,7 @@
   box-sizing: border-box;
 }
 
-.ember-power-calendar-days,
-.ember-power-calendar-days * {
+.ember-power-calendar-days, .ember-power-calendar-days * {
   box-sizing: border-box;
 }
 
@@ -94,20 +93,20 @@
   @cell-size: null,
   @cell-width: @cell-size,
   @cell-height: @cell-size,
-  @cell-with-spacing-width: calc(~"@{cell-width} + 2px");
+  @cell-with-spacing-width: calc(~"@{cell-width} + 2px"),
   @row-padding-top: 0,
   @row-padding-bottom: 0,
   @row-padding-left: 0,
   @row-padding-right: 0,
-  @row-width: calc(~"(@{cell-with-spacing-width} * 7) - 2px + @{row-padding-left} + @{row-padding-right}");
-  @row-height: calc(~"@{cell-height} + 2px");
+  @row-width: calc(~"(@{cell-with-spacing-width} * 7) - 2px + @{row-padding-left} + @{row-padding-right}"),
+  @row-height: calc(~"@{cell-height} + 2px"),
   @primary-color: #0078c9,
   @nav-button-color: @primary-color,
   @nav-button-color--focus: lighten(@nav-button-color, 20%),
   @day-default-text-color: #bbb,
   @day-current-month-color: #F5F7FA,
   @day-weekday-text-color: #333333,
-  @day-current-month-text-color: #656d78,
+  @day-current-month-text-color: #656D78,
   @day-other-month-text-color--hover: @day-current-month-text-color,
   @day-focus-shadow-color: @primary-color,
   @day-today-color: #eee,
@@ -119,59 +118,57 @@
   @day-range-end-background-color--hover: @day-range-end-background-color,
   @day-selected-color: lighten(@primary-color, 50%),
   @day-selected-color--hover: @day-selected-color,
-  @day-selected-text-color: #656d78,
+  @day-selected-text-color: #656D78,
   @day-selected-text-color--hover: @day-selected-text-color
 ) {
   width: @row-width;
   .ember-power-calendar-week:first-child {
-    &[data-missing-days='1'] {
+    &[data-missing-days="1"] {
       padding-left: calc(~"@{cell-with-spacing-width} * 1");
     }
-    &[data-missing-days='2'] {
+    &[data-missing-days="2"] {
       padding-left: calc(~"@{cell-with-spacing-width} * 2");
     }
-    &[data-missing-days='3'] {
+    &[data-missing-days="3"] {
       padding-left: calc(~"@{cell-with-spacing-width} * 3");
     }
-    &[data-missing-days='4'] {
+    &[data-missing-days="4"] {
       padding-left: calc(~"@{cell-with-spacing-width} * 4");
     }
-    &[data-missing-days='5'] {
+    &[data-missing-days="5"] {
       padding-left: calc(~"@{cell-with-spacing-width} * 5");
     }
-    &[data-missing-days='6'] {
+    &[data-missing-days="6"] {
       padding-left: calc(~"@{cell-with-spacing-width} * 6");
     }
   }
   .ember-power-calendar-week:last-child {
-    &[data-missing-days='1'] {
+    &[data-missing-days="1"] {
       padding-right: calc(~"@{cell-with-spacing-width} * 1");
     }
-    &[data-missing-days='2'] {
+    &[data-missing-days="2"] {
       padding-right: calc(~"@{cell-with-spacing-width} * 2");
     }
-    &[data-missing-days='3'] {
+    &[data-missing-days="3"] {
       padding-right: calc(~"@{cell-with-spacing-width} * 3");
     }
-    &[data-missing-days='4'] {
+    &[data-missing-days="4"] {
       padding-right: calc(~"@{cell-with-spacing-width} * 4");
     }
-    &[data-missing-days='5'] {
+    &[data-missing-days="5"] {
       padding-right: calc(~"@{cell-with-spacing-width} * 5");
     }
-    &[data-missing-days='6'] {
+    &[data-missing-days="6"] {
       padding-right: calc(~"@{cell-with-spacing-width} * 6");
     }
   }
-  .ember-power-calendar-day,
-  .ember-power-calendar-weekday {
+  .ember-power-calendar-day, .ember-power-calendar-weekday {
     max-width: @cell-width;
     max-height: @cell-height;
     width: @cell-width;
     height: @cell-height;
   }
-  .ember-power-calendar-weekdays,
-  .ember-power-calendar-week {
+  .ember-power-calendar-weekdays, .ember-power-calendar-week {
     height: @row-height;
     padding-left: @row-padding-left;
     padding-right: @row-padding-right;
diff --git a/ember-power-calendar/scss/base.scss b/ember-power-calendar/scss/base.scss
index c34e34f0..945f4fbe 100644
--- a/ember-power-calendar/scss/base.scss
+++ b/ember-power-calendar/scss/base.scss
@@ -124,53 +124,53 @@
   width: $row-width;
 
   .ember-power-calendar-week:first-child {
-    &[data-missing-days='1'] {
+    &[data-missing-days="1"] {
       padding-left: calc(#{$cell-with-spacing-width} * 1);
     }
 
-    &[data-missing-days='2'] {
+    &[data-missing-days="2"] {
       padding-left: calc(#{$cell-with-spacing-width} * 2);
     }
 
-    &[data-missing-days='3'] {
+    &[data-missing-days="3"] {
       padding-left: calc(#{$cell-with-spacing-width} * 3);
     }
 
-    &[data-missing-days='4'] {
+    &[data-missing-days="4"] {
       padding-left: calc(#{$cell-with-spacing-width} * 4);
     }
 
-    &[data-missing-days='5'] {
+    &[data-missing-days="5"] {
       padding-left: calc(#{$cell-with-spacing-width} * 5);
     }
 
-    &[data-missing-days='6'] {
+    &[data-missing-days="6"] {
       padding-left: calc(#{$cell-with-spacing-width} * 6);
     }
   }
 
   .ember-power-calendar-week:last-child {
-    &[data-missing-days='1'] {
+    &[data-missing-days="1"] {
       padding-right: calc(#{$cell-with-spacing-width} * 1);
     }
 
-    &[data-missing-days='2'] {
+    &[data-missing-days="2"] {
       padding-right: calc(#{$cell-with-spacing-width} * 2);
     }
 
-    &[data-missing-days='3'] {
+    &[data-missing-days="3"] {
       padding-right: calc(#{$cell-with-spacing-width} * 3);
     }
 
-    &[data-missing-days='4'] {
+    &[data-missing-days="4"] {
       padding-right: calc(#{$cell-with-spacing-width} * 4);
     }
 
-    &[data-missing-days='5'] {
+    &[data-missing-days="5"] {
       padding-right: calc(#{$cell-with-spacing-width} * 5);
     }
 
-    &[data-missing-days='6'] {
+    &[data-missing-days="6"] {
       padding-right: calc(#{$cell-with-spacing-width} * 6);
     }
   }