Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Field.PostalCodeAndCity in a Card gets a black border #2893

Closed
langz opened this issue Nov 13, 2023 · 2 comments · Fixed by #2902
Closed

Field.PostalCodeAndCity in a Card gets a black border #2893

langz opened this issue Nov 13, 2023 · 2 comments · Fixed by #2902
Labels

Comments

@langz
Copy link
Contributor

langz commented Nov 13, 2023

🐛 Bug Report

Field.PostalCodeAndCity while in a Card gets a black border:
image

To Reproduce

https://codesandbox.io/s/funny-wilbur-p6zq8q?file=/src/App.tsx

https://codesandbox.io/s/jolly-blackburn-32p58l?file=/src/App.tsx

Expected behavior

I expect the Field.PostalCodeAndCity to behave/look as much as the other Field components, which does not have black borders.

Eufemia Version

10.13.0

@tujoworker
Copy link
Member

As of now, the forms styles need to be included in your CodeSandbox.

Reason: In this case, its the internally used FieldBlock that uses a fieldset element, which creates this border (added by browsers). But the FieldBlock styles needs to be imported in order to "remove" the fieldset border.

import '@dnb/eufemia/style'
import '@dnb/eufemia/extensions/forms/style'

tujoworker pushed a commit that referenced this issue Nov 16, 2023
## [10.14.0](v10.13.0...v10.14.0) (2023-11-16)

### 📝 Documentation

* **Forms:** lists component specific props 1st ([#2892](#2892)) ([c05740c](c05740c))
* **PhoneNumber:** remove unsupported props ([#2894](#2894)) ([4800a8e](4800a8e))
* **PostalCodeAndCity:** remove unsupported props ([#2890](#2890)) ([fe1ee9e](fe1ee9e))

### ✨ Features

* **Forms:** expiry field ([#2660](#2660)) ([af5aa61](af5aa61))
* **forms:** improved state management and reacting to more changed props ([#2882](#2882)) ([0ca9533](0ca9533))
* **Input:** add clear button event "on_clear" ([#2898](#2898)) ([eb6b722](eb6b722))
* **Radio:** Sbanken styling ([#2888](#2888)) ([d7ffcf8](d7ffcf8))

### 🐛 Bug Fixes

* add "use client" to non hook components like the Button ([#2895](#2895)) ([2d54a13](2d54a13))
* **Autocomplete:** enhance logic for when to blur ([#2886](#2886)) ([ce5c3fa](ce5c3fa))
* **Autocomplete:** make clear button work with enter key ([#2901](#2901)) ([30007c4](30007c4)), closes [#2185](#2185)
* **FieldBlock:** enhance fieldset/legend detection ([#2902](#2902)) ([4c62052](4c62052)), closes [#2893](#2893)
* fix Flex and Grid export to work with Vite.js ([#2905](#2905)) ([ef83713](ef83713))
* fix vertical label_direction support for Radio group and ToggleButton group ([#2899](#2899)) ([d650c66](d650c66))
* **forms:** Field block error handling ([#2900](#2900)) ([9582c64](9582c64))
* **forms:** Improved message value replacements ([#2903](#2903)) ([a61140b](a61140b))
* **PhoneNumber:** keep selected countryCode value on blur ([#2869](#2869)) ([7e0f9c5](7e0f9c5))
@tujoworker
Copy link
Member

🎉 This issue has been resolved in version 10.14.0 🎉

The release is available on:

Your semantic-release bot 📦🚀

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
Development

Successfully merging a pull request may close this issue.

2 participants