Mirrors/tabler
1
0
Fork 0
mirror of https://github.com/tabler/tabler.git synced 2025-12-21 17:34:25 +04:00
Code Issues Projects Releases Wiki Activity

fix: Fix .btn-icon size by aligning min-width calculation (#2530)

Browse Source
This commit is contained in:
Paweł Kuna
2025-11-15 13:15:12 +01:00
committed by GitHub
parent 8d8727f587
commit 5018aa9113
3 changed files with 9 additions and 5 deletions
Download Patch File Download Diff File Expand all files Collapse all files

5
.changeset/btn-icon-square.md Normal file
View File

@@ -0,0 +1,5 @@
---
"@tabler/core": patch
---
Fixed `.btn-icon` to be square by aligning `min-width` calculation with base `.btn` formula.

6
core/scss/_variables.scss
View File

@@ -601,7 +601,7 @@ $input-btn-focus-width: 0.25rem !default;
$input-btn-padding-y-sm: 0.3125rem !default; $input-btn-padding-y-sm: 0.3125rem !default;
$input-btn-padding-x-sm: 0.5rem !default; $input-btn-padding-x-sm: 0.5rem !default;
$input-btn-font-size-sm: $h5-font-size !default; $input-btn-font-size-sm: $h5-font-size !default;
$input-btn-line-height-sm: divide(1rem, $input-btn-font-size-sm) !default; $input-btn-line-height-sm: 1rem !default;
$input-btn-icon-size-sm: 1rem !default; $input-btn-icon-size-sm: 1rem !default;
$input-btn-padding-y: 0.5625rem !default; $input-btn-padding-y: 0.5625rem !default;
@@ -617,9 +617,9 @@ $input-btn-font-size-lg: $h3-font-size !default;
$input-btn-icon-size-lg: 1.5rem !default; $input-btn-icon-size-lg: 1.5rem !default;
$input-btn-padding-y-xl: 0.6875rem !default; $input-btn-padding-y-xl: 0.6875rem !default;
$input-btn-padding-x-xl: 2rem !default; $input-btn-padding-x-xl: 1.75rem !default;
$input-btn-font-size-xl: $h1-font-size !default; $input-btn-font-size-xl: $h1-font-size !default;
$input-btn-line-height-xl: divide(2rem, $input-btn-font-size-lg) !default; $input-btn-line-height-xl: 2rem !default;
$input-btn-icon-size-xl: 2rem !default; $input-btn-icon-size-xl: 2rem !default;

3
core/scss/ui/_buttons.scss
View File

@@ -197,8 +197,7 @@
} }
//[BUG] btn-sm and btn-xl with an icon looks broken //[BUG] btn-sm and btn-xl with an icon looks broken
//issue #2470 fixed //issue #2470 fixed
min-width: calc(var(--#{$prefix}btn-icon-size) + (var(--#{$prefix}btn-padding-x) * 2)); min-width: calc(var(--#{$prefix}btn-line-height) + (var(--#{$prefix}btn-padding-y) * 2) + (var(--#{$prefix}btn-border-width) * 2));
min-height: calc(var(--#{$prefix}btn-icon-size) + (var(--#{$prefix}btn-padding-y) * 2));
} }
// //