Technical Documentation Page. Edit: need help with the Dropdown Menu

Hi everyone,
i’m looking for a general feedback about design of the page, how responsive it is and how i’ve used my resources… I hope it’s an issue the way i copied the texts, graphs and images, because the purpose of the page is educational.

So this “technical documentation page” is more of a page with information on this environmental issue. I’ve put the articles that’s been used as resources down at the bottom of the page, but the one from National Geographic (i’ve used authors text as an intro, Crisis Explained part) i’m a bit nervous about. It’s not really a free resource and not everyone would be even able to open that link (but i think you have 2 free articles per month though).
So for the future, if it’s a resource like this, should i be contacting them myself and getting an approval to use the text and information, or just putting them into my “references” section is enough ?

I like your page! :smiley:
The only thing i found a bit weird is that when you open the menu (in mobile view) you return to the top of the page each time.

About your content concerns i think it would be better to contact them. I do not think anyone would report you for that but, according to their terms of use (specifically the 7th section):

Except as provided in this Agreement or as explicitly allowed in the Additional Terms on the applicable Service, you may not copy, download, stream capture, reproduce, duplicate, archive, upload, modify, translate, publish, broadcast, transmit, retransmit, distribute, perform, display, sell, frame or deep-link, make available or otherwise use any Content contained in or through the Services.

If the content you published it is not free you should ask them the permission (just my opinion though, not a legal advice).

Keep up the good work! :+1:

1 Like

Good work @chopokaju!
I like the page. Only two suggestions for it:
hard: add to the css element html{ scroll-behavior: smooth} - this will create some smooth transitions when you navigate through the nav-bar options
soft: the color palette could use 1-2 extra colors, but I am not an expert designer and good job either way

1 Like

Oh, thanks for pointing out their terms of use - that’s pretty much makes it clear for me.
About the top button, it was an intention to make it “back to top”/home type of button. But that would be a much better use for it - a drop down menu, I’ll try to figure that out. Thanks!

1 Like

Yep, very true, could have used some more colors/textures. Too simplistic at this point.

scroll-behavior: smooth - That’s so cool, thanks a lot !

So, i was trying to implement this idea that with applied media query top button would become a dropdown menu by using only html/css. The problem now is that the menu doesn’t appear when hover over the top button if i’m anywhere but at the top of the page. Is it something to do with overflow or position properties of the dropdown-menu-content ?

Move position: fixed from .responsive-button to the .dropdown-menu header element so the menu is positioned relative to its container.

.dropdown-menu {
  position: fixed;
  width: 100%;
1 Like

Thank you, it worked