MDietermann
c8cf525ec5
Ein neu angelegter Workspace bekommt eine Willkommen.md mit einer Kurzanleitung: was ein Workspace ist, dass Unterordner funktionieren, wozu .dionotes da ist und wo der Knopf zum Neu-Einlesen sitzt. Sie wird direkt im Editor geoeffnet, statt den Nutzer vor eine leere Flaeche zu setzen. Nur bei einem leeren Ordner. Wer einen Ordner voller Notizen importiert, will keine fremde Datei dazwischen - er kennt das Programm dann meist schon. Die Pruefung liegt vor dem Anlegen von .dionotes, denn danach ist der Ordner nie mehr leer; genau diesen Fehler hat der Test beim ersten Anlauf gefunden. Damit die Notiz angezeigt werden kann, gibt es jetzt die geoeffnete Notiz als eigenen Context - getrennt vom Workspace, weil sie sich aendert, ohne dass der Workspace wechselt. Der Editor laedt ihren Inhalt beim Wechsel nach, auf einem eigenen Thread. Dadurch schrumpft das TODO im Notiz-Baum auf eine Zeile, die gleich mit erledigt ist: Ein Klick auf eine Datei oeffnet sie und markiert sie in der Leiste. Die dafuer vorhandene CSS-Regel .file-selector.active hat damit wieder einen Nutzer. Ausdruecklich nicht dabei: Speichern, Autosave, der Umgang mit ungesicherten Aenderungen. Der Editor zeigt den Inhalt, Aenderungen landen bisher nirgends - das gehoert zum Notiz-Handling und steht als TODO im Code.
Development
Your new bare-bones project includes minimal organization with a single main.rs file and a few assets.
project/
├─ assets/ # Any assets that are used by the app should be placed here
├─ src/
│ ├─ main.rs # main.rs is the entry point to your application and currently contains all components for the app
├─ Cargo.toml # The Cargo.toml file defines the dependencies and feature flags for your project
Automatic Tailwind (Dioxus 0.7+)
As of Dioxus 0.7, there no longer is a need to manually install tailwind. Simply dx serve and you're good to go!
Automatic tailwind is supported by checking for a file called tailwind.css in your app's manifest directory (next to Cargo.toml). To customize the file, use the dioxus.toml:
[application]
tailwind_input = "my.css"
tailwind_output = "assets/out.css" # also customize the location of the out file!
Tailwind Manual Install
To use tailwind plugins or manually customize tailwind, you can can install the Tailwind CLI and use it directly.
Tailwind
- Install npm: https://docs.npmjs.com/downloading-and-installing-node-js-and-npm
- Install the Tailwind CSS CLI: https://tailwindcss.com/docs/installation/tailwind-cli
- Run the following command in the root of the project to start the Tailwind CSS compiler:
npx @tailwindcss/cli -i ./input.css -o ./assets/tailwind.css --watch
Serving Your App
Run the following command in the root of your project to start developing with the default platform:
dx serve
To run for a different platform, use the --platform platform flag. E.g.
dx serve --platform desktop