question-mark
Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

Convert all components under FormElements to styled-components

See original GitHub issue

Task 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:closed
  • Created 2 years ago
  • Comments:9 (2 by maintainers)

github_iconTop GitHub Comments

1reaction
2ManyProjectscommented, Oct 21, 2021

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.

0reactions
mwelwankutacommented, Jan 7, 2022

has this issue been worked on ?

Read more comments on GitHub >

github_iconTop 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 >

github_iconTop Related Medium Post

No results found

github_iconTop Related StackOverflow Question

No results found

github_iconTroubleshoot Live Code

Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free

github_iconTop Related Reddit Thread

No results found

github_iconTop Related Hackernoon Post

No results found

github_iconTop Related Tweet

No results found

github_iconTop Related Dev.to Post

No results found

github_iconTop Related Hashnode Post

No results found