Alfie Darko AlfieDarko
AlfieDarko
/ example.html
Created
July 27, 2020 20:26
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| /* Super simplified html form to illustrate BEM classname usage. */ | |
| <form class="checkout-form checkout-form--darkmode"> | |
| <p class="checkout-form__title"> | |
| Buy Bitcoins! | |
| </p> | |
| <input class="checkout-form__input checkout-form__input--big"/> | |
AlfieDarko
/ checkout-form.css
Last active
July 27, 2020 20:41
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| /* Block component */ | |
| .checkout-form { | |
| // .. | |
| } | |
| /* Element that depends upon the block */ | |
| .checkout-form__title { | |
| // .. | |
| } | |
| .checkout-form__input { | |
| // .. |
AlfieDarko
/ checkout-form.sass
Last active
July 27, 2020 20:42
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| /* Block component */ | |
| .checkout-form { | |
| /* Elements */ | |
| &__title { | |
| // ... | |
| } | |
| &__button { | |
| // ... | |
| } | |
| &__input { |
OlderNewer