Skip to content

Instantly share code, notes, and snippets.

@caminashell
Last active January 28, 2024 02:39
Show Gist options
  • Save caminashell/4bc08a05d793bcfa4ed89a141b2abadf to your computer and use it in GitHub Desktop.
Save caminashell/4bc08a05d793bcfa4ed89a141b2abadf to your computer and use it in GitHub Desktop.
draft-README.md

Mission Control

A user-defined stylesheet for pfSense GUI theming.

sample20240128

INTRODUCTION

A stylesheet I crafted for myself and decided to share with others, since I have an affinity for all things NASA, Martian, and other Science Fiction.

It was templated from another theme that I used to use called, "Gotham" designed by Konstantin Vanyushov. You can find it here: https://github.com/itworks99/pfsense-theme-gotham

There is no accessible theme management within pfSense, but there are a few ways you can import a stylesheet.

CAUTION

BACK UP YOUR CONFIGURATION BEFORE MAKING ANY CHANGES!

I WILL NOT BE HELD RESPONSIBLE FOR CORRUPTING YOUR SYSTEM BECAUSE YOU DID NOT READ AND FOLLOW THE STEPS PRECISELY.

INSTALLATION

METHOD 1 - Add a new theme With the Filer third-party package

Summary: This method creates a new stylesheet file on the system.

  1. Install package Filer via the Package Manager1.
  2. Once installed, go to Diagnostics > Filer in the main navigation menu.
  3. Press the Add button at the bottom of the file window on the page.
  4. Enter the following full path in the File text field: /usr/local/www/css/pfsense-theme-missionctl.css
  5. Add any description you want into the Description text field, or the URL to this repository.
  6. Leave the Permissions text field empty.
  7. Paste the entire contents of the pfsense-theme-missionctl.css file into the File Contents text area.
  8. Leave the Script/Command text field empty.
  9. Select Do not run this script from the Execute mode option field.
  10. Press the Save button, at the bottom of the form.
    • Wait for the page to reload indicating the file was saved.
    • You will see it listed.
  11. Once the file has been saved, go to System > General Setup in the main navigation menu.[11]
  12. Scroll to webConfigurator : Theme
  13. Select the newly saved theme file from the Theme option field.
  14. Scroll to the bottom of the page, and press the Save button to apply the theme.
    • Wait for the page to reload with an indicator that the changes were saved.
    • The theme will not be apparent until you reload the page or navigate anywhere else within pfSense.
METHOD 2 - Overwrite an existing theme via GUI (with a built-in File Editor)

Summary: This method edits and overwrites an existing file on the system.

  1. Go to Diagnostics > Edit File in the main navigation menu.
  2. Load any of the files at /usr/local/www/css.
    • Option A: Use the Browse button to navigate to the above location.
    • Option B: Enter /usr/local/www/css/pfSense-dark-BETA.css into the text field and press the Load button to open that specific file.
  3. Select the entire contents of the loaded file and save a local copy for backup or delete it altogether.
  4. Paste the entire contents of the pfsense-theme-missionctl.css file into the text area.
  5. Press the Save button, above the text area.
    • Wait for the page to reload indicating the file was saved.
  6. Continue from STEP 11 from METHOD 1.
METHOD 3 - Via Command Line Interface (Console, SSH)

Summary: This method is intended only for system administrators and/or experienced users.

  1. Gain access to your pfSense CLI by whatever means you desire.
  2. Create a new CSS file at /user/local/www/css.
  3. Paste the contents of the pfsense-theme-missionctl.css file.
  4. Save, and Exit.
  5. Access the webConfigurator and go to System > General Setup.
  6. Continue from [11]:STEP 12 from METHOD 1.

FUTURE CONSIDERATIONS

  • Build a theme management system plugin. ... ...

SOURCE MATERIAL2


THE MARTIAN - UI SCREEN GRAPHICS

The Martian tells the story of stranded astronaut Mark Watney and NASA's efforts
to bring him home. Based on Andy Weir's novel, the story is set circa 20 years
in the future, during NASA's third manned mission to Mars. Predicated on real
science, Director Ridley Scott and Production Designer Arthur Max drew on the
expertise of specialists at NASA and the European Space Agency, and asked
Territory to craft the screen graphics and UI that would be needed.

As a story that is mediated by technology, hundreds of screens are employed
across eight key sets, forming the lens through which the drama unfolds.

Working closely with NASA, Territory developed a series of deft and elegant
concepts that combine factual integrity and filmic narrative, yet are forward
looking and pushing NASA's current UI conventions as much as possible.

Territory's plot-based graphics includes identities and visual languages for
each set, and include images, text, code, engineering schematics, 3D
visualisations based on authentic satellite images showing Martian terrain,
weather, and mission equipment served across consoles, navigation and
communication systems, laptops, mobiles, tablets, and arm screens throughout.

In all Territory delivered around 400 screens for on-set playback, most of them
featuring interactive elements. With 85 screens on the NASA Mission Control set
alone, a number of which were 6mx18m wall screens, there are many moments in
which the graphics become a dynamic bridge between Earth and Mars, narrative
and action, audience and characters.


20th Century Fox Credits
Director: Ridley Scott
Production Designer: Arthur Max
Sup. AD: Mark Holmes
Motion Graphics Art Director: Felicity Hickson

Territory Credits
Creative Director: David Sheldon-Hicks
Producer: Sam Hart
Art Direction: Marti Romances
Lead CGI: Peter Eszenyi
Design and Animation: Daniel Højlund, Marti Romances and Sam Keehan.

NASA Headquarters
Director, Planetary Science Division: Dr. Jim Green
Program Executive for Solar System Exploration: Dave Lavery
Manager, Multi-Media Programs: Bert Ulrich

Playback Credits
Compuhire

Showreel
Edit: Marti Romances
Audio: Zelig Sound

© 2015 Twentieth Century Fox, The Martian

9c79a830473933 56250e8a471fc

dac81b30473933 56250e8a48138

bda8b330473933 56250e8a49540

6bd73b30473933 56250e8a4a8a0

86678230473933 56250e8a4b966

af784030473933 56250fc19ba57

Other / Associated Imagery

33ba8730473933 56250fc19cca0

31fe7830473933 56250e8a52939 641de730473933 56250e8a5390d
037ecb30473933 56250e8a547ec b7e16030473933 56250e8a55704

Footnotes

  1. The version of Filer was "0.60.6_8" at the time of writing this document.

  2. Reference - Territory Studio: The Martian - UI Screen Graphics

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment