code-corps / code-corps/code-corps-ember
Use BEM for Styles
- Langage dominant
- JavaScript
- Étoiles
- 120
- Forks
- 75
- Métriques de merge des PR
- Aucune PR mergée en 30 j
Description
# Problem
We want to standardize our stylesheets using [BEM](http://getbem.com/introduction/). This is a master issue to track all needed refactoring.
The lists below correspond to stylesheets. Each stylesheet (except those with `_` in front of the name) correspond to a `.hbs` template file. General styles will need to be renamed to fit the naming conventions, which then need to be changed everywhere they exist in templates. Take one `_name.scss` file at a time. Create a separate issue and reference this master issue. Take advantage of `git grep` to find all references to that style. If you are making changes to styles within components or templates, feel free to create a grouped issue and pull request (as in #673) Once each issue and it's related PR's are complete, check off the files refactored on this list. Make sure you make changes in both the `.scss` and `.hbs`!
# Files to Refactor
## General
- [x] _alerts.scss
- [x] _animations.scss
- [ ] _buttons.scss
- [x] _code.scss
- [x] _colors.scss
- [x] _fonts.scss
- [ ] _forms.scss
- [x] _header.scss
- [x] _icons.scss
- [ ] _images.scss
- [ ] _inputs.scss
- [x] _misc.scss
- [x] _pace.scss
- [x] _retina.scss
- [x] _settings.scss
## Templates
- [x] app.scss
- [x] dropdown-menu.scss
- [x] index.scss
- [x] main.scss
- [x] start.scss
- [x] task.scss
- [ ] task.scss
- [ ] task-new.scss
- [ ] templates/about.scss
- [ ] templates/team.scss
- [x] templates/project/index.scss
- [x] templates/project/settings/contributors.scss
- [x] templates/start/expertiese.scss
- [x] templates/start/hello.scss
- [x] templates/start/skills.scss
## Components
- [ ] donations/donation-progress.scss
- [ ] donations/donation-status.scss
- [x] categories-list.scss
- [x] category-item.scss
- [ ] code-theme-selector.scss
- [ ] create-comment-form.scss
- [ ] donation-goal-edit.scss
- [ ] donation-goal.scss
- [ ] donation-payment.scss
- [x] drag-zone.scss
- [ ] editor-with-preview.scss
- [ ] error-wrapper.scss
- [x] image-drop.scss
- [x] login-form.scss
- [x] member-list-item.scss
- [x] navigation-menu.scss
- [ ] organization-header.scss
- [ ] organization-members.scss
- [ ] pager-control.scss
- [x] progress-bar.scss
- [ ] project-card-members.scss
- [ ] project-card-skills.scss
- [ ] project-card.scss
- [x] project-details.scss
- [x] project-header.scss
- [ ] project-item.scss
- [x] project-list.scss
- [x] project-long-description.scss
- [x] project-menu.scss
- [ ] project-task-list.scss
- [ ] role-item.scss
- [x] settings-menu.scss
- [x] signup-form.scss
- [x] site-footer.scss
- [ ] stripe-connect-button.scss
- [x] task-comment-list.scss
- [ ] task-details.scss
- [ ] task-header.scss
- [ ] task-item.scss
- [ ] task-new-form.scss
- [ ] task-status-button.scss
- [ ] task-status.scss
- [ ] task-title.scss
- [x] user-details.scss
- [x] user-menu.scss
- [ ] user-organizations-list.scss
- [ ] user-sidebar.scss
- [ ] user-skills-input.scss
Guide de contribution
Ouvrir le guide de contribution
Piste de recherche
Commencez par une feuille de style non cochée de l’issue, comme _buttons.scss, _forms.scss ou une feuille de style de composant répertoriée, et utilisez git grep pour trouver ses références dans le modèle .hbs correspondant. Consultez les recommandations de nommage BEM liées dans l’issue, puis créez une issue distincte pour cette feuille de style. C’est terminé lorsque le SCSS et tous les modèles référencés utilisent les noms standardisés et que la checklist principale est mise à jour.
Rédigé par le modèle d'indexation à partir du texte de l'issue.
Évaluation
- Stack technique
- javascript
- Domaine
- frontend
- Type d'issue
- Refactorisation
- Difficulté
- 5/5
- Temps estimé
- Plus d'une semaine
- Activité
- À l'abandon
- Clarté
- Plutôt claire
- Accessibilité débutants
- 25/100