@anetaanette
A curious person with an electrical engineering background, striving to be a developer. Have experience working with Matlab and Python for scientific purposes and other funs. Now, willing to acquire front-end development skills. I do designs with Figma and In-vision. Cheers.
Latest solutions
Vanilla JS, CSS grids, Theme Switchers, calculator, class objects
#bem#semantic-ui#styled-components#vanilla-extractSubmitted about 3 years ago
Latest comments
- @Yakub-Egamnazarov
Hi, congrats. About your responsiveness issue: I think the problem occurs when you just used your media query, you just re-specified grid-template-columns, but didn't specify grid-template-areas for new width. I think, inside the same media query you should also specify grid-template-areas for mobile layout and add media query for each element inside the grid (cells) specifying grid-area. That would help. let me know if you succeed.
Marked as helpful - @Davetech101@Yakub-Egamnazarov
First of all: congrats, the layout works well in both device widths. However, in order to solve some accessibility issues, you could use <main> element instead of div, in your code it is <div> with "all-cards" class. You can follow the frontend validator to solve those issues. Secondly, in order to place all your grid in the middle, you could apply flexbox centration (e.g. align-items and justify-content) for the <div> element with "all-cards" class. The main container.
- @yousef-77@Yakub-Egamnazarov
It seems for the main container you could use flexbox centering, justify-content, and align-items to center. Other parts are solid. Congratulations.
- @menokemo@Yakub-Egamnazarov
Congrats
- @tomas938@Yakub-Egamnazarov
Hello Tomas, congratulations on completing the challenge. Regarding your solution I would like to point out the animated arrow, which is made very good and give good user experience. Overall your solution seem very good both in quality and responsiveness. Links are also dynamic. However, I would like suggest adding to your state changing elements, e.g. links, social network icons, some transition, so they would change their state smoothly. About mobile version, I really like how the menu popup comes from the right with animation and hamburger menu turns into X button. Very good. Overall solution is very good. Will see you next challenge. and happy coding.
- @Deadflight@Yakub-Egamnazarov
Hi Carlos, congrats on the completion of the project, and here is few comments from my side.
- on the learn more it is been used div element for the line, I think it is ok with that, but in my opinion, it would be better if you used ::before or ::after pseudo-element, and manipulate its opacity, rather than just scaling up the entire btn-div-wrapper, however, you can ignore that.
- in the graphic design section, the tex-block seems misaligned vertically, I think it is better to adjust by margin or padding.
Overall, it seems the solid solution. Good job, keep coding, cheers
Marked as helpful
