Integrate Tailwind framework #3999
Conversation
vitvakatu
added
the
CI: No changelog needed
vitvakatu
requested review from
MichaelMauderer,
wdanilo,
farmaazon and
mwu-tow
as code owners
There was a problem hiding this comment.
The code is ok to merge, however I would like to discuss one thing: should the tailwind run be guarded by env variable? We run the build scripts which usually expects to have node installed anyway: therefore we could just assume we can safely run npx.
Perhaps the answer is still "yes", to cover some cases where we just want to run rust compilation natively, without using our build scripts and having no node in path. But the build script could set the RUN_TAILWIND env variable by default.
| const TAILWIND_BINARY_NAME: &str = "tailwindcss"; | ||
|
|
||
| fn main() { | ||
| println!("cargo:rerun-if-changed=src"); |
There was a problem hiding this comment.
I think it should also be re-run when environment changes. See https://doc.rust-lang.org/cargo/reference/build-scripts.html#cargorerun-if-env-changedname
Also add a comment explaining why we are attached to the entire src, not just CSS_INPUT_PATH
|
@farmaazon I don't want to modify our build script for now, as it can bring unnecessary complications. E.g., I'm unsure if the output CSS is always formatted and ordered in the same way.
I was considering not making any build script at all. Still, it turned out to be quite uncomfortable for the developer (You not only need to run the tailwind manually, but you also need to remember the exact parameters for it as well). So I decided to make a simple dumb script that would simplify life for developers. I think the env variable cause should guard it; otherwise, you depend on the node, and again it brings complications If script generates a slightly different output on different machines. |
| /* | ||
| ! tailwindcss v3.2.4 | MIT License | https://tailwindcss.com | ||
| */ | ||
|
|
||
| /* | ||
| 1. Prevent padding and border from affecting element width. (https://github.com/mozdevs/cssremedy/issues/4) | ||
| 2. Allow adding a border to an element by just adding a border-width. (https://github.com/tailwindcss/tailwindcss/pull/116) |
There was a problem hiding this comment.
Is this file meant to be gitignored? Because it is mentioned in gitignore but its committed
There was a problem hiding this comment.
It is not gitignored. It is only mentioned in .prettierignore, as it is auto-generated. Keeping this file in VCS is a deliberate decision because, without it, the IDE (or, rather, the documentation panel) won't work correctly. It doesn't make much sense to regenerate it every build.
app/gui/view/documentation/build.rs
Outdated
| //! This script would run Tailwind CLI utility to generate a CSS stylesheet by scanning the | ||
| //! source code for class names and including needed CSS rules in the output file. | ||
| //! | ||
| //! This script would only run if the `RUN_TAILWIND` environment variable is defined. |
There was a problem hiding this comment.
Why? No information why such a design.
There was a problem hiding this comment.
I wrote about it here: #3999 (comment)
Do I need to add this info to the build script docs?
|
After discussion with @wdanilo we decided to remove generated stylesheet from the VCS and instead regenerate it on each build. |
|
As per discussion with @mwu-tow , the resulting stylesheet is now stored in the |
Pull Request Description
Task link
This PR moves the documentation visualization into a separate crate and sets up the Tailwind CSS framework for this new crate.
We would use Tailwind to style our HTML documentation.
2022-12-20.20-35-13.mp4
Important Notes
Checklist
Please include the following checklist in your PR:
Scala,
Java,
and
Rust
style guides.
./run ide buildand./run ide watch.