Mirrors/unleash.unleash
1
0
Fork 0
mirror of https://github.com/Unleash/unleash.git synced 2025-07-26 13:48:33 +02:00
Code Issues Projects Releases Wiki Activity

fix: appropriately size case icon for non-editing constraints (#9869)

Browse Source 
This fixes an issue where the "case sensitive" chip for existing
constraints was way too big. The underlying reason is that I switched
the icon for one with more padding to give it a consistent size with the
"not case sensitive" icon (PR:
https://github.com/Unleash/unleash/pull/9851).

The fix here is:
1. Add a viewBox to the SVG to let it scale properly.
2. Make the containing box stretch to fill the height of it's flex
container.
3. Use a size for height that doesn't grow too large.

Before:
<img width="137" alt="image"
src="https://github.com/user-attachments/assets/f23043f7-76a9-48c4-9f5c-c50371c24f72"
/>

After:
<img width="178" alt="image"
src="https://github.com/user-attachments/assets/cc2f8109-21ed-4070-b4bc-7c94be5b8e8d"
/>
This commit is contained in:
Thomas Heartman 2025-04-30 10:37:16 +02:00 committed by GitHub
parent 3ec1daad2b
commit 691a9e6e57
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
2 changed files with 10 additions and 2 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
frontend/src/assets/icons/case-sensitive.svg
View File

@ -1 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="none"><path fill="#6C65E5" d="m6.324 14.25-.739 1.971a.68.68 0 0 1-.28.378.816.816 0 0 1-.458.133.814.814 0 0 1-.688-.34.713.713 0 0 1-.102-.73l3.21-8.127a.89.89 0 0 1 .305-.389A.809.809 0 0 1 8.056 7h.662c.187 0 .348.049.484.146a.89.89 0 0 1 .305.39l3.21 8.15a.705.705 0 0 1-.09.718.79.79 0 0 1-.675.328.809.809 0 0 1-.484-.146.89.89 0 0 1-.305-.389l-.713-1.946H6.324Zm.535-1.41h3.056L8.438 8.8h-.102l-1.477 4.04ZM16.256 17c-.832 0-1.485-.207-1.96-.62-.476-.414-.714-.978-.714-1.691 0-.682.276-1.237.828-1.667.552-.43 1.26-.645 2.126-.645.39 0 .752.028 1.083.085.33.057.615.15.853.28v-.34c0-.438-.157-.787-.471-1.047-.314-.26-.743-.39-1.286-.39a2.377 2.377 0 0 0-1.35.415.981.981 0 0 1-.51.194.723.723 0 0 1-.509-.146.636.636 0 0 1-.267-.426.494.494 0 0 1 .165-.45 3.474 3.474 0 0 1 1.095-.632 4.141 4.141 0 0 1 1.401-.22c1.053 0 1.86.24 2.42.719.56.478.84 1.171.84 2.08v3.698c0 .195-.072.361-.216.499a.729.729 0 0 1-.523.207.75.75 0 0 1-.534-.22.686.686 0 0 1-.23-.51v-.22h-.076c-.22.325-.518.58-.891.767-.374.187-.798.28-1.274.28Zm.255-1.216c.543 0 1.006-.183 1.388-.548.382-.365.573-.807.573-1.326a2.985 2.985 0 0 0-.815-.292 4.071 4.071 0 0 0-.84-.097c-.544 0-.96.101-1.248.304-.289.203-.433.49-.433.864 0 .324.127.588.382.79.254.203.585.305.993.305Z"/></svg>
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none"><path fill="#6C65E5" d="m6.324 14.25-.739 1.971a.68.68 0 0 1-.28.378.816.816 0 0 1-.458.133.814.814 0 0 1-.688-.34.713.713 0 0 1-.102-.73l3.21-8.127a.89.89 0 0 1 .305-.389A.809.809 0 0 1 8.056 7h.662c.187 0 .348.049.484.146a.89.89 0 0 1 .305.39l3.21 8.15a.705.705 0 0 1-.09.718.79.79 0 0 1-.675.328.809.809 0 0 1-.484-.146.89.89 0 0 1-.305-.389l-.713-1.946H6.324Zm.535-1.41h3.056L8.438 8.8h-.102l-1.477 4.04ZM16.256 17c-.832 0-1.485-.207-1.96-.62-.476-.414-.714-.978-.714-1.691 0-.682.276-1.237.828-1.667.552-.43 1.26-.645 2.126-.645.39 0 .752.028 1.083.085.33.057.615.15.853.28v-.34c0-.438-.157-.787-.471-1.047-.314-.26-.743-.39-1.286-.39a2.377 2.377 0 0 0-1.35.415.981.981 0 0 1-.51.194.723.723 0 0 1-.509-.146.636.636 0 0 1-.267-.426.494.494 0 0 1 .165-.45 3.474 3.474 0 0 1 1.095-.632 4.141 4.141 0 0 1 1.401-.22c1.053 0 1.86.24 2.42.719.56.478.84 1.171.84 2.08v3.698c0 .195-.072.361-.216.499a.729.729 0 0 1-.523.207.75.75 0 0 1-.534-.22.686.686 0 0 1-.23-.51v-.22h-.076c-.22.325-.518.58-.891.767-.374.187-.798.28-1.274.28Zm.255-1.216c.543 0 1.006-.183 1.388-.548.382-.365.573-.807.573-1.326a2.985 2.985 0 0 0-.815-.292 4.071 4.071 0 0 0-.84-.097c-.544 0-.96.101-1.248.304-.289.203-.433.49-.433.864 0 .324.127.588.382.79.254.203.585.305.993.305Z"/></svg>

Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 1.3 KiB

After

Width:  |  Height:  |  Size: 1.3 KiB

10
frontend/src/component/common/ConstraintsList/ConstraintItemHeader/ConstraintItemHeader.tsx
View File

@ -26,8 +26,16 @@ const Operator: FC<{
const StrategyEvalChipLessInlinePadding = styled(StrategyEvaluationChip)(
({ theme }) => ({
alignSelf: 'stretch',
height: 'auto',
padding: 0,
'> span': {
paddingInline: theme.spacing(0.5),
paddingInline: theme.spacing(0),
},
svg: {
'--size': theme.spacing(2.5),
width: 'var(--size)',
height: 'var(--size)',
},
}),
);