Hot answers tagged

6

You could improve your BEM structure by not being so strict. A class name like email_template__foot__content__links__item is a pain to read and, in my opinion, makes BEM redundant. You don't have to go too deep. Just three levels deep should be fine, but deeper than that is too hard to read. I suggest organising your BEM like the following: <div class="...


6

Something minor that irritates me and may or may not irritate others, is your lack of newlines inside your p tags. Within these tags you can multi line and it won't be translated to your browser output. <p> Lorem ipsum dolor sit amet, consectetur adipisicing elit. Laboriosam, sunt hic perspiciatis consectetur assumenda provident ...


3

Because of the way that if-else statements work, you can eliminate redundancies. Here's the code cut up some to focus on just the if-else statements: if ((year == 2015 && month < 10) || (year == 2015 && month == 10 && day < 23) || (year == 2015 && month == 10 && day == 23 && hours < 01)) { // do ...


2

You may use loops to avoid duplication, like: document.getElementById("day-one").className = "bem-sale-week--item-expired"; document.getElementById("day-two").className = "bem-sale-week--item-expired"; document.getElementById("day-three").className = "bem-sale-week--item-expired"; document.getElementById("day-four").className ...


2

I've reviewed your code and I can make the following remarks: While I like the BEM methodology, its not a panacea especially following it to the letter. You must seek simplicity to your code even if that means not following some rules but compiling an pragmatic view of your problem. In that case you should not add classes if you do not have use cases or ...


2

I can't say much for flexbox, I haven't played with it. The React part is to sparse as well. However, general CSS I can do. .c-marketview { display: flex; flex-flow: column nowrap; max-width: 1300px; min-width: 850px; margin: auto; * { box-sizing: border-box; } } I suggest avoiding * and apply only to the elements you ...


2

What happens if one of your slides is itself a block that contains an image, such as an article. Consider this markup: <ul class='slide-show'> <li class='slide'> <img class='image' /> </li> </ul> <article class='article'> <p class='text'></p> <img class='image' /> </article> They seem ...


2

Use UTC Time to avoid timezone issues People in different timezones will see different values for the current date and hour in JavaScript even when viewing the web page simultaneously. This is determined by the user's current timezone as specified on their system. Generally, when counting down to a specific date, you want the countdown to be the same for ...


2

Well, if you are using Bootstrap, you should not alter the classes that Framework is using, like navabar for example. The basic with BEM is that you should chain classes in a way to create a meaningful hierarchy, like in a component, where you have an object that contains everything else. Like that you leverage SASS nesting to create a component-like ...


1

Congratulations on getting a react app to work. That is no small feat. Also nice use of static state and using a function to change state. I recommend you read thinking in react. Controls are the basic building blocks of a react application. I recommend creating many small controls and composing them into a larger control. You have one monolithic ...


1

Thinking in re-usable modules you would like to keep things simple and as general as possible with naming. IMO your version of BEM is to specific. I'll try my best to get my point across and guide you. If we take a look at BEM and what it stands for, Blocks, Elements and Modifiers and here is a pretty good summary from Harry Roberts in this blogpost ...


1

First things First I cloned it and run it as you wrote in README.md file, As a frontend project it'll be better if you used something like npm to run your project. things you can do better: When to use map over forEach? If you want to return a new array instead of change the current, you can use map function. in this example you don't have to create a ...


1

One of the most fundamentally useful things about BEM is the flattening of modules to make them independent of structure. It's always a problem in css to make the selectors follow the HTML structure, which is why flattening down the selectors from a css perspective is a good thing. It makes it easier to re-use on other HTML and easier to change the HTML ...


Only top voted, non community-wiki answers of a minimum length are eligible