This repository is designed to be a collaborative working space for creating components for Leptos and Dioxus.
It's only a temporary repository to test and develop components. Once they are ready, they are integrated directly into Rust UI.
You can join the Discord server to ask questions, discuss the project, and chat about Rust in general — including job opportunities and more.
Please refer to Leptos or Dioxus documentation.
You will need these VSCode extensions:
Don't forget to :
-
rustup update
-
cargo install-update -a
-
cargo update
-
git pull origin master --rebase
cargo leptos watch
If possible, try to use this__pattern
for custom CSS classes that you didn't manage to convert to Tailwind.
This way, we can distinguish them easily.
Example:
/* For styles you don't know how to convert in Tailwind */
.img__holder {
clip-path: polygon(37.5% 20%, 62.5% 20%, 62.5% 80%, 37.5% 80%);
transform: rotate(30deg);
}
At the moment, it's probably better to keep the JS as it is and not use Rust for interacting with the DOM. While using wasm-bindgen or web_sys is possible, it seems overkill for the moment.
The main goal here is to convert the CSS, NOT the JS.
If you still want to modify the JS and only for simple scripts, you can try to use inline JS to avoid having a script.js
file to manage.
Example:
<!-- ❌ NO -->
<button id="my__button">Show an alert</button>
<script>
document.getElementById('my__button').addEventListener('click', () => {
alert('Hello from JS!');
});
</script>
<!-- ✅ YES -->
<button onclick="alert('Hello from JS!');">
"Show an alert"
</button>
PS: This is not mandatory, just a nice to have 😄
This project is licensed under the MIT License. See the LICENSE file for details.