nodejs.org icon indicating copy to clipboard operation
nodejs.org copied to clipboard

Feature/UI small improvements

Open thomscoder opened this issue 3 years ago • 6 comments

On big screens there is a portion of the screen which is empty. The small UI improvement was to center the content on big monitors. (margin or paddings of the writings can be changed to better fit the space) Issue: Immagine 2021-11-11 173530 Link: nodejs.org/ UI change: Immagine 2021-11-11 174818

thomscoder avatar Nov 11 '21 16:11 thomscoder

@thomscoder

  • [x] Add a newline in layouts/css/layout/_main.scss on line 13

  • In layouts/css/page-modules/_home.scss

    • [x] on line 194 correct tab/spaces indentation issue
    • [x] on line 205, add a new line

Always run npm run test before committing so that tests may pass

thank you very much for your help. Fixing right away

thomscoder avatar Nov 11 '21 18:11 thomscoder

Hi @thomscoder can you explain how a max-width: 780px is affecting bigger screens?

jonymusky avatar Dec 08 '21 15:12 jonymusky

Hi @thomscoder can you explain how a max-width: 780px is affecting bigger screens?

that media query was for vertical displays iirc. it's max-width && min-height

thomscoder avatar Dec 28 '21 09:12 thomscoder

Thanks, I will resolve conflicts and update the pr

thomscoder avatar Sep 26 '22 07:09 thomscoder

Is it possible to have this CSS in one common place and be used in both areas?

should I unify the files?

thomscoder avatar Oct 07 '22 22:10 thomscoder

Is it possible to have this CSS in one common place and be used in both areas?

should I unify the files?

I think yes. So it stays consistent in both places.

WaleedAshraf avatar Oct 08 '22 08:10 WaleedAshraf

I'm closing this PR as the current layout will soon be abandoned. Thank you anyway for your contribution!

ovflowd avatar Feb 17 '23 18:02 ovflowd