From f7ce215ad726820f6a9bce444a1db80f160347b7 Mon Sep 17 00:00:00 2001
From: "k.triantafyllou" <k.triantafyllou@di.uoa.gr>
Date: Wed, 22 Mar 2023 16:07:27 +0200
Subject: [PATCH] 1. Change border color in flat inputs to gray-300. 2. Cards:
 Disabled apply opacity only in content. Accordion: Change arrows and size of
 icon and align content before icon. 3. Made off-canvar full screen in mobile.

---
 less/accordion.less | 30 +++++++++++++++++++++++++-----
 less/card.less      |  9 +++++++--
 less/color.less     |  1 +
 less/input.less     |  2 +-
 less/offcanvas.less |  2 +-
 less/search.less    |  2 +-
 6 files changed, 36 insertions(+), 10 deletions(-)

diff --git a/less/accordion.less b/less/accordion.less
index 527ba30..006c733 100644
--- a/less/accordion.less
+++ b/less/accordion.less
@@ -3,16 +3,20 @@
 @accordion-padding-bottom: 20px;
 
 @accordion-title-font-size: @global-large-font-size;
+@accordion-title-font-size-s: @global-font-size;
 @accordion-title-padding-vertical: 5px;
 @accordion-title-padding-horizontal: 0;
 @accordion-title-background: transparent;
 @accordion-title-color: @global-emphasis-color;
-@accordion-title-hover-color: @global-primary-background;
+@accordion-title-hover-color: @accordion-title-color;
 @accordion-title-font-weight: 600;
 
 @accordion-icon-margin-left: 10px;
 @accordion-icon-color: @global-primary-background;
 
+@accordion-content-font-size: @global-font-size;
+@accordion-content-font-size-s: @global-small-font-size;
+
 .uk-accordion > * {
   padding-bottom: @accordion-padding-bottom;
   border-bottom: @accordion-border-width solid @accordion-border;
@@ -25,20 +29,36 @@
   font-weight: @accordion-title-font-weight;
 
   &::before {
-    content: "\e5cc";
+    content: "\e5cf";
     font-family: "Material Icons";
-    font-size: 2em;
+    font-size: 1.5em;
     line-height: inherit;
     margin-left: @accordion-icon-margin-left;
-    margin-top: -0.4em;
+    margin-top: -0.3em;
     float: right;
     color: @accordion-icon-color;
   }
 
 }
 
+.hook-accordion-content() {
+  font-size: @accordion-content-font-size;
+  margin-right: 1.5*@accordion-title-font-size;
+}
+
 .hook-accordion-misc() {
+  @media(max-width: @breakpoint-small-max) {
+    .uk-accordion-title {
+      font-size: @accordion-title-font-size-s;
+    }
+
+    .uk-accordion-content {
+      font-size: @accordion-content-font-size-s;
+      margin-right: 1.5*@accordion-title-font-size-s;
+    }
+  }
+
   .uk-open > .uk-accordion-title::before {
-    content: "\e5cf"
+    content: "\e5ce"
   }
 }
diff --git a/less/card.less b/less/card.less
index 01a6112..d03ea1b 100644
--- a/less/card.less
+++ b/less/card.less
@@ -44,7 +44,10 @@
   &.uk-disabled {
     box-shadow: @card-disabled-box-shadow;
     border: @card-disabled-border-width solid @card-disabled-border;
-    opacity: @card-disabled-opacity;
+
+    .uk-card-media-top, .uk-card-body, .uk-card-media-bottom {
+      opacity: @card-disabled-opacity;
+    }
   }
 
   &:not(.uk-card-default, .uk-card-primary, .uk-card-secondary):hover {
@@ -92,7 +95,9 @@
   @media (min-width: @breakpoint-medium) {
     .uk-card {
       &.uk-disabled {
-        opacity: @card-disabled-opacity-m;
+        .uk-card-media-top, .uk-card-body, .uk-card-media-bottom {
+          opacity: @card-disabled-opacity-m;
+        }
       }
     }
 
diff --git a/less/color.less b/less/color.less
index 0903f43..36056a8 100644
--- a/less/color.less
+++ b/less/color.less
@@ -7,6 +7,7 @@
 @grey-color: #2C2C2C;
 @placeholder-color: #6e6e6e;
 @disable-color: #B3B3B3;
+@gray-300: #DDDDDD;
 @muted-color: #EAEAEA;
 @light-color: #FFFFFF;
 @table-color: #F5F5F5;
diff --git a/less/input.less b/less/input.less
index f03491b..9387223 100644
--- a/less/input.less
+++ b/less/input.less
@@ -242,7 +242,7 @@
 
   &.flat {
     --input-background: @global-inverse-color;
-    --input-border: @global-muted-color;
+    --input-border: @gray-300;
   }
 
   &.border-bottom {
diff --git a/less/offcanvas.less b/less/offcanvas.less
index 1e98da8..b8eef85 100644
--- a/less/offcanvas.less
+++ b/less/offcanvas.less
@@ -13,7 +13,7 @@
 @offcanvas-count-background: @global-secondary-background;
 @offcanvas-count-color: @global-inverse-color;
 
-@offcanvas-bar-width: 350px;
+@offcanvas-bar-width: 100vw;
 @offcanvas-bar-padding-vertical: @global-medium-gutter;
 @offcanvas-bar-padding-horizontal: @global-medium-gutter;
 @offcanvas-bar-width-m: 550px;
diff --git a/less/search.less b/less/search.less
index 784e3ab..4a29f67 100644
--- a/less/search.less
+++ b/less/search.less
@@ -92,7 +92,7 @@
     &.flat {
       --search-input-background: @global-inverse-color;
       --search-input-border-width: @global-border-width;
-      --search-input-border: @global-muted-color;
+      --search-input-border: @gray-300;
     }
 
     &.outer {