Giter VIP home page Giter VIP logo

Comments (4)

alexanderson1993 avatar alexanderson1993 commented on June 28, 2024

Where would that color slider exist? On the ship config, where you configure the layout for your ship before a flight?

Would it be possible to set separate colors for each alert condition on a per-layout basis?

Frankly, this sounds like a one-off situation, and duplicating the Epsilon layout and adjusting the colors makes more sense to me.

from thorium.

Jdog0012 avatar Jdog0012 commented on June 28, 2024

from thorium.

Trajkov avatar Trajkov commented on June 28, 2024
  • Alert Level Colors allow for more customization of each layout, so we get more value out of each layout.
    • Spooky/Low Power: Turn down the brightness of alert colors on the station
    • Alien: Perhaps yellow is all clear and blue is bad
    • Galileo: Green is good
  • Color picker would exist on the Simulator Config
  • Different alert colors exist for each layout, an alternative would be to allow the default CSS file for a given layout to be overridden by another style sheet to reduce duplicate React code.
  • This solution would use CSS custom properties which can be overridden by JavaScript which allows for the dynamic setting of alert level colors

Below is a short video proposal to demonstrate the intended functionality:
https://youtu.be/7K9vF45HiJ8

from thorium.

alexanderson1993 avatar alexanderson1993 commented on June 28, 2024

Thanks for the video demo. I can get behind this.

A few thoughts

  • When configuring the alert colors in the simulator setup, make it so it's possible to clear the alert colors, which makes the layout use the layout default color for that alert color. This is necessary because LayoutLines uses a more cyan blue than LayoutCorners, for example. They should be able to revert back to that default color without setting it explicitly.
  • One challenge that you might find is with some of the SCSS color functions which are used to transform the static color values in the layout CSS files. You can't exactly do that with CSS custom properties, since the transformations happen at build time. I don't know how you intend to address that. It's possible supporting custom CSS files might be the right way to go, but then you would have to compile the SCSS files at runtime to get those transformations in place properly. Doable, but not ideal.

The goal here is to make this an incremental change, so folks upgrading don't experience any breaking changes to how things work.

As an aside: This feature won't be necessary in Thorium Nova because themes are implemented as part of plugins, and aren't hard-coded. That means any user can write CSS (actually LESS, with TailwindCSS support built in), upload images and fonts, etc. to create a custom theme. Creating a theme with custom alert colors would involve duplicating an existing layout, changing the color variables... and that's it.

from thorium.

Related Issues (20)

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.