From 46a30c8576946f6e46046c2c43eed4d4aabf3263 Mon Sep 17 00:00:00 2001
From: ichim-david <ichim.david@gmail.com>
Date: Wed, 22 May 2024 17:08:50 +0300
Subject: [PATCH] breaking(buttons): style circular.basic and basic.floated
 buttons as circular.icon

---
 package.json                               |  2 +-
 theme/themes/eea/elements/button.overrides | 10 +++++++++-
 theme/themes/eea/elements/button.variables |  6 +++++-
 3 files changed, 15 insertions(+), 3 deletions(-)

diff --git a/package.json b/package.json
index 597b5db05d..44db22972a 100644
--- a/package.json
+++ b/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@eeacms/volto-eea-design-system",
-  "version": "1.23.8",
+  "version": "1.30.0",
   "description": "@eeacms/volto-eea-design-system: Volto add-on",
   "main": "src/index.js",
   "author": "European Environment Agency: IDM2 A-Team",
diff --git a/theme/themes/eea/elements/button.overrides b/theme/themes/eea/elements/button.overrides
index 38d8bccb62..8b0afffacc 100644
--- a/theme/themes/eea/elements/button.overrides
+++ b/theme/themes/eea/elements/button.overrides
@@ -80,13 +80,21 @@
 *******************************/
 // ensure circular button gets the border color of the current text color
 // and acts as a circular button
+.ui.circular.basic.button,
+.ui.basic.floated.button,
 .ui.circular.icon.button {
   padding: @circularButtonPadding;
   border-width: @circularButtonBorderWidth;
   border-color: @circularButtonBorderColor;
+  border-radius: @circularButtonBorderRadius;
   line-height: @circularButtonLineHeight;
 }
 
+.ui.basic.button > .icon {
+  margin: @basicButtonIconMargin;
+  vertical-align: @basicButtonIconVerticalAlign;
+}
+
 // toolbar yes and cancel icons go outside the button area with default line
 // height
 #toolbar .toolbar-content button,
@@ -140,8 +148,8 @@ p.ui.button {
 .ui.button.search {
   box-sizing: border-box;
   border: @buttonBorder @white;
-  background: @searchButtonBackground;
   border-radius: @searchButtonBorderRadius;
+  background: @searchButtonBackground;
   color: @searchButtonColor;
   font-size: @searchButtonFontSize;
 
diff --git a/theme/themes/eea/elements/button.variables b/theme/themes/eea/elements/button.variables
index a66095b464..e10731a75f 100644
--- a/theme/themes/eea/elements/button.variables
+++ b/theme/themes/eea/elements/button.variables
@@ -254,6 +254,9 @@
 @basicLoadingColor: @offWhite;
 @basicTextTransform: none;
 
+@basicButtonIconMargin: 0 !important;
+@basicButtonIconVerticalAlign: top;
+
 /* Basic Hover */
 @basicHoverBackground: #FFFFFF;
 @basicHoverTextColor: @hoveredTextColor;
@@ -303,9 +306,10 @@
 /* Circular */
 @circularButtonBorderWidth: 2px;
 @circularButtonBorderColor: currentColor;
-@circularButtonPadding: 0.25em;
+@circularButtonPadding: 0;
 @circularButtonIconFontSize: 1.375em;
 @circularButtonLineHeight: 1;
+@circularButtonBorderRadius: 50%;
 
 /*-------------------
       Variations