Hi guys! This is my solution to the Bookmark landing page challenge. This time I tried another approach to make the styles of the page. Check it out if you can. Any feedback is welcome! 👍😁
Just a quick question: Is the JavaScript code readable enough? I tried to make it as simple as I could.
Não sei se tu é brasileiro hehe mas assim, eu achei bem limpo o código Javascript. Curti bastante. Esse uso das constantes usando $ é uma prática de Javascript? Ou é algo usado por algum framework?
\I wrote on portuguese before because I think that ou are from Brazil. If not, just ignore it. I liked your JS organization. Especially that const $ and $all. This is regular practice on JS or are you using some framework?
Hi! I have really good time doing this challenge, but i have a problem. When i open the page, in this case, a Samsung S8+, the superior part of the screen goes up. I cant set any margin-top or padding in the body beacause when i open the page on an Iphone 13, there is a big empty space. What should i do? Thanks!
I SOLVED IT!
Hi there! hmmm maybe try to change the units of width and height of the body. The units vh/vw are relative to the height and width of the viewport, so when you open the page on Samsung S8+ and iphone13 the layout its different because we are dealing with different lenghts in width and height of them.
I had some problems with the grid layout, it's my main question here....
1.The grid area size does not fit the inside content, it just keep a static size based on the parent size, and it annoyed me during the coding. When I tried to do a handsome thing in each "other-news" sections using CSS grid, their just got enormous spaces and broken sizes, beacuse the "section#other-news" grid did not fit the content, so the content managed to fit the parent. It's a normal thing or there is a way to control the grid area size?
2.I tried to change the grid layout via js (for example, assign a "element.style.gridTemplateArea") but it did not work. There is a way for it?
3.Sorry about the crazy scripts I writed to make the page responsive, I appreciate the feedback about it.
Hi there! Nice layout :) Maybe one thing that could help us to understand whats going on in your first question is the quantity of styles files. I like the organization (one style sheet for each part of the project), but with a smaller project put everything on one file could the reading of the code. I dont know if, for example, this problem is due to inhertiance and levels of specificty of the style rules (see this spec: https://www.w3.org/TR/selectors/#specificity number 17).
Maybe try: "element.style.gridTemplateArea = 'value'". Or check if 'gridTemplateArea' is the right way to write it. I guess that is, but I'm not sure.
Check the Media Queries in CSS. Here (https://css-tricks.com/snippets/css/media-queries-for-standard-devices/) and the specifications on W3c as well.
