Reservation page shortcuts

[Gunvor4]

Proposed changes

Added shortcut buttons to the reservations page, making it possible to jump directly to the chosen equipment type (suggested by Asta)

Checklist

(If any of the points are not relevant, mark them as checked, so that it's easy to see which points you've handled or not)

• I've run makemigrations, makemessages and compilemessages
• I've written tests that fail without these changes (if relevant/possible)
• I've manually tested the website UI with different device layouts
  • Most common is to test with typical screen sizes for mobile (320-425 px), tablet (768 px) and desktop (1024+ px), which can easily be done with your browser's dev tools
• I've manually tested with different users locally
  • This can be e.g. anonymous users (i.e. not being logged in), "normal" non-member users, members of different committees, and superusers
• I've made sure that my code conforms to the code style guides
  • It's not intended that you read through this whole document, but that you get yourself an overview over its contents, and that you use it as a reference guide / checklist while taking a second look at your code before opening a pull request
• I've attempted to minimize the number of common code smells
  • See the comment for the previous checkbox
• I've added documentation
  • E.g. comments, docstrings, or in the README
• I've added my changes to the "Unreleased" section of the changelog, together with a link to this PR
  • Mainly the changes that are of particular interest to users and/or developers, if any
• I've added a "Deployment notes" section above and labelled the PR with has-deployment-notes
  • ...if anything out of the ordinary should be done when deploying these changes to the server (e.g. adding/removing an environment variable, manually creating/changing some objects, running a management command, etc.)
• I've structured my commits reasonably
  • Some tips on this can be found in "Write Better Commits, Build Better Projects" and in the code style guides
  • Restructuring commits after they've already been committed, can be done using e.g. interactive rebase; see the Git docs on rewriting history

[codecov]

Codecov Report

✅ All modified and coverable lines are covered by tests.
✅ Project coverage is 88.01%. Comparing base (376e829) to head (31643e9).

Additional details and impacted files

@@           Coverage Diff           @@
##             main     #787   +/-   ##
=======================================
  Coverage   88.01%   88.01%           
=======================================
  Files         153      153           
  Lines        6224     6224           
=======================================
  Hits         5478     5478           
  Misses        746      746           

🚀 New features to boost your workflow:

• ❄️ Test Analytics: Detect flaky tests, report on failures, and find test suite problems.
• 📦 JS Bundle Analysis: Save yourself from yourself by tracking and limiting bundle sizes in JS merges.

[TheStrgamer]

Works when i run it on normal and mobile view, and couldn't find any bugs. LGTM

[ddabble]

Nice, code looks good overall 😊

[ddabble]

Should ideally stick to the pixel values used elsewhere on the website (e.g. these in style.css), for a consistent design :)

[ddabble]

An <h4> tag on its own can be jarring for people with screen readers when there is no <h3> (and <h2> and <h1>) tag that it's logically structured under.

So I think we should either update the other parts of the code to include those <h3>, <h2> and <h1> tags (instead the existing <div>s) - this is probably out of scope for this PR - or we should change this <h4> to a <div> with a class that's styled with a larger font size and top and bottom margins.

[ddabble]

Nice removing these 👍

[ddabble]

Good to avoid having these types of trailing punctuation as part of the translation message, as then the message can be reused elsewhere without that punctuation :)

Suggested change

	<h4>{% translate "Shortcuts:" %}</h4>
	<h4>{% translate "Shortcuts" %}:</h4>

[ddabble]

Should add a link to the PR, like the other entries below:

Suggested change

	- Added shortcuts to machine page, to help users navigate
	- Added shortcuts to machine page, to help users navigate (MAKENTNU/web#787)