Where do I find the frontend source code?

Hi I wanted to tinker with the frontend. There are a number of things I wanted to play with, e.g. styling and theming.

But I can’t find the sources on github? I can find the server php laravel app, but the client dart app only has the compiled app in public as main.dart.js.

Where do I find the source for the frontend?

Hi,

The frontend code is here, happy to help if you have any questions.

Awesome thanks! I saw that but I thought it’s for the mobile app - and I don’t know much about mobile apps, so I ignored it! :slight_smile:

I wanted to tweak the dark theme a bit.

Assuming I’m using the docker installation method, if I make some tweaks to the frontend, do I need to recompile the entire app? Or is there an easier way?


BTW: it would be nice for us to create some custom community themes, and share them in a repo. I’m keen to get the “nord” theme working with IN5, that would look really slick.

https://www.nordtheme.com

Nice, I like it :slight_smile:

You would need to recompile the app. If you’d like to contribute we’re happy to build theme options into the app itself.

Okay I see now there are instructions in the repo. I guess I’ll need to make a custom Dockerfile and rebuild everything.

Let me see how far I can get and report back here. We only need one custom theme, after that it becomes easy as it’s just “copy and paste”.

I’ve encountered a blocking problem - DOM elements do not have id or class attributes.

This is common for SPAs. But for people to author themes, those are needed.

There’s a work around, which is to target elements by their full css path, e.g. html body flt-glass-pane flt-scene-host flt-scene flt-transform flt-offset ....... but I’ve already tried and it’s not reliable as many elements have identical css paths.

Not sure where to go to from here.

(Also on a side note, a large number of elements are absolutely positioned, and that makes styling very hard. I guess I could work around that, though it would be messy, but I still can’t do much without ids or classes.)

How are you implementing the theme? I think the best approach would be to implement it in the app itself so it works across all platforms: web, desktop and mobile.

You’re right, I think that’s the only way right now.

But that means I must learn the framework (as would anyone else making themes). That feels like way too much effort, unless you already know dart/flutter.

I hoped to just create a custom stylesheet, which would be referenced by the app. The way you’d find in most “themed” apps.

I’ll give it more thought but I think that’s a blocker for my skill set.

If you want to try I’m happy to help!

I think Flutter has a bright future and is worth learning.

Full disclaimer… I host a podcast about Flutter so I’m probably somewhat biased :wink:

LOL you’re driving a hard sale here! I have my hands full learning new stuff for 2021 already, including wasm (which looks like the future).

Flutter looks nice though.

So much stuff to learn, so little time! :smile:

1 Like