search

ppoffice / hexo-theme-icarus

A simple, delicate, and modern theme for the static site generator Hexo.
https://ppoffice.github.io/hexo-theme-icarus/
MIT License
6.28k stars 1.54k forks source link

make container-inner-max-width configurable #1254

Open noraj opened 6 months ago

noraj commented 6 months ago

Is your feature request related to a problem? Please describe.

Why? On large screen (eg Full HD, 4k) or with large ratio (18:9, 21:9) etc. the container feels very tiny and there is too much space on the borders. Especially on pages where you disabled widgets and have only one column. So making the max width configurable allows the site to behave better on large screens.

Describe the solution you'd like

Allow max_width to be configurable.

container:
    max_width: 1500px

cf. a PR for another theme https://github.com/ppoffice/hexo-theme-hueman/pull/280/files

as is applies not only to the content container but also to the navbar, it would probably require to have a max_width option for the navbar too.

Describe alternatives you've considered

None.

Additional context

Default fixed max-width (960px):

image

max-width of 1500px:

image

max-width: 100%

image

Instead of applying max-width and width values to .container, apply a size of 960px to .navbar-container and 1500px on a newly created class .content-container.

image

ppoffice commented 6 months ago

It is configurable via the styles file: https://github.com/ppoffice/hexo-theme-icarus/blob/master/include/style/base.styl#L26-L30

noraj commented 6 months ago

One can always write some custom modification but then you have to locally insclude the theme in your repository or maintain a custom fork. That's the whole point of having a config option so I can just keep the npm package and a config file.