feat(about): add about-ghaf application

[mbssrc]

Description of Changes

Add a local "Getting Started" application to the laptop. It is a local website that entails information about the laptop and its features. Useful for users to understand what they are looking at.

Type of Change

• New Feature
• Bug Fix
• Improvement / Refactor

Related Issues / Tickets

Checklist

• Clear summary in PR description
• Detailed and meaningful commit message(s)
• Commits are logically organized and squashed if appropriate
• Contribution guidelines followed
• Ghaf documentation updated with the commit - https://tiiuae.github.io/ghaf/
• Author has run make-checks and it passes
• All automatic GitHub Action checks pass - see actions
• Author has added reviewers and removed PR draft status

Testing Instructions

Applicable Targets

• Orin AGX aarch64
• Orin NX aarch64
• Lenovo X1 x86_64
• Dell Latitude x86_64
• System 76 x86_64

Installation Method

• Requires full re-installation
• Can be updated with nixos-rebuild ... switch
• Other:

Test Steps To Verify:

Please proof-read and verify the tutorials.

[kajusnau]

Nice, but should we consider having the source for the page itself in ghafpkgs or at least in one of the existing packages namespaces? Feels a bit odd to have it as part of services.

[mbssrc]

Nice, but should we consider having the source for the page itself in ghafpkgs or at least in one of the existing packages namespaces? Feels a bit odd to have it as part of services.

Yes we could. My thinking was that this writeup applies specifically to our reference laptop implementation, hence the location. Can move the package itself somewhere else though

[mbssrc]

moved website to packages

[milva-unikie]

Tested on Darter Pro

• Skimmed through the Getting Started guide. Looks good!
• Darter Pro and Orin tests have passed in the pre-merge pipeline so I would say this PR is good to go in. Lenovo X1 and Dell 7330 tests are still running, but there should be no issues with them.

[mbssrc]

update: brighter font and start maximized

[kajusnau]

Really nice looking page! Easy to navigate, clear wording, good tutorials.

Some objective, some subjective notes in my review comments, as well as some general thoughts here:

• I think the use of colors is a bit excessive in general. In some cases it makes some text more difficult to read (light text against a light-colored background), in other cases it clashes with pre-existing color definitions, as I mention in the comments.
• Depending on the target audience, it could be argued that the language should be more formal:

  can’t -> cannot
  won’t -> will not
  don’t -> do not
  doesn’t -> does not
  didn’t -> did not
  isn’t -> is not
  etc
  

Late edit:
I tested 7db1c4a, so maybe not everything applies.

[kajusnau]

For this section I have a couple notes:

• Using (arbitrary?) colors here IMO doesn't add anything to the overall presentation, and can even clash with some of our existing color schemes. e.g. The Green used for "layer 1" is almost identical to the business VM green, red in "Result" is almost the same as chrome VM red
• If these are actual layers would it help to represent them as such? As a sort of stack
• The result is not a layer, so it would help if it was a visually distinct element

[kajusnau]

As mentioned before, this section again contains some of the same colors used elsewhere.
Do we need the colors here? Maybe icons, as used in the killswitch app itself, would be more beneficial? Not sure if that complicates things too much for this pure html.

[kajusnau]

Would the design be more uniform here if the style of this box was the same as that of "The Security Challenge" and "Emergency Privacy Mode"?

[kajusnau]

Again a similar situation as before with the use of colors.
E.g. now audio VM is using the same (or similar) color as business VM did before

[kajusnau]

Approving so as not to block the PR in case we need to move forward quickly.

[rodrigopinotii]

In the section "What this means for you" --> "Colored Borders"
indication for
green --> trusted
red --> untrusted

for the VPN part
ipv 6 not supported should be mentioned and listenport needs to be entered manually after import is completed.

Section Testing Kill switch
i would suggest to remove the link for camera tickbox, the content of the link not clear anf there is no camera check