Reworked installation page and added buttons in css

[Mazurel]

I have reworked the Installation page so that it is easier to use by non-technical people (related to #5), as I saw that my family and friends had some trouble with downloading xournalpp (especially when redirected to Github releases page). I have added simple buttons that can be used in some scenarios that are consistent with the theme. I have used them as download buttons and added them to front page as quick navigation buttons.

Also I wasn't sure what is the installation process for MacOS so if anyone could help me out with that one it would be nice as currently I have assumed that it uses some kind of native installer.

[rolandlo]

Thanks for simplifying the installation guide. It looks much better to me with your changes. Please take into account the changes suggested/requested.

[rolandlo]

Also I wasn't sure what is the installation process for MacOS so if anyone could help me out with that one it would be nice as currently I have assumed that it uses some kind of native installer.

About the MacOS installation process I don't know.

[Technius]

Thanks for the PR, this is great. Some general comments:

• The naming and capitalization needs to be consistent. Prefer Xournal++ over Xournalpp when referring to the application in general. When referring to the actual binary, use xournalpp with the inline code ticks.
• The button boxes should be changed from div to ul, which is semantically more correct.
• The buttons on the Linux installation page should indicate whether the builds are stable or nightly. Many users opt for the nightly version, despite the instability, because it typically includes features that they absolutely need.
• .xournalppButton should be renamed to .download-button, which is more indicative of its purpose.
• The button text is not vertically centered, which looks weird to me.
• I think the download buttons need icon where appropriate. The buttons that are direct download should have an icon, while the buttons that are are just links should not.

[Mazurel]

I have tried to apply all suggested changes, but there are still some things that need to be fixed/added:

• Naming of the .xournalppButton.
• Download buttons for Debian and Ubuntu in Linux installation.
• Maybe better download icon as I have made one myself and I am not great at making svgs.

[rolandlo]

The links are wrong.

[Technius]

Sorry for the delay, I've been busy. The buttons look much better now. I would just change the color of the icon to be white, since they're a little hard to see.

Some other feedback below.

[rolandlo]

LGTM. Buttons are nice now.

[rolandlo]

@Technius I will merge this PR within 24h if there are no objections.

[rolandlo]

Thank you @Mazurel , this will help lots of users find the right version for installation.

[rolandlo]

Hmm, somehow the website shows the buttons in a downloadContainer atop of each other. If I clone the same source and build it locally the buttons are horizontally next to each other, or aligned in a grid (when there are too many buttons). @Mazurel Does this happen to you as well?
This looks like a dependency issue.

[Technius]

Looks like the .md-typeset ul rule from mkdocs-material is overriding our button styles. Need to change display: grid in .downloadsContainer to display: grid !important.

[Technius]

We should also pin the mkdocs-material version in requirements.txt to prevent issues like this from occurring in the future.

[rolandlo]

Aha, I had mkdocs-material 6.2.3 installed. After upgrading to the latest version 7.0.4 I see the same behavior like on the website.
@Technius Which version of mkdocs-material would you pin, 7.0.4?

[rolandlo]

See #32 for the suggested fix (which seems to work fine).