Checkbox shows black tick when not selected
See original GitHub issueI have gone through these following points
- [] Check latest documentation: https://docs.nativebase.io/
- [] Check for existing open/closed issues for a possible duplicate before creating a new issue: https://github.com/GeekyAnts/NativeBase/issues
- [] Use the latest NativeBase release: https://github.com/GeekyAnts/NativeBase/releases
- [] Check examples from NativeBase KitchenSink https://github.com/GeekyAnts/NativeBase-KitchenSink
- [] For discussion purpose make use of NativeBase Slack: http://slack.nativebase.io/
- [] For queries related to theme, check Theme Variables from Docs and live NativeBase Theme Editor http://nativebase.io/customizer/
Issue Description
node, npm, react-native, react and native-base version, expo version if used, xcode version
react-native - v0.60.5 native-base - v2.13.5
Expected behaviour
It should show blank no tick box
Actual behaviour
It shows black tick
Steps to reproduce
<CheckBox
style={{ borderColor: type.checked ? 'blue' : 'black' }}
checked={false}
color={'blue'}
onPress={() => true}
/>
Is the bug present in both iOS and Android or in any one of them?
Yes
Any other additional info which would help us debug the issue quicker.
Issue Analytics
- State:
- Created 4 years ago
- Reactions:18
- Comments:16
Top Results From Across the Web
Disabled Checkboxes now showing black tick - Telerik
Hi, On formviews and grids within my site the checkboxes now show a black tick in them. Theme/Skin is Black.
Read more >Change checked boxes from an X to a checkmark
Select the symbol you want, and select OK. Repeat the same steps for each check box.
Read more >HTML checkbox without label tick not displaying
Try this code, with html entity for a tick symbol input[type='checkbox']:checked:after { width: 15px; height: 15px; border: 2px solid black; ...
Read more >How To Select The Check Box In Selenium With Examples
#1) Checked: State in which the Checkbox is selected is the checked state. Here, we can see the box as tick marked. #2)...
Read more >checked - CSS: Cascading Style Sheets - MDN Web Docs
The :checked CSS pseudo-class selector represents any radio ( ), checkbox ... Hide the toggle checkbox */ #expand-toggle { display: none; } ...
Read more >
Top Related Medium Post
No results found
Top Related StackOverflow Question
No results found
Troubleshoot Live Code
Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free
Top Related Reddit Thread
No results found
Top Related Hackernoon Post
No results found
Top Related Tweet
No results found
Top Related Dev.to Post
No results found
Top Related Hashnode Post
No results found
FYI: The issue seems to have been introduced in “CheckBox Cleanup (#2777)” It used to default the checkBoxBgColor to “transparent” but now sets it to “checkboxDefaultColor” which from what I can tell doesn’t exists in the theme variables. Workaround is to add this to your “variable.js” file:
"checkboxDefaultColor": "transparent"
I also experience the same problem