Hot answers tagged

5 votes

Tooltip-overlay following the mouse pointer

I found this post and took your code and made some changes. I wanted to have a very small piece of javascript code that supported style-able tooltips. First, the way you were editing the CSS was to ...
  • 51
5 votes

Checking screen sizes for responsive site

Personally, I think it's better to make the breaks according to the content of the site, rather than to a fixed size. This is even more true nowadays with docens of different screen sizes for each ...
  • 51
4 votes
Accepted

First website written with SASS/SCSS

For me, a lot of this looks like you're trying to... Sassify it too much. Let's start by looking at your padding mixin: ...
  • 3,624
4 votes
Accepted

Simple recipes web app with Redux

I see some Redux conventions misconceptions: The reducer purpose is to change the state, I see that you also copy state to localStorage. You should use ...
4 votes
Accepted

Tooltip-overlay following the mouse pointer

Should I try to concentrate more on JavaScript only? I mean: Should I try to reduce the mandatory HTML-, CSS-code to a minimun? I think, the code i.e. HTML and CSS are minimal. Storing the tooltip on ...
  • 2,956
4 votes
Accepted

Small Bayes Calculator to learn Javascript

UX Overall, fine. Good use of labels. Getting an invalid input error off the bat is a bit jarring. Consider formatting the result to a readable number of decimal places (say, 2) unless you have good ...
  • 2,983
3 votes

Toggle menu under specified screen width

Feedback The code looks pretty good. The Javascript code waits until the DOM is ready, then caches references to DOM elements in variables before using those variables in the functions later on. I ...
3 votes
Accepted

Simple modals in vanilla JS

import HelpMe from '../helpers/helpers'; const __ = new HelpMe(); This doesn't tell me what HelpMe is unless I look for it. ...
  • 24.8k
3 votes

Google material ripple button effect

Some things that I would do differently in this for loop ...
  • 28.5k
3 votes

Toggle menu under specified screen width

There is no real reason to use JavaScript here. Using a CSS media query you can do this in a few lines: ...
  • 10.4k
3 votes

Lightweight Angular tooltip component

It just looks really good. I think it stayed this long unanswered because there's not much feedback to give. I reviewed and liked The commenting The naming The sizes of your functions Reading flow ...
  • 32.8k
3 votes
Accepted

Different color classes that control the same stuff

Move all your duplicate code into a class, say gradient. Pick better names. A class name like light-green can mean anything, can ...
  • 41.7k
3 votes

Resizable split DIVs Vue.js

Manipulating DOM with VueJS The biggest comment I have about this code is that it modifies DOM elements using vanillaJS techniques. With VueJS, there are ways of achieving this without needing to ...
2 votes

Quickly fixing unmaintainable SCSS code in Rails

You can DRY your use of @font-face using this mixin see on codepen but you'll get better results using compassor bourbon, etc... ...
2 votes

Sass code for displaying two simple search forms

Sass If this is meant to be a reusable Sass library, you'll want to make use of default variables so that they're easier to override: ...
  • 3,624
2 votes

Animated SVG pie chart with custom properties

Why are you doing this in easeOutCubic? return c * ((t = t / d - 1) * t * t + 1) + b; that's way harder to read than ...
  • 7,673
2 votes
Accepted

Pattern that adds a different value to the same attribute for many classes

You can minimize your SASS code using @each and nesting for :hover ...
  • 183
2 votes

Start of a responsive website for a legal firm

Whitespace in expressions There is a distinct lack of whitespace in all of your expressions in Sass (eg. $colwidth: $i/12*$totwidth). This has been known to cause ...
  • 3,624
2 votes

Animated SVG pie chart with custom properties

Surely $(elem).width() / 4 is already defined as a <circle> attribute so why not read it from the DOM in the same way as <...
  • 1,289
2 votes
Accepted

Styling the font size in a nav bar

You could remove all the duplicate lines in the @media queries and provide only the changes in these tags. This is beacause in CSS, the CSS classes that are ...
  • 146
2 votes

Flexbox & BEM 'table'

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. ...
  • 24.8k
2 votes
Accepted

SASS + Compass - File Structure and @Import order

Your way works, but it is not very scalable, since you have to compile all the sass files every time you make a change, this is time consuming when the project gets bigger. here you watch all the ...
  • 136
2 votes
Accepted

Showing the current view-position within the web page

Here are some improvements: Use IIFE. This will make the variables defined inside it private thus avoid cluttering globals Passing window and ...
  • 2,956
2 votes

Excerpt from a grocery shopping site using SASS

Just few things to highlight here Misusing Twitter bootstrap: The grid structure in bootstrap allows up to 12 columns across the page. ...
  • 2,440
2 votes
Accepted

"Spinning wheels" - Animated spinner with SVG and Sass-CSS

I totaly refactored your code (CSS and HTML). I wont address all the modifications and focus on the main ones : Browser support The is an issue in firefox when a percentage ...
  • 884
2 votes

Simple SASS & BEM module for social feed widgets

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 ...
2 votes
Accepted

Rendering three vertical dots using SCSS

What you're looking for is just &: ...
2 votes

React board game app

Overall, it looks pretty good to me, pretty much all my comments are opinionated to a lesser or (often) greater extent. I'd summarize my main feedback as "YAGNI" and "think readability, not ...
  • 426

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