@elizabethrsotomayor
Latest solutions
Latest comments
- @festsnusa
Hi there! Congratulations for completing this challenge.
Here's my feedback:
- to center your divider, you can use "left: 50%" and "transform: translateX(-50%)";
- when clicking more than once within 2 seconds, the second click is ignored. you can set timeOut with 2 seconds;
- importing google fonts instead of downloading fonts is not a good practice, because anything could happen — fail to connect to link or the actual link may become unavailable. to download fonts, you can use "google-webfonts-helper";
- i think wrapping "main — wrapper — card" looks kinda complex. you can simplify it to "main class='card'";
- i don't think putting 2 images inside .dividers is a good idea. you can change the image via media query;
- putting div inside a is not a good idea. only "inline-block" elements are recommended. plus, your whole div section will act as a link;
- alts are empty;
- in CSS, h1 declared twice;
- for media queries, you can only set for desktop resolution;
- your box-shadow looks okay;
Hope you're gonna find my feedback useful. Happy coding.
Marked as helpful - @lndbgaa@festsnusa
Hi there! Congratulations for completing this challenge.
Here's my feedback:
- your page is not responsive/adaptive. when i resized my page to mobile resolution, everything looks messy. though you have a media query. you can add "width: 100%" to your component;
- .DS_Store - i think this file is unnecessary;
- to make your html code look more concise, you can try to use Pug and add mixin. Also, instead of pure CSS, you can try SCSS.
Hope you found my feedback useful. Happy coding.
Marked as helpful - @darlanbbs@festsnusa
Hi there! Congratulations for completing this challenge.
Here's my feedback:
- to place your main component in the center, you can use grid: display: grid; min-height: 100vh; place-content: center;
- try to place your styling into the CSS/SCSS file, not inside HTML file;
- importing google fonts is not a good practice. to download fonts to your hub, you can use "google-webfonts-helper";
- you can try to use SCSS instead of pure CSS, because you'll be able to use mixins and include nestings;
- i guess, "Learn More" should have "cursor: pointer";
- in your JS file, instead of adding styles, you can toggle classes. and instead of using "else", you can use "return".
Hope you found my feedback useful. Happy coding.
Marked as helpful - @nfluka@festsnusa
Hi there! Congratulations for completing this challenge.
Here's my feedback:
- there's an empty div in your html file;
- importing fonts instead of downloading them is not a good practice, because google fonts link may not be available;
- in SCSS, putting "&" inside selector like this "& a.overlay" is not necessary;
- to make your SCSS code look more concise, you can try mixins.
Hope you found my feedback useful. Happy coding.
Marked as helpful - @coderwww@festsnusa
Hi there! Congratulations for completing this challenge.
I'm quite impressed by your page's design with transitions and animations. So, I'm gonna skip to advices to how to make your code look more concise:
- importing fonts from Google Fonts are not recommended, because link may change or may become unavailable. So, instead of importing, I recommend you to download it. you can use "google-webfonts-helper";
- instead of px, you should use rem;
- in your scss code, i've noticed that you constantly put the whole selectors inside selector. perhaps, you should use BEM;
- you can switch to Pug, include mixins and separate your page into components.
P.S.: I've noticed a bug:
- when u open nav menu and switch to desktop resolution, your ul will look kinda messy.
Hope you find my feedback useful. Happy coding!
Marked as helpful - @Barissev@festsnusa
Hi there! Congratulations for completing this challenge.
Just a few bugs I've noticed while testing your page:
- your paragraph's font in .topcontainer is different. perhaps, you should apply font-family to your body;
- i've tested mobile screen on Chrome and everything looks okay. but when i switched to Opera, elements in .title collide w/each other;
- instead of px you should use rem.
To make your code look more concise, I recommend you to use Pug & SCSS. So, it's possible to minimize your code using mixins and loops: https://pugjs.org/language/mixins.html
Hope you find my feedback useful. Happy coding!
