Convert all components under FormElements to styled-components
See original GitHub issueTask Description
Convert all components under FormElements
from scss
to styled-components
.
To Note
Styled-component migration guidelines:
- Styled-components should be a separate file called Styles.ts
- When importing styled-components to component file, should use `import * as S from ‘./Styles’.
- Use semantic naming for styled-components
- Try to maintain alphabetical order for css properties
- Avoid creating styled-components for HTML elements that do not require styling
- Can refer to
src/components/Avatar/Styles.ts
for examples - Please ensure that the existing UI is not affected, then only seek for reviews
Please only work on the issues that you are assigned to, PRs will be ignored if you are not assigned to the task. If the assigned issues have not been worked on for more than 3 days, we will remove the assignment.
Issue Analytics
- State:
- Created 2 years ago
- Comments:9 (2 by maintainers)
Top Results From Across the Web
Basics - styled-components
The styled method works perfectly on all of your own or any third-party component, as long as they attach the passed className prop...
Read more >Migrating to styled-components cheatsheet
And when you already have an existing code base you're considering to migrate, things get only trickier. Will you be able to convert...
Read more >How do I convert CSS to Styled-Components with input[type ...
I guess you can achieve that by: const Input = styled.input.attrs({ type: 'submit', value: 'Submit' })` background: #00aec9; color: #fff; ...
Read more >Advanced ways to write styled-components - Medium
Creating a component using styled-components is fascinating. ... You can change the component element at render time while preserving the styles ...
Read more >How To Use React Styled Components Efficiently - Copycat
Using styled-components makes it simple to use actual CSS to style components by writing JavaScript code. These components are known as “styled ...
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 FreeTop 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
Top GitHub Comments
On going issues, would love to try again in the future but this needs go on the back burner so it should be passed on. Thanks for the learning opportunity and will try again as soon as I can.
has this issue been worked on ?