commit 458aa5f73244f642cee031d57410529af281fc01 Author: Ryan Mwangi Date: Tue Dec 3 23:07:34 2024 +0300 feat: initialize CompareWare project with Dioxus template- Ran `dx new compareware` to scaffold the project- Set up initial directory structure and dependencies- Prepared project for further development diff --git a/compareware/.gitignore b/compareware/.gitignore new file mode 100644 index 0000000..5f0b8d2 --- /dev/null +++ b/compareware/.gitignore @@ -0,0 +1,12 @@ +# Generated by Cargo +# will have compiled files and executables +/target/ +/dist/ +/static/ +/.dioxus/ + +# this file will generate by tailwind: +/assets/tailwind.css + +# These are backup files generated by rustfmt +**/*.rs.bk diff --git a/compareware/Cargo.toml b/compareware/Cargo.toml new file mode 100644 index 0000000..46b7475 --- /dev/null +++ b/compareware/Cargo.toml @@ -0,0 +1,14 @@ +[package] +name = "compareware" +version = "0.1.0" +authors = ["Ryan Mwangi "] +edition = "2021" + +# See more keys and their definitions at https://doc.rust-lang.org/cargo/reference/manifest.html + +[dependencies] + +dioxus = { version = "0.5", features = ["web", "router"] } + +# Debug +dioxus-logger = "0.5.1" diff --git a/compareware/Dioxus.toml b/compareware/Dioxus.toml new file mode 100644 index 0000000..ed098be --- /dev/null +++ b/compareware/Dioxus.toml @@ -0,0 +1,43 @@ +[application] + +# App (Project) Name +name = "compareware" + +# Dioxus App Default Platform +# web, desktop, fullstack +default_platform = "web" + +# `build` & `serve` dist path +out_dir = "dist" + +# resource (assets) file folder +asset_dir = "assets" + +[web.app] + +# HTML title tag content +title = "compareware" + +[web.watcher] + +# when watcher trigger, regenerate the `index.html` +reload_html = true + +# which files or dirs will be watcher monitoring +watch_path = ["src", "assets"] + +# include `assets` in web platform +[web.resource] + +# CSS style file + +style = ["/tailwind.css"] + +# Javascript code file +script = [] + +[web.resource.dev] + +# Javascript code file +# serve: [dev-server] only +script = [] diff --git a/compareware/README.md b/compareware/README.md new file mode 100644 index 0000000..0458151 --- /dev/null +++ b/compareware/README.md @@ -0,0 +1,17 @@ +# Development + +1. Install npm: https://docs.npmjs.com/downloading-and-installing-node-js-and-npm +2. Install the tailwind css cli: https://tailwindcss.com/docs/installation +3. Run the following command in the root of the project to start the tailwind CSS compiler: + +```bash +npx tailwindcss -i ./input.css -o ./assets/tailwind.css --watch +``` + +Run the following command in the root of the project to start the Dioxus dev server: + +```bash +dx serve --hot-reload +``` + +- Open the browser to http://localhost:8080 \ No newline at end of file diff --git a/compareware/assets/favicon.ico b/compareware/assets/favicon.ico new file mode 100644 index 0000000..eed0c09 Binary files /dev/null and b/compareware/assets/favicon.ico differ diff --git a/compareware/assets/header.svg b/compareware/assets/header.svg new file mode 100644 index 0000000..59c96f2 --- /dev/null +++ b/compareware/assets/header.svg @@ -0,0 +1,20 @@ + \ No newline at end of file diff --git a/compareware/assets/main.css b/compareware/assets/main.css new file mode 100644 index 0000000..affbeb0 --- /dev/null +++ b/compareware/assets/main.css @@ -0,0 +1,40 @@ +body { + background-color: #111216; +} + +#main { + margin: 0; + display: flex; + flex-direction: column; + justify-content: center; + align-items: center; + font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif +} + +#links { + width: 400px; + text-align: left; + font-size: x-large; + color: white; + display: flex; + flex-direction: column; +} + +#links a { + color: white; + text-decoration: none; + margin-top: 20px; + margin: 10px; + border: white 1px solid; + border-radius: 5px; + padding: 10px; +} + +#links a:hover { + background-color: #1f1f1f; + cursor: pointer; +} + +#header { + max-width: 1200px; +} diff --git a/compareware/input.css b/compareware/input.css new file mode 100644 index 0000000..bd6213e --- /dev/null +++ b/compareware/input.css @@ -0,0 +1,3 @@ +@tailwind base; +@tailwind components; +@tailwind utilities; \ No newline at end of file diff --git a/compareware/src/main.rs b/compareware/src/main.rs new file mode 100644 index 0000000..8db1d9a --- /dev/null +++ b/compareware/src/main.rs @@ -0,0 +1,52 @@ +#![allow(non_snake_case)] + +use dioxus::prelude::*; +use dioxus_logger::tracing::{info, Level}; + +#[derive(Clone, Routable, Debug, PartialEq)] +enum Route { + #[route("/")] + Home {}, + #[route("/blog/:id")] + Blog { id: i32 }, +} + +fn main() { + // Init logger + dioxus_logger::init(Level::INFO).expect("failed to init logger"); + info!("starting app"); + launch(App); +} + +fn App() -> Element { + rsx! { + Router:: {} + } +} + +#[component] +fn Blog(id: i32) -> Element { + rsx! { + Link { to: Route::Home {}, "Go to counter" } + "Blog post {id}" + } +} + +#[component] +fn Home() -> Element { + let mut count = use_signal(|| 0); + + rsx! { + Link { + to: Route::Blog { + id: count() + }, + "Go to blog" + } + div { + h1 { "High-Five counter: {count}" } + button { onclick: move |_| count += 1, "Up high!" } + button { onclick: move |_| count -= 1, "Down low!" } + } + } +} diff --git a/compareware/tailwind.config.js b/compareware/tailwind.config.js new file mode 100644 index 0000000..2a69d58 --- /dev/null +++ b/compareware/tailwind.config.js @@ -0,0 +1,9 @@ +/** @type {import('tailwindcss').Config} */ +module.exports = { + mode: "all", + content: ["./src/**/*.{rs,html,css}", "./dist/**/*.html"], + theme: { + extend: {}, + }, + plugins: [], +};