Use jekyll for Kroxylicious website

[gracegrimwood]

Switches website to use Jekyll for static page generation. This change does not affect the docs at all, which are generated and deployed via the main Kroxylicious repository.

You can try out the site locally yourself by following the instructions in the README. You'll need to have Ruby 2.5.0+ installed, along with any other minimum requirements for running Jekyll in order to build and serve the site. Note that the new GitHub workflow takes care of all of this for you when deploying to the web, so these steps are only necessary for running locally.

Note that there is some missing content on some pages (i.e. the default Jekyll blog post and the "to do" placeholders on the quickstarts page), which will follow in seperate PRs once this is merged. I figured this was big enough on its own without adding that to the mix.

Feedback and suggestions are very much welcomed! 🤗

[gracegrimwood]

Fixes #6

[k-wall]

I don't find the navigation particularly intuitive. How did we decide what goes where?

My eye went straight the navigation in the middle of the page. I was confused as I knew there ought to be a blog option. It took me a while for my eye to clock the other navigation at the top. Maybe I'm just being special.

[gracegrimwood]

How did we decide what goes where?

I was trying to recreate the existing kroxylicious.io home page as best I could in Bootstrap, which is a completely different framework to the one currently used (Bulma). This meant some rearranging of the page:

1. The Kroxylicious vertical logo moved from the right side of the content to the left
2. The "Kroxylicious" header got removed as extraneous content because the word "Kroxylicious" is already in the logo
3. The tagline and link list moved under the logo as they looked out of place above the card in their new stylings
4. The card moved further up the screen as the content above it went elsewhere

Other minor changes:

• Background colour changed from #dce1de ($kroxy-light, a brand colour) to #ffffff (--bs-body-light, a default Bootstrap colour) to improve contrast and readability
• The word "Kroxylicious" at the start of the card content was italicised to add emphasis and make up for the removal of the title
• Extra spacing was added before the "Why?" header in the card content
• The slack invite link was removed because I couldn't figure out where to put it

Also, as a bit of an aside (which I probably should have put in the original PR comment): I went with Bootstrap 5 over Bulma because Bootstrap has a few more features which made styling the quickstart/blog pages and nav elements a little easier, has built in support for screen readers and other accessibility features, and its a bit more widely used than Bulma which makes finding resources and support a bit easier. There's a comparison of the two on the Bulma site here (it's worth noting to their point about Bulma having "No JavaScript" that the JS component of Bootstrap is completely optional, as is all the JQuery stuff - I have chosen to use it here anyway as I didn't need to write any JS code to get it working).

Hope that explains why it is the way that it is; it's the best I could come up with on my own 😉 . Happy to make changes if people have suggestions on what specifically should be changed (for example, I could perhaps try to make the navbar options more obvious by increasing text size or changing them to a higher contrast colour, if people think that would help).

[SamBarker]

My eye went straight the navigation in the middle of the page. I was confused as I knew there ought to be a blog option. It took me a while for my eye to clock the other navigation at the top. Maybe I'm just being special.

I did something similar so maybe we should include quickstartsand blog in the body nav links as well however I think the header links work for consistent navigation across the site (as in they appear on every page which is a fairly standard idiom on the web these days).

We really need to work on/have an elevator pitch for the project. As well as some other content for the home page, a single floating tile looks a bit odd to me.

[tombentley]

I also completely missed the blog and quickstart links. +1 to having a single navigation element. We could also highlight the one which corresponds to the current page, which would help.

Don't feel constrained to do something like what we have currently. For example, while the license is relevant it's probably more important for people to find the Quickstart and the Documentation. We could also group all the developer stuff under a single "Contribute" navigation heading, for example.

[gracegrimwood]

@k-wall @SamBarker @tombentley I've had a go at rearranging things in the nav so they're easier to find. Demo is here, please have a look and let me know what you think.

[gracegrimwood]

Merging this as-is, any further changes will be in seperate PRs.