website CSS improvements

[psychon]

I came across https://www.reddit.com/r/awesomewm/comments/mljthp/website_css_improvements/ and wanted to leave a link here.

Feel free to just close this issue.

[actionless]

h1::before {;
  content: "$❭ ";
}

meh

[actionless]

i'm closing this since we just merged the new design update (#175 )

the only thing i liked in this design prototype is menu/header style (but NOT the white text on light-gray background particularly):

mb @raven2cz would like to do smth similar too in the next iteration?

[raven2cz]

i'm closing this since we just merged the new design update (#175 )

the only thing i liked in this design prototype is menu/header style (but NOT the white text on light-gray background particularly):

mb @raven2cz would like to do smth similar too in the next iteration?

It has to be tested in demo first. I see three concept problems

• The top and bottom "banded" borders have to cover whole page from left to right side. But the text page is mainly in the center and uses just 60-70% of the page. For HiDPI resolutions, it will be very strange, the top page tries to cover whole page, but the content not. If this can be use, the menu has to be first and sticks with top edge of the screen. The logo has to be under it and menu can be still visible (optional).
• Second problem is small mobile screens. In actual implementation, more rows are used for menu. If the screen is smaller. In this case, more rows cannot be used, because banded borders. There has to be used similar technique like in Bootstrap - if small width, switch menu to just one menu button which shows drop-down or left-side hidden menu.
• "Banded" borders are old approach. These days, just clean transitions with simple color changes are used.

The Inspiration

• https://99designs.com/blog/trends/web-design-trends/
• https://www.psd2html.com/blog/modern-web-navigation-trends-best-practices.html

[actionless]

https://99designs.com/blog/trends/web-design-trends/

if you going to use those as references for the future design that would be nice 👍

[raven2cz]

https://99designs.com/blog/trends/web-design-trends/

if you going to use those as references for the future design that would be nice +1

Yes, it was the first aim. But we are bound with ikiwiki and minimal usage of js scripts and no frameworks. Ikiwiki is strong requirement which doesn't allowed almost nothing because markdown translation. Divs doesn't work correctly, it means no classes for content etc. It was pain to find some compromise. But modifications of main template is partial solution only.

(JFI: we have to create new issue for content first. AwesomeWM renaming and maybe some next points.)

[actionless]

headerbar is not generated by it, so at least there you can use full potential of browser tech 😺👍