feat: add option to hover button icon

ICIJ · Jul 15, 2024 · b49404c · b49404c
1 parent 75d2a22
commit b49404c
Show file tree

Hide file tree

Showing 7 changed files with 23 additions and 5 deletions.
diff --git a/package.json b/package.json
@@ -29,7 +29,7 @@
     "@fortawesome/free-regular-svg-icons": "^6.5.2",
     "@fortawesome/free-solid-svg-icons": "^6.5.2",
     "@fortawesome/vue-fontawesome": "^3.0.6",
-    "@icij/murmur-next": "4.3.6",
+    "@icij/murmur-next": "4.3.7",
     "@phosphor-icons/vue": "^2.2.1",
     "@popperjs/core": "^2.11.8",
     "axios": "^1.7.2",

diff --git a/src/components/IconButton.vue b/src/components/IconButton.vue
@@ -12,6 +12,7 @@
       :name="iconLeftOrSpinner"
       :size="iconLeftSize"
       :weight="iconLeftWeight"
+      :hover-weight="iconLeftHoverWeight"
       :spin="loading"
       :spin-duration="loadingDuration"
       class="icon-button__icon-left"
@@ -24,6 +25,7 @@
       :name="iconRightOrSpinner"
       :size="iconRightSize"
       :weight="iconRightWeight"
+      :hover-weight="iconRightHoverWeight"
       :spin="loading"
       :spin-duration="loadingDuration"
       class="icon-button__icon-right"
@@ -45,6 +47,10 @@ const props = defineProps({
     type: String,
     default: null
   },
+  iconLeftHoverWeight: {
+    type: String,
+    default: null
+  },
   iconLeftSize: {
     type: String
   },
@@ -56,6 +62,10 @@ const props = defineProps({
     type: String,
     default: null
   },
+  iconRightHoverWeight: {
+    type: String,
+    default: null
+  },
   iconRightSize: {
     type: String
   },

diff --git a/src/components/SeparatorLine/SeparatorLine.vue b/src/components/SeparatorLine/SeparatorLine.vue
@@ -151,6 +151,11 @@ const vDraggable = {
 
     &:deep(.icon-button) {
       border-color: var(--bs-primary-text-emphasis);
+
+      .phosphor-icon {
+        height: 100%;
+        width: 100%;
+      }
     }
 
     &:deep(.icon-button:hover) {

diff --git a/src/components/SeparatorLine/SeparatorLineDrag.vue b/src/components/SeparatorLine/SeparatorLineDrag.vue
@@ -8,6 +8,7 @@ import IconButton from '@/components/IconButton'
     pill
     hide-label
     icon-left="hand-grabbing"
+    icon-left-hover-weight="bold"
     label="Drag"
     size="sm"
     variant="outline-dark"

diff --git a/src/components/SeparatorLine/SeparatorLineExpand.vue b/src/components/SeparatorLine/SeparatorLineExpand.vue
@@ -8,6 +8,7 @@ import IconButton from '@/components/IconButton'
     pill
     hide-label
     icon-left="arrow-line-right"
+    icon-left-hover-weight="bold"
     label="Expand"
     size="sm"
     variant="outline-dark"

diff --git a/src/components/SeparatorLine/SeparatorLineReduce.vue b/src/components/SeparatorLine/SeparatorLineReduce.vue
@@ -8,6 +8,7 @@ import IconButton from '@/components/IconButton'
     pill
     hide-label
     icon-left="arrow-line-left"
+    icon-left-hover-weight="bold"
     label="Reduce"
     size="sm"
     variant="outline-dark"

diff --git a/yarn.lock b/yarn.lock
@@ -1643,10 +1643,10 @@
     eslint-plugin-vue "^9.9.0"
     prettier "^2.8.4"
 
-"@icij/[email protected].6":
-  version "4.3.6"
-  resolved "https://registry.yarnpkg.com/@icij/murmur-next/-/murmur-next-4.3.6.tgz#74d9f3eb26d1df7d02b1aa605fda3e2af5708f1a"
-  integrity sha512-kaeNnQqWlqVRe6sJY4XPNK5dB4iBZZehzS6SZaF/3GQxL6p8soEPsr4NjoErK69IYtpvnc2mD/GY8fUColSzZg==
+"@icij/[email protected].7":
+  version "4.3.7"
+  resolved "https://registry.yarnpkg.com/@icij/murmur-next/-/murmur-next-4.3.7.tgz#37428fdee7604b1b3206f9755e58d205d6188806"
+  integrity sha512-qTzemC7xfIfnmxUgX4meQtjAv62V5d/wrWW6TeSfQK436J76FEGWAfFCcQbo7TVszBpJIoGK+2GZJ21CteL3BQ==
   dependencies:
     "@phosphor-icons/vue" "^2.2.1"
     "@storybook/preset-scss" "^1.0.3"