swaits/dioxus
1
0 Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Update all docs links to 0.6, release 0.6 (#3225)

Browse Source 
* update doc links to 0.6
* add new splash pages for crates
* update keyword features
* remove some unnecessary links
This commit is contained in:
Jonathan Kelley authored and GitHub committed 2024-12-06 19:15:15 -08:00
1 parent d7d2c2fd53
commit 66a50240bc
58 files changed
+298 -229
Download Patch File Download Diff File Expand all files Collapse all files

No files matched your search

Cargo.toml
+1
View File
@@ -224,6 +224,7 @@ cargo-config2 = "0.1.26"
criterion = { version = "0.5" }
walrus = "0.23.2"
cargo_metadata = "0.18.1"
parking_lot = "0.12.1"
tracing-wasm = "0.2.1"
console_error_panic_hook = "0.1.7"
README.md
+42 -66
View File
@@ -1,10 +1,14 @@
<p>
<p align="center" >
<img src="./notes/header-light.svg#gh-light-mode-only" >
<img src="./notes/header-dark.svg#gh-dark-mode-only" >
<a href="https://dioxuslabs.com">
<img src="./notes/dioxus_splash_8.avif">
</a>
<!-- <img src="./notes/header-light-updated.svg#gh-light-mode-only" >
<img src="./notes/header-dark-updated.svg#gh-dark-mode-only" > -->
<!-- <a href="https://dioxuslabs.com">
<img src="./notes/flat-splash.avif">
</a> -->
<img src="./notes/splash-header-darkmode.svg#gh-dark-mode-only" style="width: 80%; height: auto;">
<img src="./notes/splash-header.svg#gh-light-mode-only" style="width: 80%; height: auto;">
<img src="./notes/image-splash.avif">
<br>
</p>
</p>
<div align="center">
@@ -45,7 +49,7 @@
<span> | </span>
<a href="https://github.com/DioxusLabs/dioxus/tree/main/examples"> Examples </a>
<span> | </span>
<a href="https://dioxuslabs.com/learn/0.5/guide"> Guide </a>
<a href="https://dioxuslabs.com/learn/0.6/guide"> Guide </a>
<span> | </span>
<a href="https://github.com/DioxusLabs/dioxus/blob/main/translations/zh-cn/README.md"> 中文 </a>
<span> | </span>
@@ -59,6 +63,9 @@
</h3>
</div>
<br>
<p align="center">
<a href="https://dioxuslabs.com/blog/release-060/">✨ Dioxus 0.6 is released - check it out here! ✨</a>
</p>
<br>
Build for web, desktop, and mobile, and more with a single codebase. Zero-config setup, integrated hotreloading, and signals-based state management. Add backend functionality with Server Functions and bundle with our CLI.
@@ -79,42 +86,46 @@ fn app() -> Element {
- Cross-platform apps in three lines of code (web, desktop, mobile, server, and more)
- [Ergonomic state management](https://dioxuslabs.com/blog/release-050) combines the best of React, Solid, and Svelte
- Extremely performant, powered by Rust's fastest wasm-framework [sledgehammer](https://dioxuslabs.com/blog/templates-diffing)
- Type-safe Routing and server functions to leverage Rust's powerful compile-time guarantees
- Integrated bundler for deploying to the web, macOS, Linux, and Windows
- And more! Read the [take a tour of Dioxus](https://dioxuslabs.com/learn/0.5/).
- And more! [Take a tour of Dioxus](https://dioxuslabs.com/learn/0.6/).
## Instant hot-reloading
With one command, `dx serve` and your app is running. Edit your markup and styles and see the results in real time. Rust code hotreloading is not yet 1st class, but possible with [hot-lib-reloader](https://docs.rs/hot-lib-reloader/latest/hot_lib_reloader/).
With one command, `dx serve` and your app is running. Edit your markup and styles and see the results in real time.
<div align="center">
<img src="./notes/hotreload.gif">
<img src="https://raw.githubusercontent.com/DioxusLabs/screenshots/refs/heads/main/blitz/hotreload-video.webp">
<!-- <video src="https://private-user-images.githubusercontent.com/10237910/386919031-6da371d5-3340-46da-84ff-628216851ba6.mov" width="500"></video> -->
<!-- <video src="https://private-user-images.githubusercontent.com/10237910/386919031-6da371d5-3340-46da-84ff-628216851ba6.mov" width="500"></video> -->
</div>
## Bundler for deploying to the web and desktop
Simply run `dx bundle` and your app will be built and bundled with maximization optimizations. On the web, take advantage of [`.avif` generation, `.wasm` compression, minification](https://dioxuslabs.com/learn/0.5/reference/assets), and more. Build webapps weighing [less than 50kb](https://github.com/ealmloff/tiny-dioxus/) and desktop/mobile apps less than 15mb.
## First-class Android and iOS support
Dioxus is the fastest way to build native mobile apps with Rust. Simply run `dx serve --platform android` and your app is running in an emulator or on device in seconds. Call directly into JNI and Native APIs.
<div align="center">
<img src="./notes/android_and_ios2.avif" width="500">
</div>
## Bundle for web, desktop, and mobile
Simply run `dx bundle` and your app will be built and bundled with maximization optimizations. On the web, take advantage of [`.avif` generation, `.wasm` compression, minification](https://dioxuslabs.com/learn/0.6/guides/assets), and more. Build webapps weighing [less than 50kb](https://github.com/ealmloff/tiny-dioxus/) and desktop/mobile apps less than 15mb.
<div align="center">
<img src="./notes/bundle.gif">
</div>
## Fantastic documentation
We've put a ton of effort into building clean, readable, and comprehensive documentation. All html elements and listeners are documented with MDN docs, and our docsite runs continuous integration with Dioxus itself to ensure that the docs are always up to date. Check out the [Dioxus website](https://dioxuslabs.com/learn/0.5/) for guides, references, recipes, and more. Fun fact: we use the Dioxus website as a testbed for new diouxs features - [check it out!](https://github.com/dioxusLabs/docsite)
We've put a ton of effort into building clean, readable, and comprehensive documentation. All html elements and listeners are documented with MDN docs, and our docsite runs continuous integration with Dioxus itself to ensure that the docs are always up to date. Check out the [Dioxus website](https://dioxuslabs.com/learn/0.6/) for guides, references, recipes, and more. Fun fact: we use the Dioxus website as a testbed for new diouxs features - [check it out!](https://github.com/dioxusLabs/docsite)
<div align="center">
<img src="./notes/docs.avif">
</div>
## Emphasis on developer experience
Dioxus prioritizes developer experience, and we've put a ton of effort into end-to-end tooling. We've built a [VSCode extension](https://marketplace.visualstudio.com/items?itemName=DioxusLabs.dioxus) that autoformats your RSX code, converts HTML to RSX, and more. We've also built a very powerful [CLI](https://dioxuslabs.com/learn/0.5/CLI) that supports creating new apps, serving them, and cross-platform bundling, with deployment on the roadmap.
<div align="center">
<img src="./notes/autofmt.gif">
</div>
## Community
Dioxus is a community-driven project, with a very active [Discord](https://discord.gg/XgGxMSkvUM) and [GitHub](https://github.com/DioxusLabs/dioxus/issues) community. We're always looking for help, and we're happy to answer questions and help you get started. [Our SDK](https://github.com/DioxusLabs/dioxus-std) is community-run and we even have a [GitHub organization](https://github.com/dioxus-community/) for the best Dioxus crates that receive free upgrades and support.
@@ -134,8 +145,6 @@ Dioxus has grown from a side project to a small team of fulltime engineers. Than
<tr>
<td>
<b>Web</b>
<br />
<em>Tier 1 Support</em>
</td>
<td>
<ul>
@@ -146,26 +155,9 @@ Dioxus has grown from a side project to a small team of fulltime engineers. Than
</ul>
</td>
</tr>
<tr>
<td>
<b>Fullstack</b>
<br />
<em>Tier 1 Support</em>
</td>
<td>
<ul>
<li>Suspense, hydration, and server-side rendering</li>
<li>Quickly drop in backend functionality with server functions</li>
<li>Extractors, middleware, and routing integrations</li>
<li>Compatible with desktop and mobile!</li>
</ul>
</td>
</tr>
<tr>
<td>
<b>Desktop</b>
<br />
<em>Tier 1 Support</em>
</td>
<td>
<ul>
@@ -176,45 +168,29 @@ Dioxus has grown from a side project to a small team of fulltime engineers. Than
</ul>
</td>
</tr>
<tr>
<td>
<b>Liveview</b>
<br />
<em>Tier 1 Support</em>
</td>
<td>
<ul>
<li>Render apps - or just a single component - entirely on the server</li>
<li>Integrations with popular Rust frameworks like Axum and Warp</li>
<li>Extremely low-latency and ability to support 10,000+ simultaneous apps</li>
</ul>
</td>
</tr>
<tr>
<td>
<b>Mobile</b>
<br />
<em>Tier 2 Support</em>
</td>
<td>
<ul>
<li>Render using Webview or - experimentally - with WGPU or Skia </li>
<li>Support for iOS and Android </li>
<li>Currently quite experimental, with lots of improvements coming throughout 2024 </li>
<li>Build .ipa and .apk files for iOS and Android </li>
<li>Call directly into Java and Objective-C with minimal overhead</li>
<li>From "hello world" to running on device in seconds</li>
</ul>
</td>
</tr>
<tr>
<td>
<b>Terminal</b>
<br />
<em>Tier 2 Support</em>
<b>Server-side Rendering</b>
</td>
<td>
<ul>
<li>Render apps directly into your terminal, similar to <a href="https://github.com/vadimdemedes/ink"> ink.js</a></li>
<li>Powered by the familiar flexbox and CSS model of the browser</li>
<li>Built-in widgets like text input, buttons, and focus system</li>
<li>Suspense, hydration, and server-side rendering</li>
<li>Quickly drop in backend functionality with server functions</li>
<li>Extractors, middleware, and routing integrations</li>
<li>Static-site generation and incremental regeneration</li>
</ul>
</td>
</tr>
@@ -223,7 +199,7 @@ Dioxus has grown from a side project to a small team of fulltime engineers. Than
## Running the examples
> The examples in the main branch of this repository target the git version of dioxus and the CLI. If you are looking for examples that work with the latest stable release of dioxus, check out the [0.5 branch](https://github.com/DioxusLabs/dioxus/tree/v0.5/examples).
> The examples in the main branch of this repository target the git version of dioxus and the CLI. If you are looking for examples that work with the latest stable release of dioxus, check out the [0.6 branch](https://github.com/DioxusLabs/dioxus/tree/v0.6/examples).
The examples in the top level of this repository can be run with:
@@ -333,7 +309,7 @@ Dioxus and Electron are two entirely different projects with similar goals. Elec
## Contributing
- Check out the website [section on contributing](https://dioxuslabs.com/learn/0.5/contributing).
- Check out the website [section on contributing](https://dioxuslabs.com/learn/0.6/contributing).
- Report issues on our [issue tracker](https://github.com/dioxuslabs/dioxus/issues).
- [Join](https://discord.gg/XgGxMSkvUM) the discord and ask questions!
examples/tailwind/README.md
+1 -1
View File
@@ -4,4 +4,4 @@ This example shows how an app might be styled with TailwindCSS.
## Running
Our [Tailwind](https://dioxuslabs.com/learn/0.5/cookbook/tailwind) guide explains how to setup and run Dioxus-Tailwind projects.
Our [Tailwind](https://dioxuslabs.com/learn/0.6/cookbook/tailwind) guide explains how to setup and run Dioxus-Tailwind projects.
notes/android_and_ios2.avif
BIN
View File
Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 69 KiB

notes/flat-splash.avif
BIN
View File
Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 195 KiB

notes/header-dark-updated.svg
+20
View File
@@ -0,0 +1,20 @@
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" viewBox="0 0 1000 197" height="197" width="1000"><style>
@keyframes a0_t { 0% { transform: translate(225px,339.9px) scale(0,1) translate(-89.5px,-24px); } 35% { transform: translate(225px,339.9px) scale(0,1) translate(-89.5px,-24px); animation-timing-function: cubic-bezier(.6,0,.4,1); } 45% { transform: translate(225px,339.9px) scale(1,1) translate(-89.5px,-24px); } 50% { transform: translate(225px,339.9px) scale(1,1) translate(-89.5px,-24px); animation-timing-function: cubic-bezier(.6,0,.4,1); } 60% { transform: translate(225px,339.9px) scale(0,1) translate(-89.5px,-24px); } 100% { transform: translate(225px,339.9px) scale(0,1) translate(-89.5px,-24px); } }
@keyframes a1_t { 0% { transform: translate(225px,348.9px) scale(0,1) translate(-41.5px,-11px); } 20% { transform: translate(225px,348.9px) scale(0,1) translate(-41.5px,-11px); animation-timing-function: cubic-bezier(.6,0,.4,1); } 30% { transform: translate(225px,348.9px) scale(1,1) translate(-41.5px,-11px); } 35% { transform: translate(225px,348.9px) scale(1,1) translate(-41.5px,-11px); } 45% { transform: translate(225px,348.9px) scale(0,1) translate(-41.5px,-11px); } 100% { transform: translate(225px,348.9px) scale(0,1) translate(-41.5px,-11px); } }
@keyframes a3_t { 0% { transform: translate(225px,198.9px) rotate(-90deg); } 10% { transform: translate(225px,198.9px) rotate(-90deg); } 20% { transform: translate(225px,198.9px) rotate(-90deg); animation-timing-function: cubic-bezier(.6,0,.4,1); } 30% { transform: translate(225px,198.9px) rotate(0deg); } 35% { transform: translate(225px,198.9px) rotate(0deg); } 45% { transform: translate(225px,198.9px) rotate(0deg); } 50% { transform: translate(225px,198.9px) rotate(0deg); animation-timing-function: cubic-bezier(.6,0,.4,1); } 60% { transform: translate(225px,198.9px) rotate(-90deg); } 65% { transform: translate(225px,198.9px) rotate(-90deg); } 75% { transform: translate(225px,198.9px) rotate(-90deg); } 100% { transform: translate(225px,198.9px) rotate(-90deg); } }
@keyframes a2_t { 0% { transform: translate(-200px,-167px); animation-timing-function: cubic-bezier(.6,0,.4,1); } 10% { transform: translate(-150px,-80px); } 20% { transform: translate(-150px,-80px); animation-timing-function: cubic-bezier(.6,0,.4,1); } 30% { transform: translate(-200px,-123px); } 35% { transform: translate(-200px,-123px); animation-timing-function: cubic-bezier(.6,0,.4,1); } 45% { transform: translate(-150px,-100px); } 50% { transform: translate(-150px,-100px); animation-timing-function: cubic-bezier(.6,0,.4,1); } 60% { transform: translate(-150px,-80px); } 65% { transform: translate(-150px,-80px); animation-timing-function: cubic-bezier(.6,0,.4,1); } 75% { transform: translate(-217px,-200px); } 100% { transform: translate(-217px,-200px); } }
@keyframes a2_o { 0% { opacity: 0; animation-timing-function: cubic-bezier(.6,0,.4,1); } 10% { opacity: 1; } 65% { opacity: 1; animation-timing-function: cubic-bezier(.6,0,.4,1); } 75% { opacity: 0; } 100% { opacity: 0; } }
@keyframes a2_sw { 0% { stroke-width: 30px; animation-timing-function: cubic-bezier(.6,0,.4,1); } 10% { stroke-width: 8px; } 65% { stroke-width: 8px; animation-timing-function: cubic-bezier(.6,0,.4,1); } 75% { stroke-width: 30px; } 100% { stroke-width: 30px; } }
@keyframes a2_w { 0% { width: 400px; animation-timing-function: cubic-bezier(.6,0,.4,1); } 10% { width: 300px; } 20% { width: 300px; animation-timing-function: cubic-bezier(.6,0,.4,1); } 30% { width: 400px; } 35% { width: 400px; animation-timing-function: cubic-bezier(.6,0,.4,1); } 45% { width: 300px; } 50% { width: 300px; } 60% { width: 300px; } 65% { width: 300px; animation-timing-function: cubic-bezier(.6,0,.4,1); } 75% { width: 434px; } 100% { width: 434px; } }
@keyframes a2_h { 0% { height: 334px; animation-timing-function: cubic-bezier(.6,0,.4,1); } 10% { height: 160px; } 20% { height: 160px; animation-timing-function: cubic-bezier(.6,0,.4,1); } 30% { height: 246px; } 35% { height: 246px; animation-timing-function: cubic-bezier(.6,0,.4,1); } 45% { height: 200px; } 50% { height: 200px; animation-timing-function: cubic-bezier(.6,0,.4,1); } 60% { height: 160px; } 65% { height: 160px; animation-timing-function: cubic-bezier(.6,0,.4,1); } 75% { height: 400px; } 100% { height: 400px; } }
@keyframes a4_t { 0% { transform: translate(143.5px,48.9px); } 10% { transform: translate(180.5px,98.9px); } 100% { transform: translate(180.5px,98.9px); } }
@keyframes a4_w { 0% { width: 168.5px; } 10% { width: 94.5px; } 100% { width: 94.5px; } }
@keyframes a4_h { 0% { height: 302px; } 10% { height: 202px; } 100% { height: 202px; } }
@keyframes a5_t { 0% { transform: translate(217px,324.9px); animation-timing-function: cubic-bezier(.6,0,.4,1); } 10% { transform: translate(190px,324.9px); } 20% { transform: translate(190px,324.9px); } 30% { transform: translate(190px,324.9px); } 100% { transform: translate(190px,324.9px); } }
@keyframes a5_o { 0% { opacity: 0; animation-timing-function: cubic-bezier(.6,0,.4,1); } 10% { opacity: 1; } 20% { opacity: 1; } 30% { opacity: 0; } 100% { opacity: 0; } }
@keyframes a5_w { 0% { width: 16px; animation-timing-function: cubic-bezier(.6,0,.4,1); } 10% { width: 70px; } 20% { width: 70px; } 30% { width: 70px; } 100% { width: 70px; } }
@keyframes a6_t { 0% { transform: translate(217px,324.9px); } 50% { transform: translate(217px,324.9px); animation-timing-function: cubic-bezier(.6,0,.4,1); } 60% { transform: translate(190px,324.9px); } 65% { transform: translate(190px,324.9px); } 75% { transform: translate(190px,324.9px); } 100% { transform: translate(190px,324.9px); } }
@keyframes a6_o { 0% { opacity: 0; } 50% { opacity: 0; animation-timing-function: cubic-bezier(.6,0,.4,1); } 60% { opacity: 1; } 65% { opacity: 1; animation-timing-function: cubic-bezier(.6,0,.4,1); } 75% { opacity: 0; } 100% { opacity: 0; } }
@keyframes a6_w { 0% { width: 16px; } 50% { width: 16px; animation-timing-function: cubic-bezier(.6,0,.4,1); } 60% { width: 70px; } 65% { width: 70px; } 75% { width: 70px; } 100% { width: 70px; } }
@keyframes a7_t { 0% { transform: translate(225px,198.9px) scale(1.5,1.5) translate(-42.3px,-93px); animation-timing-function: cubic-bezier(.6,0,.4,1); } 10% { transform: translate(225px,198.9px) scale(1,1) translate(-42.3px,-93px); } 20% { transform: translate(225px,198.9px) scale(1,1) translate(-42.3px,-93px); animation-timing-function: cubic-bezier(.6,0,.4,1); } 25% { transform: translate(225px,198.9px) scale(.8,.8) translate(-42.3px,-93px); animation-timing-function: cubic-bezier(.6,0,.4,1); } 30% { transform: translate(225px,198.9px) scale(1,1) translate(-42.3px,-93px); } 35% { transform: translate(225px,198.9px) scale(1,1) translate(-42.3px,-93px); animation-timing-function: cubic-bezier(.4,0,.6,1); } 45% { transform: translate(225px,198.9px) scale(.8,.8) translate(-42.3px,-93px); } 50% { transform: translate(225px,198.9px) scale(.8,.8) translate(-42.3px,-93px); animation-timing-function: cubic-bezier(.4,0,.6,1); } 55% { transform: translate(225px,198.9px) scale(.7,.7) translate(-42.3px,-93px); animation-timing-function: cubic-bezier(.4,0,.6,1); } 60% { transform: translate(225px,198.9px) scale(1,1) translate(-42.3px,-93px); } 65% { transform: translate(225px,198.9px) scale(1,1) translate(-42.3px,-93px); animation-timing-function: cubic-bezier(.4,0,.6,1); } 75% { transform: translate(225px,198.9px) scale(1.5,1.5) translate(-42.3px,-93px); } 100% { transform: translate(225px,198.9px) scale(1.5,1.5) translate(-42.3px,-93px); } }
</style><defs><symbol id="Symbol-2" preserveAspectRatio="none" width="111.5" height="186" viewBox="0 0 111.5 186" overflow="visible"><g transform="translate(8.5,4.5)"><rect x="4" width="85" height="8" fill="#d9d9d9"/><rect x="4" y="26" width="85" height="8" fill="#d9d9d9"/><rect x="25" y="56" width="43" height="8" fill="#d9d9d9"/><rect width="85" height="8" fill="#d9d9d9" transform="translate(46.5,175) rotate(180) scale(-1,1) translate(-42.5,-4)"/><rect width="85" height="8" fill="#d9d9d9" transform="translate(46.5,149) rotate(180) scale(-1,1) translate(-42.5,-4)"/><rect width="43" height="8" fill="#d9d9d9" transform="translate(46.5,119) rotate(180) scale(-1,1) translate(-21.5,-4)"/><path d="M0 4c0 53 94.5 115 94.5 169" stroke="#3cc4dc" stroke-width="17" stroke-linecap="square" fill="none"/><path d="M94.5 4c0 53-94.5 115-94.5 169" stroke="#fb422d" stroke-width="17" stroke-linecap="square" fill="none"/></g></symbol><symbol id="Symbol-5" preserveAspectRatio="none" width="84.5" height="186" viewBox="0 0 84.5 186" overflow="visible"><g transform="translate(42.3,93) scale(5.352,6.9) translate(-16,60)"><g transform="translate(-34.9,-125.8)"><g transform="translate(24,5)"><path d="M33 46.5c0 3.1-0.8 5.5-2.2 7.4c-1.4 1.9-3.3 3.6-5.4 5.4c-2.2 1.7-4.5 3.6-6.3 6.2c-1.8 2.5-3.1 5.5-3.1 9.5h4.7c0-3.1 .9-5.4 2.2-7.3c1.4-1.9 3.3-3.5 5.5-5.3c2.1-1.8 4.4-3.7 6.2-6.2c1.8-2.6 3.1-5.6 3.1-9.7Z" fill="#e96020"/><path d="M20.4 70.7c-0.6 0-1 .5-1 1.1c0 .7 .4 1.2 1 1.2h12.9c.7 0 1.2-0.5 1.2-1.2c0-0.6-0.5-1.1-1.2-1.1Z" fill="#2d323b"/><path d="M21.8 66.6c-0.7 0-1 .6-1 1.2c0 .6 .3 1 .9 1h10.3c.6 0 1.1-0.5 1.1-1.1c0-0.6-0.5-1.1-1.1-1.1Z" fill="#2d323b"/><path d="M21.8 53c-0.7 0-1.2 .5-1.1 1.1c0 .6 .4 1.1 1.1 1.1h10.2c.6 0 .9-0.6 .9-1.2c0-0.6-0.3-1-0.9-1Z" fill="#2d323b"/><path d="M20.4 48.8c-0.6 0-1.2 .5-1.2 1.1c0 .7 .6 1.2 1.2 1.2h12.9c.7 0 1-0.5 1-1.1c0-0.7-0.3-1.2-1-1.2Z" fill="#2d323b"/><path d="M16 46.5c0 4.1 1.3 7.1 3.1 9.7c1.8 2.5 4.1 4.4 6.3 6.2c2.1 1.8 4 3.6 5.4 5.5c1.4 1.9 2.2 4 2.2 7.1h4.7c0-4-1.3-7.1-3.1-9.6c-1.8-2.5-4.1-4.4-6.2-6.2c-2.2-1.8-4.1-3.4-5.5-5.3c-1.3-1.9-2.2-4.3-2.2-7.4Z" fill="#00a8d6"/></g></g></g></symbol></defs><g visibility="hidden" transform="translate(774,-14.5) scale(.431111,.440249) translate(-13.9,56.6)"/><g transform="translate(56.9,37.3)"><path fill="#fff" d="M7.4 81.6v-58.4h15.1c3.8 0 7 .7 9.8 2.2c2.7 1.4 4.9 3.4 6.4 6c1.5 2.7 2.3 5.7 2.3 9.3v23.3c0 3.6-0.8 6.7-2.3 9.3c-1.5 2.7-3.7 4.7-6.4 6.1c-2.8 1.5-6 2.2-9.8 2.2Zm7.2-6.4h7.9c3.5 0 6.3-1 8.3-3c2-1.9 3-4.7 3-8.2v-23.3c0-3.4-1-6.2-3-8.1c-2-2-4.8-3-8.3-3h-7.9Zm41.8 6.4v-6.6h11.9v-45.2h-11.9v-6.6h31.2v6.6h-11.9v45.2h11.9v6.6Zm63.6 .8c-5.2 0-9.4-1.5-12.4-4.5c-3-3-4.6-7.1-4.6-12.3v-26.4c0-5.2 1.6-9.3 4.6-12.3c3-3 7.2-4.5 12.4-4.5c5.2 0 9.4 1.5 12.4 4.4c3 3 4.6 7.1 4.6 12.3v26.5c0 5.2-1.6 9.3-4.6 12.3c-3 3-7.2 4.5-12.4 4.5Zm0-6.5c3.1 0 5.6-0.9 7.2-2.7c1.7-1.7 2.6-4.3 2.6-7.6v-26.4c0-3.3-0.9-5.9-2.6-7.6c-1.6-1.8-4.1-2.7-7.2-2.7c-3.1 0-5.5 .9-7.2 2.7c-1.7 1.7-2.6 4.3-2.6 7.6v26.4c0 3.3 .9 5.9 2.6 7.6c1.7 1.8 4.1 2.7 7.2 2.7Zm27.2 5.7l16.8-29.6l-15.9-28.8h8.3l9 17.3c.5 .9 1 1.9 1.5 2.9c.5 1 .9 1.9 1.3 2.4c.2-0.5 .6-1.4 1.1-2.4c.5-1 1-2 1.5-2.9l9.2-17.3h7.9l-15.9 28.3l16.8 30.1h-8.2l-10-18.6c-0.5-0.9-1-1.8-1.5-2.9c-0.5-1-0.9-1.9-1.2-2.5c-0.2 .6-0.6 1.5-1.1 2.5c-0.5 1-1 2-1.5 2.9l-10.1 18.6Zm68.8 .8c-5.4 0-9.6-1.5-12.5-4.5c-2.9-3-4.3-7.1-4.3-12.3v-42.4h7.2v42.4c0 3.2 .8 5.7 2.4 7.6c1.5 1.9 3.9 2.8 7.2 2.8c3.2 0 5.6-0.9 7.2-2.8c1.6-1.9 2.4-4.4 2.4-7.6v-42.4h7.2v42.4c0 5.2-1.4 9.3-4.3 12.3c-2.8 3-7 4.5-12.5 4.5Zm48.3 0c-5.6 0-10.1-1.5-13.5-4.4c-3.4-2.9-5-6.9-5-11.8h7.2c0 3 1 5.3 3.1 7.1c2.1 1.8 4.8 2.7 8.2 2.7c3.3 0 6-0.9 7.9-2.7c2-1.8 3-4.1 3-7.1c0-2.3-0.6-4.3-1.8-6c-1.2-1.7-2.8-2.9-4.9-3.6l-8.7-2.7c-3.9-1.2-6.9-3.2-9.1-6.1c-2.2-2.8-3.3-6.1-3.3-9.8c0-4.7 1.5-8.5 4.6-11.4c3.2-2.8 7.3-4.2 12.5-4.2c5.2 0 9.3 1.4 12.4 4.2c3.1 2.9 4.6 6.7 4.6 11.4h-7.2c0-2.8-0.9-5.1-2.7-6.7c-1.7-1.7-4.1-2.5-7.1-2.5c-3.1 0-5.5 .8-7.3 2.5c-1.9 1.6-2.8 3.8-2.8 6.5c0 2.2 .6 4 1.8 5.6c1.3 1.5 2.9 2.6 5.1 3.3l8.9 2.9c3.7 1.2 6.6 3.3 8.8 6.2c2.2 3 3.2 6.5 3.2 10.4c0 4.9-1.6 8.9-4.8 11.8c-3.3 2.9-7.6 4.4-13.1 4.4Z"/><path fill="#fff" d="M7.1 126.2v-13.2h3.7c1.2 0 2.1 .3 2.8 .9c.7 .6 1 1.5 1 2.5c0 .8-0.1 1.4-0.5 1.8c-0.3 .5-0.8 .9-1.4 1c.7 .2 1.2 .6 1.6 1.2c.4 .6 .6 1.3 .6 2.1c0 1.1-0.3 2-1 2.7c-0.7 .6-1.6 1-2.8 1Zm1.6-7.6h2.1c.7 0 1.2-0.2 1.6-0.5c.4-0.4 .6-0.9 .6-1.5c0-0.7-0.2-1.2-0.6-1.5c-0.4-0.4-0.9-0.6-1.6-0.6h-2.1Zm0 6.1h2.2c.7 0 1.3-0.2 1.8-0.6c.4-0.4 .6-0.9 .6-1.6c0-0.8-0.2-1.3-0.6-1.8c-0.5-0.4-1.1-0.7-1.8-0.7h-2.2Zm12.9 1.7c-1.2 0-2.1-0.4-2.8-1.1c-0.6-0.6-1-1.6-1-2.7v-6.3h1.6v6.3c0 .7 .2 1.3 .6 1.7c.4 .4 .9 .6 1.6 .6c.7 0 1.2-0.2 1.6-0.6c.4-0.4 .6-1 .6-1.7v-6.3h1.6v6.3c0 1.1-0.4 2.1-1.1 2.7c-0.7 .7-1.6 1.1-2.7 1.1Zm6.9-0.2v-1.5h3.5v-6.9h-3.1v-1.5h4.8v8.4h3.3v1.5Zm4.2-11.7c-0.4 0-0.7-0.1-1-0.3c-0.2-0.2-0.3-0.5-0.3-0.8c0-0.4 .1-0.7 .3-0.9c.3-0.2 .6-0.3 1-0.3c.4 0 .7 .1 .9 .3c.2 .2 .3 .5 .3 .9c0 .3-0.1 .6-0.3 .8c-0.2 .2-0.5 .3-0.9 .3Zm11.9 11.7c-0.8 0-1.5-0.3-2.1-0.8c-0.5-0.5-0.7-1Line truncated
Side by Side

After

Width:  |  Height:  |  Size: 31 KiB

notes/header-light-updated.svg
+20
View File
@@ -0,0 +1,20 @@
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" viewBox="0 0 1000 197" height="197" width="1000"><style>
@keyframes a0_t { 0% { transform: translate(225px,339.9px) scale(0,1) translate(-89.5px,-24px); } 35% { transform: translate(225px,339.9px) scale(0,1) translate(-89.5px,-24px); animation-timing-function: cubic-bezier(.6,0,.4,1); } 45% { transform: translate(225px,339.9px) scale(1,1) translate(-89.5px,-24px); } 50% { transform: translate(225px,339.9px) scale(1,1) translate(-89.5px,-24px); animation-timing-function: cubic-bezier(.6,0,.4,1); } 60% { transform: translate(225px,339.9px) scale(0,1) translate(-89.5px,-24px); } 100% { transform: translate(225px,339.9px) scale(0,1) translate(-89.5px,-24px); } }
@keyframes a1_t { 0% { transform: translate(225px,348.9px) scale(0,1) translate(-41.5px,-11px); } 20% { transform: translate(225px,348.9px) scale(0,1) translate(-41.5px,-11px); animation-timing-function: cubic-bezier(.6,0,.4,1); } 30% { transform: translate(225px,348.9px) scale(1,1) translate(-41.5px,-11px); } 35% { transform: translate(225px,348.9px) scale(1,1) translate(-41.5px,-11px); } 45% { transform: translate(225px,348.9px) scale(0,1) translate(-41.5px,-11px); } 100% { transform: translate(225px,348.9px) scale(0,1) translate(-41.5px,-11px); } }
@keyframes a3_t { 0% { transform: translate(225px,198.9px) rotate(-90deg); } 10% { transform: translate(225px,198.9px) rotate(-90deg); } 20% { transform: translate(225px,198.9px) rotate(-90deg); animation-timing-function: cubic-bezier(.6,0,.4,1); } 30% { transform: translate(225px,198.9px) rotate(0deg); } 35% { transform: translate(225px,198.9px) rotate(0deg); } 45% { transform: translate(225px,198.9px) rotate(0deg); } 50% { transform: translate(225px,198.9px) rotate(0deg); animation-timing-function: cubic-bezier(.6,0,.4,1); } 60% { transform: translate(225px,198.9px) rotate(-90deg); } 65% { transform: translate(225px,198.9px) rotate(-90deg); } 75% { transform: translate(225px,198.9px) rotate(-90deg); } 100% { transform: translate(225px,198.9px) rotate(-90deg); } }
@keyframes a2_t { 0% { transform: translate(-200px,-167px); animation-timing-function: cubic-bezier(.6,0,.4,1); } 10% { transform: translate(-150px,-80px); } 20% { transform: translate(-150px,-80px); animation-timing-function: cubic-bezier(.6,0,.4,1); } 30% { transform: translate(-200px,-123px); } 35% { transform: translate(-200px,-123px); animation-timing-function: cubic-bezier(.6,0,.4,1); } 45% { transform: translate(-150px,-100px); } 50% { transform: translate(-150px,-100px); animation-timing-function: cubic-bezier(.6,0,.4,1); } 60% { transform: translate(-150px,-80px); } 65% { transform: translate(-150px,-80px); animation-timing-function: cubic-bezier(.6,0,.4,1); } 75% { transform: translate(-217px,-200px); } 100% { transform: translate(-217px,-200px); } }
@keyframes a2_o { 0% { opacity: 0; animation-timing-function: cubic-bezier(.6,0,.4,1); } 10% { opacity: 1; } 65% { opacity: 1; animation-timing-function: cubic-bezier(.6,0,.4,1); } 75% { opacity: 0; } 100% { opacity: 0; } }
@keyframes a2_sw { 0% { stroke-width: 30px; animation-timing-function: cubic-bezier(.6,0,.4,1); } 10% { stroke-width: 8px; } 65% { stroke-width: 8px; animation-timing-function: cubic-bezier(.6,0,.4,1); } 75% { stroke-width: 30px; } 100% { stroke-width: 30px; } }
@keyframes a2_w { 0% { width: 400px; animation-timing-function: cubic-bezier(.6,0,.4,1); } 10% { width: 300px; } 20% { width: 300px; animation-timing-function: cubic-bezier(.6,0,.4,1); } 30% { width: 400px; } 35% { width: 400px; animation-timing-function: cubic-bezier(.6,0,.4,1); } 45% { width: 300px; } 50% { width: 300px; } 60% { width: 300px; } 65% { width: 300px; animation-timing-function: cubic-bezier(.6,0,.4,1); } 75% { width: 434px; } 100% { width: 434px; } }
@keyframes a2_h { 0% { height: 334px; animation-timing-function: cubic-bezier(.6,0,.4,1); } 10% { height: 160px; } 20% { height: 160px; animation-timing-function: cubic-bezier(.6,0,.4,1); } 30% { height: 246px; } 35% { height: 246px; animation-timing-function: cubic-bezier(.6,0,.4,1); } 45% { height: 200px; } 50% { height: 200px; animation-timing-function: cubic-bezier(.6,0,.4,1); } 60% { height: 160px; } 65% { height: 160px; animation-timing-function: cubic-bezier(.6,0,.4,1); } 75% { height: 400px; } 100% { height: 400px; } }
@keyframes a4_t { 0% { transform: translate(143.5px,48.9px); } 10% { transform: translate(180.5px,98.9px); } 100% { transform: translate(180.5px,98.9px); } }
@keyframes a4_w { 0% { width: 168.5px; } 10% { width: 94.5px; } 100% { width: 94.5px; } }
@keyframes a4_h { 0% { height: 302px; } 10% { height: 202px; } 100% { height: 202px; } }
@keyframes a5_t { 0% { transform: translate(217px,324.9px); animation-timing-function: cubic-bezier(.6,0,.4,1); } 10% { transform: translate(190px,324.9px); } 20% { transform: translate(190px,324.9px); } 30% { transform: translate(190px,324.9px); } 100% { transform: translate(190px,324.9px); } }
@keyframes a5_o { 0% { opacity: 0; animation-timing-function: cubic-bezier(.6,0,.4,1); } 10% { opacity: 1; } 20% { opacity: 1; } 30% { opacity: 0; } 100% { opacity: 0; } }
@keyframes a5_w { 0% { width: 16px; animation-timing-function: cubic-bezier(.6,0,.4,1); } 10% { width: 70px; } 20% { width: 70px; } 30% { width: 70px; } 100% { width: 70px; } }
@keyframes a6_t { 0% { transform: translate(217px,324.9px); } 50% { transform: translate(217px,324.9px); animation-timing-function: cubic-bezier(.6,0,.4,1); } 60% { transform: translate(190px,324.9px); } 65% { transform: translate(190px,324.9px); } 75% { transform: translate(190px,324.9px); } 100% { transform: translate(190px,324.9px); } }
@keyframes a6_o { 0% { opacity: 0; } 50% { opacity: 0; animation-timing-function: cubic-bezier(.6,0,.4,1); } 60% { opacity: 1; } 65% { opacity: 1; animation-timing-function: cubic-bezier(.6,0,.4,1); } 75% { opacity: 0; } 100% { opacity: 0; } }
@keyframes a6_w { 0% { width: 16px; } 50% { width: 16px; animation-timing-function: cubic-bezier(.6,0,.4,1); } 60% { width: 70px; } 65% { width: 70px; } 75% { width: 70px; } 100% { width: 70px; } }
@keyframes a7_t { 0% { transform: translate(225px,198.9px) scale(1.5,1.5) translate(-42.3px,-93px); animation-timing-function: cubic-bezier(.6,0,.4,1); } 10% { transform: translate(225px,198.9px) scale(1,1) translate(-42.3px,-93px); } 20% { transform: translate(225px,198.9px) scale(1,1) translate(-42.3px,-93px); animation-timing-function: cubic-bezier(.6,0,.4,1); } 25% { transform: translate(225px,198.9px) scale(.8,.8) translate(-42.3px,-93px); animation-timing-function: cubic-bezier(.6,0,.4,1); } 30% { transform: translate(225px,198.9px) scale(1,1) translate(-42.3px,-93px); } 35% { transform: translate(225px,198.9px) scale(1,1) translate(-42.3px,-93px); animation-timing-function: cubic-bezier(.4,0,.6,1); } 45% { transform: translate(225px,198.9px) scale(.8,.8) translate(-42.3px,-93px); } 50% { transform: translate(225px,198.9px) scale(.8,.8) translate(-42.3px,-93px); animation-timing-function: cubic-bezier(.4,0,.6,1); } 55% { transform: translate(225px,198.9px) scale(.7,.7) translate(-42.3px,-93px); animation-timing-function: cubic-bezier(.4,0,.6,1); } 60% { transform: translate(225px,198.9px) scale(1,1) translate(-42.3px,-93px); } 65% { transform: translate(225px,198.9px) scale(1,1) translate(-42.3px,-93px); animation-timing-function: cubic-bezier(.4,0,.6,1); } 75% { transform: translate(225px,198.9px) scale(1.5,1.5) translate(-42.3px,-93px); } 100% { transform: translate(225px,198.9px) scale(1.5,1.5) translate(-42.3px,-93px); } }
</style><defs><symbol id="Symbol-2" preserveAspectRatio="none" width="111.5" height="186" viewBox="0 0 111.5 186" overflow="visible"><g transform="translate(8.5,4.5)"><rect x="4" width="85" height="8" fill="#d9d9d9"/><rect x="4" y="26" width="85" height="8" fill="#d9d9d9"/><rect x="25" y="56" width="43" height="8" fill="#d9d9d9"/><rect width="85" height="8" fill="#d9d9d9" transform="translate(46.5,175) rotate(180) scale(-1,1) translate(-42.5,-4)"/><rect width="85" height="8" fill="#d9d9d9" transform="translate(46.5,149) rotate(180) scale(-1,1) translate(-42.5,-4)"/><rect width="43" height="8" fill="#d9d9d9" transform="translate(46.5,119) rotate(180) scale(-1,1) translate(-21.5,-4)"/><path d="M0 4c0 53 94.5 115 94.5 169" stroke="#3cc4dc" stroke-width="17" stroke-linecap="square" fill="none"/><path d="M94.5 4c0 53-94.5 115-94.5 169" stroke="#fb422d" stroke-width="17" stroke-linecap="square" fill="none"/></g></symbol><symbol id="Symbol-5" preserveAspectRatio="none" width="84.5" height="186" viewBox="0 0 84.5 186" overflow="visible"><g transform="translate(42.3,93) scale(5.352,6.9) translate(-16,60)"><g transform="translate(-34.9,-125.8)"><g transform="translate(24,5)"><path d="M33 46.5c0 3.1-0.8 5.5-2.2 7.4c-1.4 1.9-3.3 3.6-5.4 5.4c-2.2 1.7-4.5 3.6-6.3 6.2c-1.8 2.5-3.1 5.5-3.1 9.5h4.7c0-3.1 .9-5.4 2.2-7.3c1.4-1.9 3.3-3.5 5.5-5.3c2.1-1.8 4.4-3.7 6.2-6.2c1.8-2.6 3.1-5.6 3.1-9.7Z" fill="#e96020"/><path d="M20.4 70.7c-0.6 0-1 .5-1 1.1c0 .7 .4 1.2 1 1.2h12.9c.7 0 1.2-0.5 1.2-1.2c0-0.6-0.5-1.1-1.2-1.1Z" fill="#2d323b"/><path d="M21.8 66.6c-0.7 0-1 .6-1 1.2c0 .6 .3 1 .9 1h10.3c.6 0 1.1-0.5 1.1-1.1c0-0.6-0.5-1.1-1.1-1.1Z" fill="#2d323b"/><path d="M21.8 53c-0.7 0-1.2 .5-1.1 1.1c0 .6 .4 1.1 1.1 1.1h10.2c.6 0 .9-0.6 .9-1.2c0-0.6-0.3-1-0.9-1Z" fill="#2d323b"/><path d="M20.4 48.8c-0.6 0-1.2 .5-1.2 1.1c0 .7 .6 1.2 1.2 1.2h12.9c.7 0 1-0.5 1-1.1c0-0.7-0.3-1.2-1-1.2Z" fill="#2d323b"/><path d="M16 46.5c0 4.1 1.3 7.1 3.1 9.7c1.8 2.5 4.1 4.4 6.3 6.2c2.1 1.8 4 3.6 5.4 5.5c1.4 1.9 2.2 4 2.2 7.1h4.7c0-4-1.3-7.1-3.1-9.6c-1.8-2.5-4.1-4.4-6.2-6.2c-2.2-1.8-4.1-3.4-5.5-5.3c-1.3-1.9-2.2-4.3-2.2-7.4Z" fill="#00a8d6"/></g></g></g></symbol></defs><path fill="#393939" d="M62.9 118.9v-58.4h17.3c4 0 7.4 .8 10.3 2.3c2.9 1.5 5.2 3.6 6.8 6.4c1.6 2.7 2.4 5.9 2.4 9.6v21.8c0 3.7-0.8 6.9-2.4 9.6c-1.6 2.8-3.9 4.9-6.8 6.4c-2.9 1.6-6.3 2.3-10.3 2.3Zm10-8.9h7.3c2.9 0 5.2-0.9 6.9-2.6c1.7-1.6 2.6-3.9 2.6-6.8v-21.8c0-2.9-0.9-5.1-2.6-6.8c-1.7-1.7-4-2.5-6.9-2.5h-7.3Zm39.2 8.9v-9h11.7v-40.3h-11.7v-9.1h33.6v9.1h-11.8v40.3h11.8v9Zm64.8 .8c-5.6 0-10.1-1.5-13.3-4.7c-3.3-3.1-5-7.3-5-12.6v-25.4c0-5.3 1.7-9.5 5-12.6c3.2-3.1 7.7-4.7 13.3-4.7c5.6 0 10 1.6 13.3 4.7c3.3 3.1 4.9 7.3 4.9 12.5v25.5c0 5.3-1.6 9.5-4.9 12.6c-3.3 3.2-7.7 4.7-13.3 4.7Zm0-8.8c2.7 0 4.7-0.7 6.1-2.2c1.4-1.4 2.1-3.5 2.1-6.3v-25.4c0-2.7-0.7-4.8-2.1-6.3c-1.4-1.4-3.4-2.2-6.1-2.2c-2.7 0-4.8 .8-6.2 2.2c-1.4 1.5-2.1 3.6-2.1 6.3v25.4c0 2.8 .7 4.9 2.1 6.3c1.4 1.5 3.5 2.2 6.2 2.2Zm26.2 8l16.2-29.9l-15.2-28.5h11.2l7.3 14.7c.6 1 1 2.1 1.5 3c.4 1 .7 1.8 .9 2.3c.2-0.5 .5-1.3 .9-2.3c.4-0.9 .9-2 1.5-3l7.4-14.7h10.9l-15.2 28.3l16.1 30.1h-11.2l-8.2-16.1c-0.5-1.1-1-2.1-1.5-3.1c-0.4-1.1-0.8-1.9-1-2.5c-0.2 .6-0.5 1.4-0.9 2.4c-0.5 1.1-1 2.1-1.5 3.2l-8.3 16.1Zm69.8 .8c-5.7 0-10.2-1.5-13.4-4.7c-3.3-3.1-4.9-7.3-4.9-12.7v-41.8h10.1v41.7c0 2.8 .7 4.9 2.1 6.5c1.4 1.5 3.4 2.3 6.1 2.3c2.6 0 4.6-0.8 6-2.3c1.4-1.6 2.1-3.7 2.1-6.5v-41.7h10.1v41.8c0 5.4-1.6 9.6-4.8 12.7c-3.2 3.2-7.7 4.7-13.4 4.7Zm48.1 0c-4 0-7.4-0.7-10.3-2c-2.9-1.4-5.2-3.3-6.8-5.8c-1.7-2.5-2.5-5.4-2.5-8.7h10c0 2.4 .9 4.3 2.7 5.7c1.7 1.4 4.1 2.1 7 2.1c2.9 0 5.1-0.7 6.8-2.1c1.6-1.4 2.4-3.3 2.4-5.7c0-1.9-0.5-3.6-1.7-5c-1.1-1.5-2.6-2.4-4.6-3l-7-1.9c-4.6-1.2-8.1-3.3-10.6-6.3c-2.5-3.1-3.8-6.7-3.8-11c0-4.9 1.7-8.9 5-11.8c3.3-3 7.8-4.5 13.4-4.5c5.6 0 10.1 1.5 13.4 4.4c3.4 2.9 5 6.8 5 11.7h-10c0-2.2-0.7-4-2.2-5.4c-1.6-1.3-3.7-2-6.3-2c-2.6 0-4.7 .7-6.1 2c-1.5 1.3-2.2 3.1-2.2 5.5c0 1.8 .5 3.4 1.6 4.7c1.1 1.3 2.7 2.3 4.8 2.8l7.1 2c4.5 1.2 8 3.3 10.5 6.4c2.5 3 3.7 6.7 3.7 11.1c0 3.4-0.8 6.3-2.4 8.9c-1.6 2.5-3.8 4.5-6.7 5.8c-2.9 1.4-6.3 2.1-10.2 2.1Z"/><g transform="translate(774,-14.5) scale(.431111,.440249) translate(-13.9,56.6)"><path fill="#0f1116" stroke="#0f1116" stroke-linejoin="round" d="M-50.7 4h278.2c10 0 9 0 9 0l41 40c0 0 1 0-9 0h-358c-9.9 0-9 0-9 0l38.8-40c0 0-0.9 0 9 0Z" stroke-width="10" transform="translate(225,339.9) scale(0,1) translate(-89.5,-24)" style="animation: 10s linear infinite both a0_t;"/><rect width="83" height="22" stroke="#fb422d" fill="#0f1116" rx="2" stroke-width="0" transform="translate(225,348.9) scale(0,1) translate(-41.5,-11)" style="animation: 10s linear infinite both a1_t;"/><g style="animation: 10s linear infinite both a3_t;"><rect width="400" height="334" stroke="#0f1116" fill="none" stroke-width="30" stroke-miterlimit="1" rx="10" opacity="0" transform="translate(225,198.9) rotate(-90) translate(-200,-167)" style="animation: 10s linear infinite both a2_t, 10s linear infinite both a2_o, 10s linear infinite both a2_sw, 10s linear infinite boLine truncated
Side by Side

After

Width:  |  Height:  |  Size: 31 KiB

notes/image-splash.avif
BIN
View File
Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 129 KiB

notes/splash-header-darkmode.svg
+10
View File
@@ -0,0 +1,10 @@
<svg width="827" height="204" viewBox="0 0 827 204" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M3.20314 196L1.01914 177.02H3.25514L4.68514 191.06C4.73714 191.632 4.78047 192.23 4.81514 192.854C4.86714 193.461 4.90181 193.946 4.91914 194.31C4.95381 193.946 4.99714 193.461 5.04914 192.854C5.11847 192.23 5.18781 191.632 5.25714 191.06L7.02514 177.02H9.44314L11.0551 191.06C11.1245 191.632 11.1938 192.23 11.2631 192.854C11.3325 193.461 11.3845 193.946 11.4191 194.31C11.4538 193.946 11.4885 193.461 11.5231 192.854C11.5751 192.23 11.6358 191.632 11.7051 191.06L13.1871 177.02H15.3191L13.0831 196H10.1451L8.53314 181.7C8.46381 181.111 8.40314 180.539 8.35114 179.984C8.29914 179.412 8.25581 178.97 8.22114 178.658C8.18647 178.97 8.13447 179.412 8.06514 179.984C8.01314 180.539 7.95247 181.111 7.88314 181.7L6.14114 196H3.20314ZM23.759 196.26C22.6323 196.26 21.6443 196.035 20.795 195.584C19.963 195.133 19.313 194.501 18.845 193.686C18.3943 192.854 18.169 191.892 18.169 190.8V186.9C18.169 185.791 18.3943 184.829 18.845 184.014C19.313 183.199 19.963 182.567 20.795 182.116C21.6443 181.665 22.6323 181.44 23.759 181.44C24.8857 181.44 25.865 181.665 26.697 182.116C27.5463 182.567 28.1963 183.199 28.647 184.014C29.115 184.829 29.349 185.791 29.349 186.9V189.422H20.457V190.8C20.457 191.927 20.743 192.793 21.315 193.4C21.887 193.989 22.7017 194.284 23.759 194.284C24.6603 194.284 25.3883 194.128 25.943 193.816C26.4977 193.487 26.8357 193.001 26.957 192.36H29.297C29.141 193.556 28.5517 194.509 27.529 195.22C26.5237 195.913 25.267 196.26 23.759 196.26ZM20.457 187.654H27.061V186.9C27.061 185.773 26.775 184.907 26.203 184.3C25.6483 183.693 24.8337 183.39 23.759 183.39C22.7017 183.39 21.887 183.693 21.315 184.3C20.743 184.907 20.457 185.773 20.457 186.9V187.654ZM40.1808 196.26C39.1062 196.26 38.2222 196 37.5288 195.48C36.8355 194.943 36.4282 194.206 36.3068 193.27H36.2808V196H33.9408V177.02H36.2808V181.18L36.2288 184.43H36.3068C36.4282 183.511 36.8355 182.783 37.5288 182.246C38.2222 181.709 39.1062 181.44 40.1808 181.44C41.6195 181.44 42.7722 181.917 43.6388 182.87C44.5055 183.823 44.9388 185.123 44.9388 186.77V190.956C44.9388 192.585 44.5055 193.877 43.6388 194.83C42.7722 195.783 41.6195 196.26 40.1808 196.26ZM39.4008 194.232C40.3888 194.232 41.1688 193.937 41.7408 193.348C42.3128 192.759 42.5988 191.909 42.5988 190.8V186.9C42.5988 185.791 42.3128 184.941 41.7408 184.352C41.1688 183.763 40.3888 183.468 39.4008 183.468C38.4475 183.468 37.6848 183.771 37.1128 184.378C36.5582 184.985 36.2808 185.825 36.2808 186.9V190.8C36.2808 191.875 36.5582 192.715 37.1128 193.322C37.6848 193.929 38.4475 194.232 39.4008 194.232ZM51.4287 200.16L53.5087 192.074H56.8887L53.5087 200.16H51.4287ZM80.7104 196V177.02H85.6244C86.855 177.02 87.9124 177.254 88.7964 177.722C89.6977 178.19 90.391 178.849 90.8764 179.698C91.379 180.547 91.6304 181.553 91.6304 182.714V190.28C91.6304 191.441 91.379 192.455 90.8764 193.322C90.391 194.171 89.6977 194.83 88.7964 195.298C87.9124 195.766 86.855 196 85.6244 196H80.7104ZM83.0504 193.92H85.6244C86.7684 193.92 87.661 193.599 88.3024 192.958C88.961 192.317 89.2904 191.424 89.2904 190.28V182.714C89.2904 181.587 88.961 180.703 88.3024 180.062C87.661 179.421 86.7684 179.1 85.6244 179.1H83.0504V193.92ZM101.708 196.26C100.582 196.26 99.5935 196.035 98.7442 195.584C97.9122 195.133 97.2622 194.501 96.7942 193.686C96.3435 192.854 96.1182 191.892 96.1182 190.8V186.9C96.1182 185.791 96.3435 184.829 96.7942 184.014C97.2622 183.199 97.9122 182.567 98.7442 182.116C99.5935 181.665 100.582 181.44 101.708 181.44C102.835 181.44 103.814 181.665 104.646 182.116C105.496 182.567 106.146 183.199 106.596 184.014C107.064 184.829 107.298 185.791 107.298 186.9V189.422H98.4062V190.8C98.4062 191.927 98.6922 192.793 99.2642 193.4C99.8362 193.989 100.651 194.284 101.708 194.284C102.61 194.284 103.338 194.128 103.892 193.816C104.447 193.487 104.785 193.001 104.906 192.36H107.246C107.09 193.556 106.501 194.509 105.478 195.22C104.473 195.913 103.216 196.26 101.708 196.26ZM98.4062 187.654H105.01V186.9C105.01 185.773 104.724 184.907 104.152 184.3C103.598 183.693 102.783 183.39 101.708 183.39C100.651 183.39 99.8362 183.693 99.2642 184.3C98.6922 184.907 98.4062 185.773 98.4062 186.9V187.654ZM116.856 196.208C115.383 196.208 114.178 195.87 113.242 195.194C112.306 194.518 111.838 193.591 111.838 192.412H114.23C114.23 192.949 114.481 193.374 114.984 193.686C115.504 193.981 116.145 194.128 116.908 194.128H118C118.919 194.128 119.603 193.946 120.054 193.582C120.505 193.201 120.73 192.698 120.73 192.074C120.73 191.467 120.513 190.991 120.08 190.644C119.664 190.28 119.057 190.037 118.26 189.916L116.336 189.604C114.915 189.361 113.866 188.911 113.19 188.252C112.514 187.593 112.176 186.683 112.176 185.522C112.176 184.222 112.592 183.225 113.424 182.532C114.273 181.839 115.487 181.492 117.064 181.492H118.052C119.508 181.492 120.669 181.821 121.536 182.48C122.42 183.121 122.862 183.979 122.862 185.054H120.47C120.47 184.603 120.245 184.248 119.794 183.988C119.361 183.711 118.763 183.572 118 183.572H117.012C116.197 183.572 115.565 183.745 115.114 184.092C114.681Line truncated
<path d="M150.701 122V34.4H174.221C179.901 34.4 184.821 35.52 188.981 37.76C193.221 39.92 196.501 43 198.821 47C201.141 50.92 202.301 55.56 202.301 60.92V95.36C202.301 100.72 201.141 105.4 198.821 109.4C196.501 113.4 193.221 116.52 188.981 118.76C184.821 120.92 179.901 122 174.221 122H150.701ZM162.581 111.44H174.221C179.261 111.44 183.221 110 186.101 107.12C188.981 104.24 190.421 100.32 190.421 95.36V60.92C190.421 55.96 188.981 52.08 186.101 49.28C183.221 46.4 179.261 44.96 174.221 44.96H162.581V111.44ZM224.214 122V111.2H242.094V45.2H224.214V34.4H271.974V45.2H254.094V111.2H271.974V122H224.214ZM320.047 123.2C312.047 123.2 305.727 120.96 301.087 116.48C296.447 111.92 294.127 105.68 294.127 97.76V58.52C294.127 50.68 296.447 44.52 301.087 40.04C305.727 35.48 312.047 33.2 320.047 33.2C328.047 33.2 334.367 35.48 339.007 40.04C343.647 44.52 345.967 50.68 345.967 58.52V97.76C345.967 105.68 343.647 111.92 339.007 116.48C334.367 120.96 328.047 123.2 320.047 123.2ZM320.047 112.64C324.527 112.64 327.967 111.36 330.367 108.8C332.847 106.24 334.087 102.56 334.087 97.76V58.52C334.087 53.8 332.887 50.16 330.487 47.6C328.087 45.04 324.607 43.76 320.047 43.76C315.487 43.76 312.007 45.04 309.607 47.6C307.207 50.16 306.007 53.8 306.007 58.52V97.76C306.007 102.56 307.207 106.24 309.607 108.8C312.087 111.36 315.567 112.64 320.047 112.64ZM360.44 122L385.4 77.48L361.76 34.4H375.32L388.28 59.36C389 60.8 389.72 62.28 390.44 63.8C391.24 65.32 391.84 66.48 392.24 67.28C392.64 66.48 393.2 65.32 393.92 63.8C394.64 62.28 395.36 60.8 396.08 59.36L409.16 34.4H422.24L398.6 76.88L423.56 122H410.12L395.72 95.12C395 93.68 394.28 92.2 393.56 90.68C392.84 89.08 392.28 87.8 391.88 86.84C391.48 87.8 390.92 89.08 390.2 90.68C389.48 92.2 388.72 93.64 387.92 95L373.52 122H360.44ZM463.953 123.2C455.713 123.2 449.353 120.92 444.873 116.36C440.473 111.8 438.273 105.6 438.273 97.76V34.4H450.153V97.76C450.153 102.4 451.273 106.04 453.513 108.68C455.833 111.32 459.313 112.64 463.953 112.64C468.513 112.64 471.953 111.32 474.273 108.68C476.673 106.04 477.873 102.4 477.873 97.76V34.4H489.753V97.76C489.753 105.68 487.513 111.92 483.033 116.48C478.633 120.96 472.273 123.2 463.953 123.2ZM536.266 123.2C530.586 123.2 525.626 122.2 521.386 120.2C517.146 118.2 513.866 115.4 511.546 111.8C509.226 108.12 508.066 103.8 508.066 98.84H519.946C519.946 103 521.426 106.36 524.386 108.92C527.426 111.4 531.426 112.64 536.386 112.64C541.186 112.64 544.986 111.4 547.786 108.92C550.586 106.36 551.986 103 551.986 98.84C551.986 95.56 551.106 92.68 549.346 90.2C547.586 87.64 545.186 85.92 542.146 85.04L529.786 81.32C523.626 79.48 518.826 76.4 515.386 72.08C512.026 67.76 510.346 62.68 510.346 56.84C510.346 49.64 512.706 43.92 517.426 39.68C522.146 35.36 528.506 33.2 536.506 33.2C544.426 33.2 550.746 35.36 555.466 39.68C560.186 43.92 562.546 49.6 562.546 56.72H550.666C550.666 52.8 549.386 49.64 546.826 47.24C544.266 44.84 540.826 43.64 536.506 43.64C532.106 43.64 528.586 44.84 525.946 47.24C523.306 49.56 521.986 52.68 521.986 56.6C521.986 59.72 522.866 62.4 524.626 64.64C526.466 66.88 528.986 68.48 532.186 69.44L544.906 73.4C550.746 75.24 555.346 78.4 558.706 82.88C562.066 87.36 563.746 92.64 563.746 98.72C563.746 103.68 562.586 108 560.266 111.68C558.026 115.36 554.866 118.2 550.786 120.2C546.706 122.2 541.866 123.2 536.266 123.2Z" fill="white"/>
<path d="M666.867 25.72C666.867 37.2576 664.367 46.2763 660.361 53.3827C656.354 60.4891 650.608 66.7207 644.359 73.3705C638.111 80.0202 631.36 87.085 625.994 96.6029C620.628 106.121 616.883 117.285 616.883 132.347H630.687C630.687 120.809 633.193 112.184 637.199 105.078C641.206 97.9713 646.952 91.7397 653.2 85.0899C659.449 78.4402 666.199 71.3754 671.566 61.8575C676.932 52.3396 680.676 40.7813 680.676 25.72H666.867Z" fill="#E96020"/>
<path d="M629.775 116.26C627.908 116.259 626.777 118.191 626.777 120.573C626.777 122.956 627.908 124.888 629.775 124.887H667.785C669.651 124.888 671.165 122.956 671.164 120.573C671.165 118.191 669.651 116.259 667.785 116.26H629.775Z" fill="#2D323B"/>
<path d="M633.774 100.974C631.988 100.975 630.971 103.066 630.973 105.346C630.974 107.623 631.99 109.227 633.774 109.228H663.786C665.569 109.227 667.015 107.382 667.016 105.105C667.018 102.825 665.572 100.975 663.786 100.974H633.774Z" fill="#2D323B"/>
<path d="M633.774 49.9973C631.988 49.9981 630.541 51.8483 630.544 54.1282C630.544 56.4052 631.99 58.2509 633.774 58.2517H663.786C665.569 58.2509 666.586 56.0094 666.587 53.7323C666.589 51.4524 665.572 49.9981 663.786 49.9973H633.774Z" fill="#2D323B"/>
<path d="M629.775 34.1111C627.911 34.1103 626.398 36.0377 626.396 38.4177C626.395 40.8006 627.908 42.7325 629.775 42.7317H667.785C669.651 42.7325 670.783 40.8652 670.782 38.4823C670.78 36.1023 669.649 34.1103 667.785 34.1111H629.775Z" fill="#2D323B"/>
<path d="M616.883 25.72C616.883 40.7813 620.628 52.3396 625.994 61.8575C631.36 71.3754 638.111 78.4402 644.359 85.0899C650.608 91.7397 656.354 98.8 660.361 105.906C664.367 113.013 666.867 120.809 666.867 132.347H680.676C680.676 117.285 676.932 105.955 671.566 96.4372C666.199 86.9192 659.449 79.8544 653.2 73.2047C646.952 66.555 641.206 60.3233 637.199 53.217C633.193 46.1106 630.687 37.2576 630.687 25.72H616.883Z" fill="#00A8D6"/>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 38 KiB

notes/splash-header.svg
+10
View File
@@ -0,0 +1,10 @@
<svg width="827" height="204" viewBox="0 0 827 204" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M3.20314 196L1.01914 177.02H3.25514L4.68514 191.06C4.73714 191.632 4.78047 192.23 4.81514 192.854C4.86714 193.461 4.90181 193.946 4.91914 194.31C4.95381 193.946 4.99714 193.461 5.04914 192.854C5.11847 192.23 5.18781 191.632 5.25714 191.06L7.02514 177.02H9.44314L11.0551 191.06C11.1245 191.632 11.1938 192.23 11.2631 192.854C11.3325 193.461 11.3845 193.946 11.4191 194.31C11.4538 193.946 11.4885 193.461 11.5231 192.854C11.5751 192.23 11.6358 191.632 11.7051 191.06L13.1871 177.02H15.3191L13.0831 196H10.1451L8.53314 181.7C8.46381 181.111 8.40314 180.539 8.35114 179.984C8.29914 179.412 8.25581 178.97 8.22114 178.658C8.18647 178.97 8.13447 179.412 8.06514 179.984C8.01314 180.539 7.95247 181.111 7.88314 181.7L6.14114 196H3.20314ZM23.759 196.26C22.6323 196.26 21.6443 196.035 20.795 195.584C19.963 195.133 19.313 194.501 18.845 193.686C18.3943 192.854 18.169 191.892 18.169 190.8V186.9C18.169 185.791 18.3943 184.829 18.845 184.014C19.313 183.199 19.963 182.567 20.795 182.116C21.6443 181.665 22.6323 181.44 23.759 181.44C24.8857 181.44 25.865 181.665 26.697 182.116C27.5463 182.567 28.1963 183.199 28.647 184.014C29.115 184.829 29.349 185.791 29.349 186.9V189.422H20.457V190.8C20.457 191.927 20.743 192.793 21.315 193.4C21.887 193.989 22.7017 194.284 23.759 194.284C24.6603 194.284 25.3883 194.128 25.943 193.816C26.4977 193.487 26.8357 193.001 26.957 192.36H29.297C29.141 193.556 28.5517 194.509 27.529 195.22C26.5237 195.913 25.267 196.26 23.759 196.26ZM20.457 187.654H27.061V186.9C27.061 185.773 26.775 184.907 26.203 184.3C25.6483 183.693 24.8337 183.39 23.759 183.39C22.7017 183.39 21.887 183.693 21.315 184.3C20.743 184.907 20.457 185.773 20.457 186.9V187.654ZM40.1808 196.26C39.1062 196.26 38.2222 196 37.5288 195.48C36.8355 194.943 36.4282 194.206 36.3068 193.27H36.2808V196H33.9408V177.02H36.2808V181.18L36.2288 184.43H36.3068C36.4282 183.511 36.8355 182.783 37.5288 182.246C38.2222 181.709 39.1062 181.44 40.1808 181.44C41.6195 181.44 42.7722 181.917 43.6388 182.87C44.5055 183.823 44.9388 185.123 44.9388 186.77V190.956C44.9388 192.585 44.5055 193.877 43.6388 194.83C42.7722 195.783 41.6195 196.26 40.1808 196.26ZM39.4008 194.232C40.3888 194.232 41.1688 193.937 41.7408 193.348C42.3128 192.759 42.5988 191.909 42.5988 190.8V186.9C42.5988 185.791 42.3128 184.941 41.7408 184.352C41.1688 183.763 40.3888 183.468 39.4008 183.468C38.4475 183.468 37.6848 183.771 37.1128 184.378C36.5582 184.985 36.2808 185.825 36.2808 186.9V190.8C36.2808 191.875 36.5582 192.715 37.1128 193.322C37.6848 193.929 38.4475 194.232 39.4008 194.232ZM51.4287 200.16L53.5087 192.074H56.8887L53.5087 200.16H51.4287ZM80.7104 196V177.02H85.6244C86.855 177.02 87.9124 177.254 88.7964 177.722C89.6977 178.19 90.391 178.849 90.8764 179.698C91.379 180.547 91.6304 181.553 91.6304 182.714V190.28C91.6304 191.441 91.379 192.455 90.8764 193.322C90.391 194.171 89.6977 194.83 88.7964 195.298C87.9124 195.766 86.855 196 85.6244 196H80.7104ZM83.0504 193.92H85.6244C86.7684 193.92 87.661 193.599 88.3024 192.958C88.961 192.317 89.2904 191.424 89.2904 190.28V182.714C89.2904 181.587 88.961 180.703 88.3024 180.062C87.661 179.421 86.7684 179.1 85.6244 179.1H83.0504V193.92ZM101.708 196.26C100.582 196.26 99.5935 196.035 98.7442 195.584C97.9122 195.133 97.2622 194.501 96.7942 193.686C96.3435 192.854 96.1182 191.892 96.1182 190.8V186.9C96.1182 185.791 96.3435 184.829 96.7942 184.014C97.2622 183.199 97.9122 182.567 98.7442 182.116C99.5935 181.665 100.582 181.44 101.708 181.44C102.835 181.44 103.814 181.665 104.646 182.116C105.496 182.567 106.146 183.199 106.596 184.014C107.064 184.829 107.298 185.791 107.298 186.9V189.422H98.4062V190.8C98.4062 191.927 98.6922 192.793 99.2642 193.4C99.8362 193.989 100.651 194.284 101.708 194.284C102.61 194.284 103.338 194.128 103.892 193.816C104.447 193.487 104.785 193.001 104.906 192.36H107.246C107.09 193.556 106.501 194.509 105.478 195.22C104.473 195.913 103.216 196.26 101.708 196.26ZM98.4062 187.654H105.01V186.9C105.01 185.773 104.724 184.907 104.152 184.3C103.598 183.693 102.783 183.39 101.708 183.39C100.651 183.39 99.8362 183.693 99.2642 184.3C98.6922 184.907 98.4062 185.773 98.4062 186.9V187.654ZM116.856 196.208C115.383 196.208 114.178 195.87 113.242 195.194C112.306 194.518 111.838 193.591 111.838 192.412H114.23C114.23 192.949 114.481 193.374 114.984 193.686C115.504 193.981 116.145 194.128 116.908 194.128H118C118.919 194.128 119.603 193.946 120.054 193.582C120.505 193.201 120.73 192.698 120.73 192.074C120.73 191.467 120.513 190.991 120.08 190.644C119.664 190.28 119.057 190.037 118.26 189.916L116.336 189.604C114.915 189.361 113.866 188.911 113.19 188.252C112.514 187.593 112.176 186.683 112.176 185.522C112.176 184.222 112.592 183.225 113.424 182.532C114.273 181.839 115.487 181.492 117.064 181.492H118.052C119.508 181.492 120.669 181.821 121.536 182.48C122.42 183.121 122.862 183.979 122.862 185.054H120.47C120.47 184.603 120.245 184.248 119.794 183.988C119.361 183.711 118.763 183.572 118 183.572H117.012C116.197 183.572 115.565 183.745 115.114 184.092C114.681Line truncated
<path d="M150.701 122V34.4H174.221C179.901 34.4 184.821 35.52 188.981 37.76C193.221 39.92 196.501 43 198.821 47C201.141 50.92 202.301 55.56 202.301 60.92V95.36C202.301 100.72 201.141 105.4 198.821 109.4C196.501 113.4 193.221 116.52 188.981 118.76C184.821 120.92 179.901 122 174.221 122H150.701ZM162.581 111.44H174.221C179.261 111.44 183.221 110 186.101 107.12C188.981 104.24 190.421 100.32 190.421 95.36V60.92C190.421 55.96 188.981 52.08 186.101 49.28C183.221 46.4 179.261 44.96 174.221 44.96H162.581V111.44ZM224.214 122V111.2H242.094V45.2H224.214V34.4H271.974V45.2H254.094V111.2H271.974V122H224.214ZM320.047 123.2C312.047 123.2 305.727 120.96 301.087 116.48C296.447 111.92 294.127 105.68 294.127 97.76V58.52C294.127 50.68 296.447 44.52 301.087 40.04C305.727 35.48 312.047 33.2 320.047 33.2C328.047 33.2 334.367 35.48 339.007 40.04C343.647 44.52 345.967 50.68 345.967 58.52V97.76C345.967 105.68 343.647 111.92 339.007 116.48C334.367 120.96 328.047 123.2 320.047 123.2ZM320.047 112.64C324.527 112.64 327.967 111.36 330.367 108.8C332.847 106.24 334.087 102.56 334.087 97.76V58.52C334.087 53.8 332.887 50.16 330.487 47.6C328.087 45.04 324.607 43.76 320.047 43.76C315.487 43.76 312.007 45.04 309.607 47.6C307.207 50.16 306.007 53.8 306.007 58.52V97.76C306.007 102.56 307.207 106.24 309.607 108.8C312.087 111.36 315.567 112.64 320.047 112.64ZM360.44 122L385.4 77.48L361.76 34.4H375.32L388.28 59.36C389 60.8 389.72 62.28 390.44 63.8C391.24 65.32 391.84 66.48 392.24 67.28C392.64 66.48 393.2 65.32 393.92 63.8C394.64 62.28 395.36 60.8 396.08 59.36L409.16 34.4H422.24L398.6 76.88L423.56 122H410.12L395.72 95.12C395 93.68 394.28 92.2 393.56 90.68C392.84 89.08 392.28 87.8 391.88 86.84C391.48 87.8 390.92 89.08 390.2 90.68C389.48 92.2 388.72 93.64 387.92 95L373.52 122H360.44ZM463.953 123.2C455.713 123.2 449.353 120.92 444.873 116.36C440.473 111.8 438.273 105.6 438.273 97.76V34.4H450.153V97.76C450.153 102.4 451.273 106.04 453.513 108.68C455.833 111.32 459.313 112.64 463.953 112.64C468.513 112.64 471.953 111.32 474.273 108.68C476.673 106.04 477.873 102.4 477.873 97.76V34.4H489.753V97.76C489.753 105.68 487.513 111.92 483.033 116.48C478.633 120.96 472.273 123.2 463.953 123.2ZM536.266 123.2C530.586 123.2 525.626 122.2 521.386 120.2C517.146 118.2 513.866 115.4 511.546 111.8C509.226 108.12 508.066 103.8 508.066 98.84H519.946C519.946 103 521.426 106.36 524.386 108.92C527.426 111.4 531.426 112.64 536.386 112.64C541.186 112.64 544.986 111.4 547.786 108.92C550.586 106.36 551.986 103 551.986 98.84C551.986 95.56 551.106 92.68 549.346 90.2C547.586 87.64 545.186 85.92 542.146 85.04L529.786 81.32C523.626 79.48 518.826 76.4 515.386 72.08C512.026 67.76 510.346 62.68 510.346 56.84C510.346 49.64 512.706 43.92 517.426 39.68C522.146 35.36 528.506 33.2 536.506 33.2C544.426 33.2 550.746 35.36 555.466 39.68C560.186 43.92 562.546 49.6 562.546 56.72H550.666C550.666 52.8 549.386 49.64 546.826 47.24C544.266 44.84 540.826 43.64 536.506 43.64C532.106 43.64 528.586 44.84 525.946 47.24C523.306 49.56 521.986 52.68 521.986 56.6C521.986 59.72 522.866 62.4 524.626 64.64C526.466 66.88 528.986 68.48 532.186 69.44L544.906 73.4C550.746 75.24 555.346 78.4 558.706 82.88C562.066 87.36 563.746 92.64 563.746 98.72C563.746 103.68 562.586 108 560.266 111.68C558.026 115.36 554.866 118.2 550.786 120.2C546.706 122.2 541.866 123.2 536.266 123.2Z" fill="#323232"/>
<path d="M666.867 25.72C666.867 37.2576 664.367 46.2763 660.361 53.3827C656.354 60.4891 650.608 66.7207 644.359 73.3705C638.111 80.0202 631.36 87.085 625.994 96.6029C620.628 106.121 616.883 117.285 616.883 132.347H630.687C630.687 120.809 633.193 112.184 637.199 105.078C641.206 97.9713 646.952 91.7397 653.2 85.0899C659.449 78.4402 666.199 71.3754 671.566 61.8575C676.932 52.3396 680.676 40.7813 680.676 25.72H666.867Z" fill="#E96020"/>
<path d="M629.775 116.26C627.908 116.259 626.777 118.191 626.777 120.573C626.777 122.956 627.908 124.888 629.775 124.887H667.785C669.651 124.888 671.165 122.956 671.164 120.573C671.165 118.191 669.651 116.259 667.785 116.26H629.775Z" fill="#2D323B"/>
<path d="M633.774 100.974C631.988 100.975 630.971 103.066 630.973 105.346C630.974 107.623 631.99 109.227 633.774 109.228H663.786C665.569 109.227 667.015 107.382 667.016 105.105C667.018 102.825 665.572 100.975 663.786 100.974H633.774Z" fill="#2D323B"/>
<path d="M633.774 49.9973C631.988 49.9981 630.541 51.8483 630.544 54.1282C630.544 56.4052 631.99 58.2509 633.774 58.2517H663.786C665.569 58.2509 666.586 56.0094 666.587 53.7323C666.589 51.4524 665.572 49.9981 663.786 49.9973H633.774Z" fill="#2D323B"/>
<path d="M629.775 34.1111C627.911 34.1103 626.398 36.0377 626.396 38.4177C626.395 40.8006 627.908 42.7325 629.775 42.7317H667.785C669.651 42.7325 670.783 40.8652 670.782 38.4823C670.78 36.1023 669.649 34.1103 667.785 34.1111H629.775Z" fill="#2D323B"/>
<path d="M616.883 25.72C616.883 40.7813 620.628 52.3396 625.994 61.8575C631.36 71.3754 638.111 78.4402 644.359 85.0899C650.608 91.7397 656.354 98.8 660.361 105.906C664.367 113.013 666.867 120.809 666.867 132.347H680.676C680.676 117.285 676.932 105.955 671.566 96.4372C666.199 86.9192 659.449 79.8544 653.2 73.2047C646.952 66.555 641.206 60.3233 637.199 53.217C633.193 46.1106 630.687 37.2576 630.687 25.72H616.883Z" fill="#00A8D6"/>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 38 KiB

packages/autofmt/Cargo.toml
+1 -2
View File
@@ -7,8 +7,7 @@ description = "Autofomatter for Dioxus RSX"
license = "MIT OR Apache-2.0"
repository = "https://github.com/DioxusLabs/dioxus/"
homepage = "https://dioxuslabs.com"
keywords = ["dom", "ui", "gui", "react"]
# See more keys and their definitions at https://doc.rust-lang.org/cargo/reference/manifest.html
keywords = ["web", "desktop", "mobile", "gui", "wasm"]
[dependencies]
dioxus-rsx = { workspace = true }
packages/autofmt/README.md
+1 -1
View File
@@ -15,7 +15,7 @@
[discord-url]: https://discord.gg/XgGxMSkvUM
[Website](https://dioxuslabs.com) |
[Guides](https://dioxuslabs.com/learn/0.5) |
[Guides](https://dioxuslabs.com/learn/0.6) |
[API Docs](https://docs.rs/dioxus-autofmt/latest/dioxus_autofmt) |
[Chat](https://discord.gg/XgGxMSkvUM)
packages/check/Cargo.toml
+1 -2
View File
@@ -7,8 +7,7 @@ description = "Checks Dioxus RSX files for issues"
license = "MIT/Apache-2.0"
repository = "https://github.com/DioxusLabs/dioxus/"
homepage = "https://dioxuslabs.com"
keywords = ["dom", "ui", "gui", "react"]
# See more keys and their definitions at https://doc.rust-lang.org/cargo/reference/manifest.html
keywords = ["web", "desktop", "mobile", "gui", "wasm"]
[dependencies]
proc-macro2 = { workspace = true, features = ["span-locations"] }
packages/check/README.md
+2 -2
View File
@@ -15,13 +15,13 @@
[discord-url]: https://discord.gg/XgGxMSkvUM
[Website](https://dioxuslabs.com) |
[Guides](https://dioxuslabs.com/learn/0.5) |
[Guides](https://dioxuslabs.com/learn/0.6) |
[API Docs](https://docs.rs/dioxus-check) |
[Chat](https://discord.gg/XgGxMSkvUM)
## Overview
`dioxus-check` analyzes Dioxus source code and reports errors and warnings. Primarily, it enforces the [Rules of Hooks](https://dioxuslabs.com/learn/0.5/reference/hooks#rules-of-hooks).
`dioxus-check` analyzes Dioxus source code and reports errors and warnings. Primarily, it enforces the [Rules of Hooks](https://dioxuslabs.com/learn/0.6/reference/hooks#rules-of-hooks).
## Contributing
packages/check/src/issues.rs
+3 -3
View File
@@ -162,11 +162,11 @@ impl Display for IssueReport {
#[allow(clippy::enum_variant_names)] // we'll add non-hook ones in the future
/// Issues that might be found via static analysis of a Dioxus file.
pub enum Issue {
/// <https://dioxuslabs.com/learn/0.5/reference/hooks#no-hooks-in-conditionals>
/// <https://dioxuslabs.com/learn/0.6/reference/hooks#no-hooks-in-conditionals>
HookInsideConditional(HookInfo, ConditionalInfo),
/// <https://dioxuslabs.com/learn/0.5/reference/hooks#no-hooks-in-loops>
/// <https://dioxuslabs.com/learn/0.6/reference/hooks#no-hooks-in-loops>
HookInsideLoop(HookInfo, AnyLoopInfo),
/// <https://dioxuslabs.com/learn/0.5/reference/hooks#no-hooks-in-closures>
/// <https://dioxuslabs.com/learn/0.6/reference/hooks#no-hooks-in-closures>
HookInsideClosure(HookInfo, ClosureInfo),
HookInsideAsync(HookInfo, AsyncInfo),
HookOutsideComponent(HookInfo),
packages/cli-config/Cargo.toml
+1 -1
View File
@@ -7,7 +7,7 @@ license = "MIT OR Apache-2.0"
repository = "https://github.com/DioxusLabs/dioxus/"
homepage = "https://dioxuslabs.com"
description = "CLI Configuration for dioxus-cli"
keywords = ["dom", "ui", "gui", "react", ]
keywords = ["web", "desktop", "mobile", "gui", "wasm"]
[dependencies]
wasm-bindgen = { workspace = true, optional = true }
packages/cli/Cargo.toml
+2 -2
View File
@@ -3,10 +3,10 @@ name = "dioxus-cli"
version = { workspace = true }
authors = ["Jonathan Kelley"]
edition = "2021"
description = "CLI tool for developing, testing, and publishing Dioxus apps"
description = "CLI for building fullstack web, desktop, and mobile apps with a single codebase."
repository = "https://github.com/DioxusLabs/dioxus/"
license = "MIT OR Apache-2.0"
keywords = ["react", "gui", "cli", "dioxus", "wasm"]
keywords = ["mobile", "gui", "cli", "dioxus", "wasm"]
rust-version = "1.79.0"
[dependencies]
packages/cli/README.md
-3
View File
@@ -63,9 +63,6 @@ default_platform = "web"
[web.app]
title = "Hello"
[web.watcher]
[web.resource.dev]
```
The full anatomy of `Dioxus.toml` is shown on the [Dioxus website](https://dioxuslabs.com/learn/0.5/CLI/configure).
packages/config-macro/Cargo.toml
+1 -1
View File
@@ -7,7 +7,7 @@ description = "Configuration macros for Dioxus"
license = "MIT OR Apache-2.0"
repository = "https://github.com/DioxusLabs/dioxus/"
homepage = "https://dioxuslabs.com"
keywords = ["dom", "ui", "gui", "react"]
keywords = ["web", "desktop", "mobile", "gui", "wasm"]
[lib]
proc-macro = true
packages/config-macro/README.md
+1 -1
View File
@@ -15,7 +15,7 @@
[discord-url]: https://discord.gg/XgGxMSkvUM
[Website](https://dioxuslabs.com) |
[Guides](https://dioxuslabs.com/learn/0.5) |
[Guide](https://dioxuslabs.com/learn/0.6) |
[API Docs](https://docs.rs/dioxus-config-macro/latest/dioxus_config_macro/) |
[Chat](https://discord.gg/XgGxMSkvUM)
packages/core-macro/README.md
+1 -1
View File
@@ -15,7 +15,7 @@
[discord-url]: https://discord.gg/XgGxMSkvUM
[Website](https://dioxuslabs.com) |
[Guides](https://dioxuslabs.com/learn/0.5) |
[Guides](https://dioxuslabs.com/learn/0.6) |
[API Docs](https://docs.rs/dioxus-core-macro/latest/dioxus_core_macro) |
[Chat](https://discord.gg/XgGxMSkvUM)
packages/core-macro/src/props/mod.rs
+1 -1
View File
@@ -1055,7 +1055,7 @@ Finally, call `.build()` to create the instance of `{name}`.
name: field_name, ..
} = field;
if *field_name == "key" {
return Err(Error::new_spanned(field_name, "Naming a prop `key` is not allowed because the name can conflict with the built in key attribute. See https://dioxuslabs.com/learn/0.5/reference/dynamic_rendering#rendering-lists for more information about keys"));
return Err(Error::new_spanned(field_name, "Naming a prop `key` is not allowed because the name can conflict with the built in key attribute. See https://dioxuslabs.com/learn/0.6/reference/dynamic_rendering#rendering-lists for more information about keys"));
}
let StructInfo {
ref builder_name, ..
packages/core/Cargo.toml
+2 -2
View File
@@ -3,11 +3,11 @@ name = "dioxus-core"
version = { workspace = true }
authors = ["Jonathan Kelley"]
edition = "2021"
description = "Core functionality for Dioxus - a concurrent renderer-agnostic Virtual DOM for interactive user experiences"
description = "Build fullstack web, desktop, and mobile apps with a single codebase."
license = "MIT OR Apache-2.0"
repository = "https://github.com/DioxusLabs/dioxus/"
homepage = "https://dioxuslabs.com"
keywords = ["dom", "ui", "gui", "react"]
keywords = ["web", "desktop", "mobile", "gui", "wasm"]
[dependencies]
dioxus-core-types = { workspace = true }
packages/core/README.md
+1 -1
View File
@@ -81,7 +81,7 @@ fn main() {
## Contributing
- Check out the website [section on contributing](https://dioxuslabs.com/learn/0.5/contributing).
- Check out the website [section on contributing](https://dioxuslabs.com/learn/0.6/contributing).
- Report issues on our [issue tracker](https://github.com/dioxuslabs/dioxus/issues).
- [Join](https://discord.gg/XgGxMSkvUM) the discord and ask questions!
packages/desktop/Cargo.toml
+1 -1
View File
@@ -6,7 +6,7 @@ edition = "2021"
description = "WebView renderer for Dioxus"
license = "MIT OR Apache-2.0"
repository = "https://github.com/DioxusLabs/dioxus/"
homepage = "https://dioxuslabs.com/learn/0.5/getting_started"
homepage = "https://dioxuslabs.com/learn/0.6/getting_started"
keywords = ["dom", "ui", "gui", "react"]
[dependencies]
packages/desktop/README.md
+2 -2
View File
@@ -15,7 +15,7 @@
[discord-url]: https://discord.gg/XgGxMSkvUM
[Website](https://dioxuslabs.com) |
[Guides](https://dioxuslabs.com/learn/0.5) |
[Guides](https://dioxuslabs.com/learn/0.6) |
[API Docs](https://docs.rs/dioxus-desktop/latest/dioxus_desktop) |
[Chat](https://discord.gg/XgGxMSkvUM)
@@ -25,7 +25,7 @@
This requires that webview is installed on the target system. WebView is installed by default on macOS and iOS devices, but might not come preinstalled on Windows or Linux devices. To fix these issues, follow the [instructions in the guide](guide-url).
[guide-url]: https://dioxuslabs.com/learn/0.5/getting_started
[guide-url]: https://dioxuslabs.com/learn/0.6/getting_started
## Features
packages/desktop/src/readme.md
+1 -1
View File
@@ -47,4 +47,4 @@ To configure the webview, menubar, and other important desktop-specific features
## Future Steps
Make sure to read the [Dioxus Guide](https://dioxuslabs.com/learn/0.5/) if you already haven't!
Make sure to read the [Dioxus Guide](https://dioxuslabs.com/learn/0.6/) if you already haven't!
packages/dioxus-lib/Cargo.toml
+2 -2
View File
@@ -3,10 +3,10 @@ name = "dioxus-lib"
version = { workspace = true }
authors = ["Jonathan Kelley", "Dioxus Labs", "ealmloff"]
edition = "2021"
description = "Portable, performant, and ergonomic framework for building cross-platform user interfaces in Rust"
description = "Build fullstack web, desktop, and mobile apps with a single codebase."
license = "MIT OR Apache-2.0"
repository = "https://github.com/DioxusLabs/dioxus/"
homepage = "https://dioxuslabs.com/learn/0.5/"
homepage = "https://dioxuslabs.com/learn/0.6/"
keywords = ["dom", "ui", "gui", "react", "wasm"]
rust-version = "1.79.0"
packages/dioxus-lib/README.md
+23 -14
View File
@@ -1,20 +1,29 @@
<div>
<h1>🌗🚀 Dioxus (lib)</h1>
<p>
<strong>A concurrent, functional, virtual DOM for Rust</strong>
</p>
<div align="center">
<style>
@media (prefers-color-scheme: dark) { .darkmode-image { display: none; } }
@media (prefers-color-scheme: light) { .lightmode-image { display: none; } }
</style>
<img
src="https://github.com/user-attachments/assets/6c7e227e-44ff-4e53-824a-67949051149c"
alt="Build web, desktop, and mobile apps with a single codebase."
width="100%"
class="darkmode-image"
>
<img
src="https://github.com/user-attachments/assets/9c6a5fac-806d-4391-80d0-d87d63c406eb"
alt="Build web, desktop, and mobile apps with a single codebase."
width="100%"
class="lightmode-image"
>
<div>
<a href=https://dioxuslabs.com/learn/0.6/getting_started>Getting Started</a> | <a href="https://dioxuslabs.com/learn/0.6">Book (0.6)</a> | <a href="https://github.com/DioxusLabs/dioxus/tree/main/examples">Examples</a>
</div>
</div>
---
> This crate implements dioxus-lib which is a renderer-free version of Dioxus. This crate is intended to be used by library authors who need a stable core version of dioxus withuot pulling in renderer-related dependencies on accident.
# Resources
This overview provides a brief introduction to Dioxus. For a more in-depth guide, make sure to check out:
- [Getting Started](https://dioxuslabs.com/learn/0.5/getting_started)
- [Book (0.5)](https://dioxuslabs.com/learn/0.5)
- [Examples](https://github.com/DioxusLabs/dioxus/tree/main/examples)
# Overview and Goals
Dioxus makes it easy to quickly build complex user interfaces with Rust. Any Dioxus app can run in the web browser,
@@ -202,7 +211,7 @@ fn App() -> Element {
```
Hooks are sensitive to how they are used. To use hooks, you must abide by the
["rules of hooks"](https://dioxuslabs.com/learn/0.5/reference/hooks#rules-of-hooks):
["rules of hooks"](https://dioxuslabs.com/learn/0.6/reference/hooks#rules-of-hooks):
- Functions with "use\_" should not be called in callbacks
- Functions with "use\_" should not be called out of order
packages/dioxus/Cargo.toml
+11 -4
View File
@@ -3,11 +3,11 @@ name = "dioxus"
version = { workspace = true }
authors = ["Jonathan Kelley", "Dioxus Labs", "ealmloff"]
edition = "2021"
description = "Portable, performant, and ergonomic framework for building cross-platform user interfaces in Rust"
description = "Build fullstack web, desktop, and mobile apps with a single codebase."
license = "MIT OR Apache-2.0"
repository = "https://github.com/DioxusLabs/dioxus/"
homepage = "https://dioxuslabs.com/learn/0.5/"
keywords = ["dom", "ui", "gui", "react", "wasm"]
homepage = "https://dioxuslabs.com"
keywords = ["web", "desktop", "mobile", "gui", "wasm"]
rust-version = "1.79.0"
[dependencies]
@@ -29,7 +29,7 @@ dioxus-ssr = { workspace = true, optional = true }
manganis = { workspace = true, features = ["dioxus"], optional = true }
dioxus-logger = { workspace = true, optional = true }
serde = { version = "1.0.136", optional = true }
serde = { workspace = true, optional = true }
dioxus-cli-config = { workspace = true, optional = true }
[target.'cfg(not(any(target_arch = "wasm32", target_os = "ios", target_os = "android")))'.dependencies]
@@ -91,3 +91,10 @@ features = [
"liveview",
"server"
]
targets = [
"wasm32-unknown-unknown",
"aarch64-apple-darwin",
"x86_64-unknown-linux-gnu",
"x86_64-pc-windows-msvc",
"aarch64-linux-android",
]
packages/dioxus/README.md
+59 -42
View File
@@ -1,42 +1,65 @@
<div>
<h1>🌗🚀 Dioxus</h1>
<p>
<strong>A concurrent, functional, virtual DOM for Rust</strong>
</p>
<div align="center">
<style>
@media (prefers-color-scheme: dark) { .darkmode-image { display: none; } }
@media (prefers-color-scheme: light) { .lightmode-image { display: none; } }
</style>
<img
src="https://github.com/user-attachments/assets/6c7e227e-44ff-4e53-824a-67949051149c"
alt="Build web, desktop, and mobile apps with a single codebase."
width="100%"
class="darkmode-image"
>
<img
src="https://github.com/user-attachments/assets/9c6a5fac-806d-4391-80d0-d87d63c406eb"
alt="Build web, desktop, and mobile apps with a single codebase."
width="100%"
class="lightmode-image"
>
<div>
<a href=https://dioxuslabs.com/learn/0.6/getting_started>Getting Started</a> | <a href="https://dioxuslabs.com/learn/0.6">Book (0.6)</a> | <a href="https://github.com/DioxusLabs/dioxus/tree/main/examples">Examples</a>
</div>
</div>
# Resources
---
Dioxus is a framework for building cross-platform apps in Rust. With one codebase, you can build web, desktop, and mobile apps with fullstack server functions. Dioxus is designed to be easy to learn for developers familiar with web technologies like HTML, CSS, and JavaScript.
This overview provides a brief introduction to Dioxus. For a more in-depth guide, make sure to check out:
<div align="center">
<img src="https://github.com/user-attachments/assets/dddae6a9-c13b-4a88-84e8-dc98c1286d2a" alt="App with dioxus" height="600px">
</div>
- [Getting Started](https://dioxuslabs.com/learn/0.5/getting_started)
- [Book (0.5)](https://dioxuslabs.com/learn/0.5)
- [Examples](https://github.com/DioxusLabs/dioxus/tree/main/examples)
## At a glance
# Overview and Goals
Dioxus is crossplatform app framework that empowers developer to build beautiful, fast, type-safe apps with Rust. By default, Dioxus apps are declared with HTML and CSS. Dioxus includes a number of useful features:
Dioxus makes it easy to quickly build complex user interfaces with Rust. Any Dioxus app can run in the web browser,
as a desktop app, as a mobile app, or anywhere else provided you build the right renderer.
- Hotreloading of RSX markup and assets
- Interactive CLI with logging, project templates, linting, and more
- Integrated bundler for deploying to the web, macOS, Linux, and Windows
- Support for modern web features like SSR, Hydration, and HTML streaming
- Direct access to system APIs through JNI (Android), CoreFoundation (Apple), and web-sys (web)
- Type-safe application routing and server functions
Dioxus is heavily inspired by React, supporting many of the same concepts:
## Quick start
- Hooks for state
- VirtualDom & diffing
- Concurrency, fibers, and asynchronous rendering
- JSX-like templating syntax
To get started with Dioxus, you'll want to grab the dioxus-cli tool: `dx`. We distribute `dx` with `cargo-binstall` - if you already have binstall skip this step.
```shell
# skip if you already have cargo-binstall
cargo install cargo-binstall
If you know React, then you know Dioxus.
# install the precompiled `dx` tool
cargo binstall dioxus-cli
Dioxus is _substantially_ more performant than many of the other Rust UI libraries (Yew/Percy) and is _significantly_ more performant
than React—roughly competitive with InfernoJS.
# create a new app, following the template
dx new my-app && cd my-app
Remember: Dioxus is a library for declaring interactive user interfaces—it is not a dedicated renderer. Most 1st party renderers for Dioxus currently only support web technologies.
# and then serve!
dx serve --platform desktop
```
## Brief Overview
## Your first app
All Dioxus apps are built by composing functions that start with a capital letter and return an `Element`.
All Dioxus apps are built by composing functions return an `Element`.
To launch an app, we use the `launch` method and use features in `Cargo.toml` to specify which renderer we want to use. In the launch function, we pass the app's root `Component`.
To launch an app, we use the `launch` method. In the launch function, we pass the app's root `Component`.
```rust, no_run
use dioxus::prelude::*;
@@ -107,10 +130,9 @@ fn App() -> Element {
## Components
We can compose these function components to build a complex app. Each new
component we design must take some Properties. For components with no explicit properties, we can omit the type altogether.
We can compose these function components to build a complex app. Each new component takes some Properties. For components with no explicit properties, we can omit the type altogether.
In Dioxus, all properties are memorized by default with Clone and PartialEq. For props you can't clone, simply wrap the fields in a [`ReadOnlySignal`](dioxus_signals::ReadOnlySignal) and Dioxus will handle converting types for you.
In Dioxus, all properties are memoized by default with `Clone` and `PartialEq`. For props you can't clone, simply wrap the fields in a [`ReadOnlySignal`](dioxus_signals::ReadOnlySignal) and Dioxus will handle converting types for you.
```rust, no_run
# use dioxus::prelude::*;
@@ -142,16 +164,14 @@ fn Header(title: String, color: String) -> Element {
}
```
> You can read more about props in the [reference](https://dioxuslabs.com/learn/0.5/reference/component_props).
> You can read more about props in the [reference](https://dioxuslabs.com/learn/0.6/reference/component_props).
## Hooks
While components are reusable forms of UI elements, hooks are reusable forms
of logic. Hooks provide a way of retrieving state from Dioxus' internal `Scope` and using
While components are reusable forms of UI elements, hooks are reusable forms of logic. Hooks provide a way of retrieving state from Dioxus' internal `Scope` and using
it to render UI elements.
By convention, all hooks are functions that should start with `use_`. We can
use hooks to define the state and modify it from within listeners.
By convention, all hooks are functions that should start with `use_`. We can use hooks to define the state and modify it from within listeners.
```rust, no_run
# use dioxus::prelude::*;
@@ -164,17 +184,14 @@ fn App() -> Element {
}
```
Hooks are sensitive to how they are used. To use hooks, you must abide by the
["rules of hooks"](https://dioxuslabs.com/learn/0.5/reference/hooks#rules-of-hooks):
Hooks are sensitive to how they are used. To use hooks, you must abide by the ["rules of hooks"](https://dioxuslabs.com/learn/0.6/reference/hooks#rules-of-hooks):
- Hooks can only be called in the body of a component or another hook. Not inside of another expression like a loop, conditional or function call.
- Hooks should start with "use\_"
In a sense, hooks let us add a field of state to our component without declaring
an explicit state struct. However, this means we need to "load" the struct in the right
order. If that order is wrong, then the hook will pick the wrong state and panic.
Hooks let us add a field of state to our component without declaring an explicit state struct. However, this means we need to "load" the struct in the right order. If that order is wrong, then the hook will pick the wrong state and panic.
Dioxus includes many built-in hooks that you can use in your components. If those hooks don't fit your use case, you can also extend Dioxus with [custom hooks](https://dioxuslabs.com/learn/0.5/cookbook/state/custom_hooks).
Dioxus includes many built-in hooks that you can use in your components. If those hooks don't fit your use case, you can also extend Dioxus with custom hooks.
## Putting it all together
@@ -201,18 +218,18 @@ fn App() -> Element {
## Conclusion
This overview doesn't cover everything. Make sure to check out the [tutorial](https://dioxuslabs.com/learn/0.5/guide) and [reference](https://dioxuslabs.com/learn/0.5/reference) on the official
This overview doesn't cover everything. Make sure to check out the [tutorial](https://dioxuslabs.com/learn/0.6/guide) and [guides](https://dioxuslabs.com/learn/0.6/guides) on the official
website for more details.
Beyond this overview, Dioxus supports:
- [Server-side rendering](https://dioxuslabs.com/learn/0.5/reference/fullstack)
- Server-side rendering
- Concurrent rendering (with async support)
- Web/Desktop/Mobile support
- Pre-rendering and hydration
- Fragments, and Suspense
- Inline-styles
- [Custom event handlers](https://dioxuslabs.com/learn/0.5/reference/event_handlers#handler-props)
- Custom event handlers
- Custom elements
- Basic fine-grained reactivity (IE SolidJS/Svelte)
- and more!
packages/dioxus/src/lib.rs
+3 -2
View File
@@ -9,12 +9,13 @@
//! - `html`: (default) exports `dioxus-html` as the default elements to use in rsx
//! - `hooks`: (default) re-exports `dioxus-hooks`
//! - `hot-reload`: (default) enables hot rsx reloading in all renderers that support it
//! - `router`: exports the [router](https://dioxuslabs.com/learn/0.5/router) and enables any router features for the current platform
//! - `router`: exports the [router](https://dioxuslabs.com/learn/0.6/router) and enables any router features for the current platform
//! - `third-party-renderer`: Just disables warnings about no active platform when no renderers are enabled
//! - `logger`: Enable the default tracing subscriber for Dioxus apps
//!
//! Platform features (the current platform determines what platform the [`launch()`] function runs):
//!
//! - `fullstack`: enables the fullstack platform. This must be used in combination with the `web` feature for wasm builds and `axum` feature for server builds
//! - `fullstack`: enables the fullstack platform. This must be used in combination with the `web` feature for wasm builds and `server` feature for server builds
//! - `desktop`: enables the desktop platform
//! - `mobile`: enables the mobile platform
//! - `web`: enables the web platform. If the fullstack platform is enabled, this will set the fullstack platform to client mode
packages/dx-wire-format/Cargo.toml
+1 -1
View File
@@ -7,7 +7,7 @@ authors = ["Jonathan Kelley"]
description = "Wire format for the Dioxus CLI"
license = "MIT OR Apache-2.0"
repository = "https://github.com/DioxusLabs/dioxus/"
homepage = "https://dioxuslabs.com/learn/0.5/"
homepage = "https://dioxuslabs.com/learn/0.6/"
keywords = ["dom", "ui", "gui", "react", "wasm"]
rust-version = "1.79.0"
packages/extension/README.md
+3 -3
View File
@@ -28,11 +28,11 @@ Formats the current file as RSX.
This overview provides a brief introduction to Dioxus. For a more in-depth guide, make sure to check out:
- [Getting Started](https://dioxuslabs.com/learn/0.5/getting_started)
- [Book (0.5)](https://dioxuslabs.com/learn/0.5)
- [Getting Started](https://dioxuslabs.com/learn/0.6/getting_started)
- [Book (0.6)](https://dioxuslabs.com/learn/0.6)
## Contributing
- Check out the website [section on contributing](https://dioxuslabs.com/learn/0.5/contributing).
- Check out the website [section on contributing](https://dioxuslabs.com/learn/0.6/contributing).
- Report issues on our [issue tracker](https://github.com/dioxuslabs/dioxus/issues).
- [Join](https://discord.gg/XgGxMSkvUM) the discord and ask questions!
packages/fullstack/Cargo.toml
+3 -3
View File
@@ -3,11 +3,11 @@ name = "dioxus-fullstack"
authors = ["Jonathan Kelley", "Evan Almloff"]
version = { workspace = true }
edition = "2021"
description = "Fullstack Dioxus Utilities"
description = "Fullstack utilities for Dioxus: Build fullstack web, desktop, and mobile apps with a single codebase."
license = "MIT OR Apache-2.0"
repository = "https://github.com/DioxusLabs/dioxus/"
homepage = "https://dioxuslabs.com"
keywords = ["ui", "gui", "react", "server", "fullstack"]
keywords = ["web", "desktop", "mobile", "gui", "server"]
resolver = "2"
[dependencies]
@@ -58,7 +58,7 @@ thiserror = { workspace = true, optional = true }
bytes = "1.4.0"
tower = { workspace = true, features = ["util"], optional = true }
tower-layer = { version = "0.3.2", optional = true }
parking_lot = { version = "0.12.1", features = ["send_guard"], optional = true }
parking_lot = { workspace = true, features = ["send_guard"], optional = true }
web-sys = { version = "0.3.61", optional = true, features = ["Window", "Document", "Element", "HtmlDocument", "Storage", "console"] }
dioxus-cli-config = { workspace = true, optional = true }
packages/fullstack/README.md
+2 -2
View File
@@ -15,7 +15,7 @@
[discord-url]: https://discord.gg/XgGxMSkvUM
[Website](https://dioxuslabs.com) |
[Guides](https://dioxuslabs.com/learn/0.5/) |
[Guides](https://dioxuslabs.com/learn/0.6/) |
[API Docs](https://docs.rs/dioxus-fullstack/latest/dioxus_fullstack/) |
[Chat](https://discord.gg/XgGxMSkvUM)
@@ -138,7 +138,7 @@ async fn get_meaning(of: String) -> Result<Option<u32>, ServerFnError> {
## Getting Started
To get started with full stack Dioxus, check out our [getting started guide](https://dioxuslabs.com/learn/0.5/getting_started), or the [full stack examples](https://github.com/DioxusLabs/dioxus/tree/master/examples).
To get started with full stack Dioxus, check out our [getting started guide](https://dioxuslabs.com/learn/0.6/getting_started), or the [full stack examples](https://github.com/DioxusLabs/dioxus/tree/master/examples).
## Contributing
packages/generational-box/Cargo.toml
+2 -2
View File
@@ -10,8 +10,8 @@ keywords = ["generational", "box", "memory", "allocator"]
# See more keys and their definitions at https://doc.rust-lang.org/cargo/reference/manifest.html
[dependencies]
parking_lot = "0.12.1"
tracing.workspace = true
parking_lot = { workspace = true }
tracing = { workspace = true }
[dev-dependencies]
rand = { workspace = true }
packages/hooks/README.md
+10 -10
View File
@@ -15,7 +15,7 @@
[discord-url]: https://discord.gg/XgGxMSkvUM
[Website](https://dioxuslabs.com) |
[Guides](https://dioxuslabs.com/learn/0.5/) |
[Guides](https://dioxuslabs.com/learn/0.6/) |
[API Docs](https://docs.rs/dioxus-hooks/latest/dioxus_hooks) |
[Chat](https://discord.gg/XgGxMSkvUM)
@@ -29,7 +29,7 @@
- use_memo
- use_coroutine
Unlike React, none of these hooks are foundational since they all build off the primitive `use_hook`. You can extend these hooks with [custom hooks](https://dioxuslabs.com/learn/0.5/cookbook/state/custom_hooks) in your own code. If you think they would be useful for the broader community, you can open a PR to add your hook to the [Dioxus Awesome](https://github.com/DioxusLabs/awesome-dioxus) list.
Unlike React, none of these hooks are foundational since they all build off the primitive `use_hook`. You can extend these hooks with [custom hooks](https://dioxuslabs.com/learn/0.6/cookbook/state/custom_hooks) in your own code. If you think they would be useful for the broader community, you can open a PR to add your hook to the [Dioxus Awesome](https://github.com/DioxusLabs/awesome-dioxus) list.
## State Cheat Sheet
@@ -41,9 +41,9 @@ Depending on where you need to access the state, you can put your state in one o
| Location | Where can you access the state? | Recommended for Libraries? | Examples |
| ---------------------------------------------------------------------------------------- | ------------------------------- | -------------------------- | --------------------------------------------------------------------------- |
| [Hooks](https://docs.rs/dioxus-hooks/latest/dioxus_hooks/fn.use_signal.html) | Any components you pass it to | ✅ | `use_signal(\|\| 0)`, `use_memo(\|\| state() * 2)` |
| [Context](https://docs.rs/dioxus-hooks/latest/dioxus_hooks/fn.use_context_provider.html) | Any child components | ✅ | `use_context_provider(\|\| Signal::new(0))`, `use_context::<Signal<i32>>()` |
| [Global](https://docs.rs/dioxus/latest/dioxus/prelude/struct.Signal.html#method.global) | Anything in your app | ❌ | `Signal::global(\|\| 0)` |
| [Hooks](https://docs.rs/dioxus-hooks/latest/dioxus_hooks/fn.use_signal.html) | Any components you pass it to | ✅ | `use_signal(\|\| 0)`, `use_memo(\|\| state() * 2)` |
| [Context](https://docs.rs/dioxus-hooks/latest/dioxus_hooks/fn.use_context_provider.html) | Any child components | ✅ | `use_context_provider(\|\| Signal::new(0))`, `use_context::<Signal<i32>>()` |
| [Global](https://docs.rs/dioxus/latest/dioxus/prelude/struct.Signal.html#method.global) | Anything in your app | ❌ | `Signal::global(\|\| 0)` |
### Derived State
@@ -51,9 +51,9 @@ If you don't have an initial value for your state, you can derive your state fro
| Hook | Reactive (reruns when dependencies change) | Async | Memorizes Output | Example |
| ----------------------------------------------------------------------------------- | ------------------------------------------ | ----- | ---------------- | ----------------------------------------------------------------------------------- |
| [`use_memo`](https://docs.rs/dioxus/latest/dioxus/prelude/fn.use_memo.html) | ✅ | ❌ | ✅ | `use_memo(move \|\| count() * 2)` |
| [`use_resource`](https://docs.rs/dioxus/latest/dioxus/prelude/fn.use_resource.html) | ✅ | ✅ | ❌ | `use_resource(move \|\| reqwest::get(format!("/users/{user_id}")))` |
| [`use_future`](https://docs.rs/dioxus/latest/dioxus/prelude/fn.use_future.html) | ❌ | ✅ | ❌ | `use_future(move \|\| println!("{:?}", reqwest::get(format!("/users/{user_id}"))))` |
| [`use_memo`](https://docs.rs/dioxus/latest/dioxus/prelude/fn.use_memo.html) | ✅ | ❌ | ✅ | `use_memo(move \|\| count() * 2)` |
| [`use_resource`](https://docs.rs/dioxus/latest/dioxus/prelude/fn.use_resource.html) | ✅ | ✅ | ❌ | `use_resource(move \|\| reqwest::get(format!("/users/{user_id}")))` |
| [`use_future`](https://docs.rs/dioxus/latest/dioxus/prelude/fn.use_future.html) | ❌ | ✅ | ❌ | `use_future(move \|\| println!("{:?}", reqwest::get(format!("/users/{user_id}"))))` |
### Persistent State
@@ -61,8 +61,8 @@ The core hooks library doesn't provide hooks for persistent state, but you can e
| State | Sharable | Example |
| ---------------------------------------------------------------------------------- | -------- | ------------------------------------------------------------------------------------------------- |
| [`use_persistent`](https://github.com/DioxusLabs/sdk/tree/master/examples/storage) | ❌ | `use_persistent("unique_key", move \|\| initial_state)` |
| [`Router<Route> {}`](https://dioxuslabs.com/learn/0.5/router) | ✅ | `#[derive(Routable, Clone, PartialEq)] enum Route { #[route("/user/:id")] Homepage { id: u32 } }` |
| [`use_persistent`](https://github.com/DioxusLabs/sdk/tree/master/examples/storage) | ❌ | `use_persistent("unique_key", move \|\| initial_state)` |
| [`Router<Route> {}`](https://dioxuslabs.com/learn/0.6/router) | ✅ | `#[derive(Routable, Clone, PartialEq)] enum Route { #[route("/user/:id")] Homepage { id: u32 } }` |
## Contributing
packages/hooks/docs/moving_state_around.md
+2 -2
View File
@@ -3,7 +3,7 @@
You will often need to move state around between your components. Dioxus provides three different ways to pass around state:
1. Just pass your values as [props](https://dioxuslabs.com/learn/0.5/reference/component_props):
1. Just pass your values as [props](https://dioxuslabs.com/learn/0.6/reference/component_props):
```rust
# use dioxus::prelude::*;
@@ -30,7 +30,7 @@ fn IncrementButton(mut count: Signal<i32>) -> Element {
This is the most common way to pass state around. It is the most explicit and local to your component. Use this when it isn't overly annoying to pass around a value.
2. Use [use_context](https://dioxuslabs.com/learn/0.5/reference/context) to pass state from a parent component to all children:
2. Use [use_context](https://dioxuslabs.com/learn/0.6/reference/context) to pass state from a parent component to all children:
```rust
# use dioxus::prelude::*;
packages/html/README.md
+1 -1
View File
@@ -15,7 +15,7 @@
[discord-url]: https://discord.gg/XgGxMSkvUM
[Website](https://dioxuslabs.com) |
[Guides](https://dioxuslabs.com/learn/0.5/) |
[Guides](https://dioxuslabs.com/learn/0.6/) |
[API Docs](https://docs.rs/dioxus-html/latest/dioxus_html) |
[Chat](https://discord.gg/XgGxMSkvUM)
packages/interpreter/README.md
+1 -1
View File
@@ -15,7 +15,7 @@
[discord-url]: https://discord.gg/XgGxMSkvUM
[Website](https://dioxuslabs.com) |
[Guides](https://dioxuslabs.com/learn/0.5/) |
[Guides](https://dioxuslabs.com/learn/0.6/) |
[API Docs](https://docs.rs/dioxus-interpreter-js/latest/dioxus_interpreter_js) |
[Chat](https://discord.gg/XgGxMSkvUM)
packages/liveview/Cargo.toml
+1 -1
View File
@@ -3,7 +3,7 @@ name = "dioxus-liveview"
version = { workspace = true }
edition = "2021"
repository = "https://github.com/DioxusLabs/dioxus/"
homepage = "https://dioxuslabs.com/learn/0.5/getting_started"
homepage = "https://dioxuslabs.com/learn/0.6/getting_started"
keywords = ["dom", "ui", "gui", "react", "liveview"]
description = "Build server-side apps with Dioxus"
authors = ["Jonathan Kelley", "Evan Almloff"]
packages/liveview/README.md
+1 -1
View File
@@ -15,7 +15,7 @@
[discord-url]: https://discord.gg/XgGxMSkvUM
[Website](https://dioxuslabs.com) |
[Guides](https://dioxuslabs.com/learn/0.5/) |
[Guides](https://dioxuslabs.com/learn/0.6/) |
[API Docs](https://docs.rs/dioxus-liveview/latest/dioxus_liveview) |
[Chat](https://discord.gg/XgGxMSkvUM)
packages/mobile/Cargo.toml
+1 -1
View File
@@ -5,7 +5,7 @@ authors = ["Jonathan Kelley"]
edition = "2021"
description = "Mobile-compatible renderer for Dioxus"
repository = "https://github.com/DioxusLabs/dioxus/"
homepage = "https://dioxuslabs.com/learn/0.5/getting_started"
homepage = "https://dioxuslabs.com/learn/0.6/getting_started"
keywords = ["dom", "ui", "gui", "react"]
license = "MIT OR Apache-2.0"
packages/mobile/README.md
+2 -2
View File
@@ -15,7 +15,7 @@
[discord-url]: https://discord.gg/XgGxMSkvUM
[Website](https://dioxuslabs.com) |
[Guides](https://dioxuslabs.com/learn/0.5/) |
[Guides](https://dioxuslabs.com/learn/0.6/) |
[API Docs](https://docs.rs/dioxus-mobile/latest/dioxus_mobile) |
[Chat](https://discord.gg/XgGxMSkvUM)
@@ -29,7 +29,7 @@ Dioxus Mobile supports both iOS and Android. However, Android support is still q
Getting set up with mobile can but quite challenging. The tooling here isn't great (yet) and might take some hacking around to get things working. macOS M1 is broadly unexplored and might not work for you.
You can read [our guide](https://dioxuslabs.com/learn/0.5/getting_started) on mobile development with Dioxus to get started.
You can read [our guide](https://dioxuslabs.com/learn/0.6/getting_started) on mobile development with Dioxus to get started.
## Contributing
packages/router/README.md
+1 -1
View File
@@ -15,7 +15,7 @@
[discord-url]: https://discord.gg/XgGxMSkvUM
[Website](https://dioxuslabs.com) |
[Guides](https://dioxuslabs.com/learn/0.5/router/) |
[Guides](https://dioxuslabs.com/learn/0.6/router/) |
[API Docs](https://docs.rs/dioxus-router/latest/dioxus_router) |
[Chat](https://discord.gg/XgGxMSkvUM)
packages/rsx-rosetta/README.md
+1 -1
View File
@@ -15,7 +15,7 @@
[discord-url]: https://discord.gg/XgGxMSkvUM
[Website](https://dioxuslabs.com) |
[Guides](https://dioxuslabs.com/learn/0.5/) |
[Guides](https://dioxuslabs.com/learn/0.6/) |
[API Docs](https://docs.rs/rsx-rosetta/latest/rsx-rosetta) |
[Chat](https://discord.gg/XgGxMSkvUM)
packages/rsx/README.md
+1 -1
View File
@@ -15,7 +15,7 @@
[discord-url]: https://discord.gg/XgGxMSkvUM
[Website](https://dioxuslabs.com) |
[Guides](https://dioxuslabs.com/learn/0.5/) |
[Guides](https://dioxuslabs.com/learn/0.6/) |
[API Docs](https://docs.rs/dioxus-rsx/latest/dioxus_rsx) |
[Chat](https://discord.gg/XgGxMSkvUM)
packages/signals/Cargo.toml
+3 -3
View File
@@ -3,7 +3,7 @@ name = "dioxus-signals"
authors = ["Jonathan Kelley", "Evan Almloff"]
version = { workspace = true }
edition = "2021"
description = "Signals for Dioxus"
description = "Reactivie signals for Dioxus: Build fullstack web, desktop, and mobile apps with a single codebase."
license = "MIT OR Apache-2.0"
repository = "https://github.com/DioxusLabs/dioxus/"
homepage = "https://dioxuslabs.com"
@@ -17,8 +17,8 @@ dioxus-core = { workspace = true }
generational-box = { workspace = true }
tracing = { workspace = true }
serde = { workspace = true, features = ["derive"], optional = true }
parking_lot = "0.12.1"
once_cell = { workspace = true }
parking_lot = { workspace = true}
once_cell = { workspace = true}
rustc-hash = { workspace = true }
futures-channel = { workspace = true }
futures-util = { workspace = true }
packages/signals/src/read_only_signal.rs
+3
View File
@@ -11,6 +11,9 @@ pub struct ReadOnlySignal<T: 'static, S: Storage<SignalData<T>> = UnsyncStorage>
inner: Signal<T, S>,
}
/// A signal that can only be read from.
pub type ReadSignal<T, S> = ReadOnlySignal<T, S>;
impl<T: 'static, S: Storage<SignalData<T>>> From<Signal<T, S>> for ReadOnlySignal<T, S> {
fn from(inner: Signal<T, S>) -> Self {
Self { inner }
packages/ssr/README.md
+2 -2
View File
@@ -9,8 +9,8 @@
This crate is a part of the broader Dioxus ecosystem. For more resources about Dioxus, check out:
- [Getting Started](https://dioxuslabs.com/learn/0.5/getting_started)
- [Book](https://dioxuslabs.com/learn/0.5/)
- [Getting Started](https://dioxuslabs.com/learn/0.6/getting_started)
- [Book](https://dioxuslabs.com/learn/0.6/)
- [Examples](https://github.com/DioxusLabs/dioxus/tree/main/examples)
## Overview
packages/web/Cargo.toml
+3 -3
View File
@@ -3,11 +3,11 @@ name = "dioxus-web"
version = { workspace = true }
authors = ["Jonathan Kelley"]
edition = "2021"
description = "Web renderer for Dioxus using websys"
description = "Web-sys renderer for Dioxus: Build fullstack web, desktop, and mobile apps with a single codebase."
license = "MIT OR Apache-2.0"
repository = "https://github.com/DioxusLabs/dioxus/"
homepage = "https://dioxuslabs.com/learn/0.5/getting_started"
keywords = ["dom", "ui", "gui", "react", "wasm"]
homepage = "https://dioxuslabs.com/learn/0.6/getting_started"
keywords = ["dom", "ui", "gui", "web", "wasm"]
[dependencies]
dioxus-core = { workspace = true }
packages/web/README.md
+1 -1
View File
@@ -15,7 +15,7 @@
[discord-url]: https://discord.gg/XgGxMSkvUM
[Website](https://dioxuslabs.com) |
[Guides](https://dioxuslabs.com/learn/0.5/) |
[Guides](https://dioxuslabs.com/learn/0.6/) |
[API Docs](https://docs.rs/dioxus-web/latest/dioxus_web) |
[Chat](https://discord.gg/XgGxMSkvUM)
translations/ja-jp/README.md
+1 -1
View File
@@ -40,7 +40,7 @@
<span> | </span>
<a href="https://github.com/DioxusLabs/example-projects"> 例 </a>
<span> | </span>
<a href="https://dioxuslabs.com/learn/0.5/"> ガイド </a>
<a href="https://dioxuslabs.com/learn/0.6/"> ガイド </a>
<span> | </span>
<a href="https://github.com/DioxusLabs/dioxus/blob/main/translations/zh-cn/README.md"> 中文 </a>
<span> | </span>
translations/ko-kr/README.md
+7 -7
View File
@@ -45,7 +45,7 @@
<span> | </span>
<a href="https://github.com/DioxusLabs/dioxus/tree/main/examples"> Examples </a>
<span> | </span>
<a href="https://dioxuslabs.com/learn/0.5/guide"> Guide </a>
<a href="https://dioxuslabs.com/learn/0.6/guide"> Guide </a>
<span> | </span>
<a href="https://github.com/DioxusLabs/dioxus/blob/main/translations/zh-cn/README.md"> 中文 </a>
<span> | </span>
@@ -81,7 +81,7 @@ fn app() -> Element {
- [인체공학적 상태 관리](https://dioxuslabs.com/blog/release-050)은 React, Solid, Svelte의 장점을 결합했습니다
- 극도로 높은 성능을 자랑하며 Rust의 가장 빠른 wasm 프레임워크 [sledgehammer](https://dioxuslabs.com/blog/templates-diffing)에 의해 구동됩니다
- 웹, macOS, Linux, Windows에 배포할 수 있는 통합 번들러
- 그 외에도 많은 기능! [Dioxus 투어를 살펴보세요](https://dioxuslabs.com/learn/0.5/).
- 그 외에도 많은 기능! [Dioxus 투어를 살펴보세요](https://dioxuslabs.com/learn/0.6/).
## 핫 리로딩
@@ -93,7 +93,7 @@ fn app() -> Element {
## 웹 및 데스크톱 배포를 위한 번들러
단순히 `dx bundle`을 실행하면 앱이 빌드되고 최적화된 번들로 패키징됩니다. 웹에서는 [`.avif` 생성, `.wasm` 압축, 최소화](https://dioxuslabs.com/learn/0.5/reference/assets) 등을 활용할 수 있습니다. [50kb 미만](https://github.com/ealmloff/tiny-dioxus/)의 웹앱과 15mb 미만의 데스크톱/모바일 앱을 빌드하세요.
단순히 `dx bundle`을 실행하면 앱이 빌드되고 최적화된 번들로 패키징됩니다. 웹에서는 [`.avif` 생성, `.wasm` 압축, 최소화](https://dioxuslabs.com/learn/0.6/guides/assets) 등을 활용할 수 있습니다. [50kb 미만](https://github.com/ealmloff/tiny-dioxus/)의 웹앱과 15mb 미만의 데스크톱/모바일 앱을 빌드하세요.
<div align="center">
<img src="../../notes/bundle.gif">
@@ -101,7 +101,7 @@ fn app() -> Element {
## 환상적인 문서
깨끗하고 읽기 쉽고 포괄적인 문서를 구축하는 데 많은 노력을 기울였습니다. 모든 HTML 요소와 리스너는 MDN 문서로 문서화되었으며, 저희 문서 사이트는 Dioxus 자체와 지속적인 통합을 실행하여 문서가 항상 최신 상태로 유지되도록 합니다. 가이드, 참조, 레시피 등을 보려면 [Dioxus 웹사이트](https://dioxuslabs.com/learn/0.5/)를 확인하세요. 재미있는 사실: 저희는 Dioxus 웹사이트를 새로운 Dioxus 기능의 테스트베드로 사용합니다 - [확인해보세요!](https://github.com/dioxusLabs/docsite)
깨끗하고 읽기 쉽고 포괄적인 문서를 구축하는 데 많은 노력을 기울였습니다. 모든 HTML 요소와 리스너는 MDN 문서로 문서화되었으며, 저희 문서 사이트는 Dioxus 자체와 지속적인 통합을 실행하여 문서가 항상 최신 상태로 유지되도록 합니다. 가이드, 참조, 레시피 등을 보려면 [Dioxus 웹사이트](https://dioxuslabs.com/learn/0.6/)를 확인하세요. 재미있는 사실: 저희는 Dioxus 웹사이트를 새로운 Dioxus 기능의 테스트베드로 사용합니다 - [확인해보세요!](https://github.com/dioxusLabs/docsite)
<div align="center">
<img src="../../notes/docs.avif">
@@ -109,7 +109,7 @@ fn app() -> Element {
## 개발자 경험에 중점
Dioxus는 개발자 경험을 우선시하며, end-to-end 도구 개발에 많은 노력을 기울였습니다. RSX 코드를 자동으로 포맷하고 HTML을 RSX로 변환하는 등 다양한 기능을 제공하는 [VSCode 확장 프로그램](https://marketplace.visualstudio.com/items?itemName=DioxusLabs.dioxus)을 제작했습니다. 또한 새로운 앱 생성, 서비스 실행, 크로스 플랫폼 번들링을 지원하는 매우 강력한 [CLI](https://dioxuslabs.com/learn/0.5/CLI)를 개발했으며, 배포는 향후 로드맵에 포함되어 있습니다.
Dioxus는 개발자 경험을 우선시하며, end-to-end 도구 개발에 많은 노력을 기울였습니다. RSX 코드를 자동으로 포맷하고 HTML을 RSX로 변환하는 등 다양한 기능을 제공하는 [VSCode 확장 프로그램](https://marketplace.visualstudio.com/items?itemName=DioxusLabs.dioxus)을 제작했습니다. 또한 새로운 앱 생성, 서비스 실행, 크로스 플랫폼 번들링을 지원하는 매우 강력한 [CLI](https://dioxuslabs.com/learn/0.6/CLI)를 개발했으며, 배포는 향후 로드맵에 포함되어 있습니다.
<div align="center">
<img src="../../notes/autofmt.gif">
@@ -223,7 +223,7 @@ Dioxus는 사이드 프로젝트에서 소수의 전임 엔지니어 팀으로
## 예제 실행하기
> 이 저장소의 메인 브랜치에 있는 예제들은 dioxus의 git 버전과 CLI를 대상으로 합니다. 최신 안정 버전의 dioxus와 호환되는 예제를 찾고 있다면 [0.5 브랜치](https://github.com/DioxusLabs/dioxus/tree/v0.5/examples)를 확인하세요.
> 이 저장소의 메인 브랜치에 있는 예제들은 dioxus의 git 버전과 CLI를 대상으로 합니다. 최신 안정 버전의 dioxus와 호환되는 예제를 찾고 있다면 [0.5 브랜치](https://github.com/DioxusLabs/dioxus/tree/v0.6/examples)를 확인하세요.
이 저장소 최상위에 있는 예제들은 다음과 같이 실행할 수 있습니다:
@@ -375,7 +375,7 @@ Dioxus와 Electron은 유사한 목표를 가진 완전히 다른 두 프로젝
## 기여하기
- 웹사이트의 [기여 섹션](https://dioxuslabs.com/learn/0.5/contributing)을 확인하세요.
- 웹사이트의 [기여 섹션](https://dioxuslabs.com/learn/0.6/contributing)을 확인하세요.
- [이슈 트래커](https://github.com/dioxuslabs/dioxus/issues)에 이슈를 보고하세요.
- [Discord](https://discord.gg/XgGxMSkvUM)에 참여하여 질문하세요!
translations/pt-br/README.md
+9 -9
View File
@@ -40,7 +40,7 @@
<span> | </span>
<a href="https://github.com/DioxusLabs/example-projects"> Exemplos </a>
<span> | </span>
<a href="https://dioxuslabs.com/learn/0.5"> Guia </a>
<a href="https://dioxuslabs.com/learn/0.6"> Guia </a>
<span> | </span>
<a href="https://github.com/DioxusLabs/dioxus/blob/main/translations/zh-cn/README.md"> 中文 </a>
<span> | </span>
@@ -85,18 +85,18 @@ Se você conhece React, então você já conhece o Dioxus.
<table style="width:100%" align="center">
<tr>
<th><a href="https://dioxuslabs.com/learn/0.5">Tutorial</a></th>
<th><a href="https://dioxuslabs.com/learn/0.5/reference/web">Web</a></th>
<th><a href="https://dioxuslabs.com/learn/0.5/reference/desktop">Desktop</a></th>
<th><a href="https://dioxuslabs.com/learn/0.5/reference/ssr">SSR</a></th>
<th><a href="https://dioxuslabs.com/learn/0.5/reference/mobile">Móvel</a></th>
<th><a href="https://dioxuslabs.com/learn/0.6">Tutorial</a></th>
<th><a href="https://dioxuslabs.com/learn/0.6/guides/web">Web</a></th>
<th><a href="https://dioxuslabs.com/learn/0.6/guides/desktop">Desktop</a></th>
<th><a href="https://dioxuslabs.com/learn/0.6/guides/ssr">SSR</a></th>
<th><a href="https://dioxuslabs.com/learn/0.6/guides/mobile">Móvel</a></th>
<tr>
</table>
## Projetos de Exemplo:
| Navegador de Arquivos (Desktop) | WiFi Scanner (Desktop) | TodoMVC (Todas as Plataformas) | E-commerce com Tailwind (SSR/LiveView) |
| ---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | -------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | ----------------------------------------------------------------------------------------------------------------------------------------------------------------------- | ---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
| Navegador de Arquivos (Desktop) | WiFi Scanner (Desktop) | TodoMVC (Todas as Plataformas) | E-commerce com Tailwind (SSR/LiveView) |
| ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------ | -------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | ----------------------------------------------------------------------------------------------------------------------------------------------------------------------- | ---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
| [![Explorador de Arquivos](https://github.com/DioxusLabs/example-projects/blob/master/file-explorer/assets/image.png)](https://github.com/DioxusLabs/example-projects/blob/master/file-explorer) | [![Wifi Scanner Demo](https://github.com/DioxusLabs/example-projects/raw/master/wifi-scanner/demo_small.png)](https://github.com/DioxusLabs/example-projects/blob/master/wifi-scanner) | [![TodoMVC example](https://github.com/DioxusLabs/example-projects/raw/master/todomvc/example.png)](https://github.com/DioxusLabs/example-projects/blob/master/todomvc) | [![Exemplo de E-commerce](https://github.com/DioxusLabs/example-projects/raw/master/ecommerce-site/demo.png)](https://github.com/DioxusLabs/example-projects/blob/master/ecommerce-site) |
Veja a página [awesome-dioxus](https://github.com/DioxusLabs/awesome-dioxus) para uma lista curada do conteúdo dentro do ecossistema do Dioxus.
@@ -161,7 +161,7 @@ Dioxus é único no ecossistema do Rust por suportar:
- SSR com `hydration` feito pelo Cliente
- Suporte à aplicação Desktop
Para mais informações sobre quais funções estão atualmente disponíveis e para o progresso futuro, veja [O Guia](https://dioxuslabs.com/learn/0.5).
Para mais informações sobre quais funções estão atualmente disponíveis e para o progresso futuro, veja [O Guia](https://dioxuslabs.com/learn/0.6).
## Projeto dentro do ecossistema Dioxus
translations/tr-tr/README.md
+6 -6
View File
@@ -45,7 +45,7 @@
<span> | </span>
<a href="https://github.com/DioxusLabs/example-projects"> Examples </a>
<span> | </span>
<a href="https://dioxuslabs.com/learn/0.5/guide"> Guide </a>
<a href="https://dioxuslabs.com/learn/0.6/guide"> Guide </a>
<span> | </span>
<a href="https://github.com/DioxusLabs/dioxus/blob/main/translations/zh-cn/README.md"> 中文 </a>
<span> | </span>
@@ -81,7 +81,7 @@ fn app() -> Element {
- [Ergonomik durum yönetimi](https://dioxuslabs.com/blog/release-050) React, Solid ve Svelte'nin en iyi özelliklerini birleştirdik.
- Rust'ın en en hızlı wasm(WebAssembly)-framework'ü (yazılım geliştirmek için kullanılan kütüphanelerin bir araya gelmesi ile oluşan yapılar) ile yüksek performans [sledgehammer](https://dioxuslabs.com/blog/templates-diffing).
- Web, macOS, Linux ve Windows üzerinde deploy (yayınlamak) için entegre paketleyici (burada belirtilen `dx bundle` bizim için işleri hallediyor).
- Ve daha fazlası! Gözat -> [Dioxus turu](https://dioxuslabs.com/learn/0.5/).
- Ve daha fazlası! Gözat -> [Dioxus turu](https://dioxuslabs.com/learn/0.6/).
## Anında hot-reloading
@@ -93,7 +93,7 @@ Tek bir `dx serve` komutu ile uygulamanı çalıştır. Markup ve styles(html ve
## Web ve Masaüstü için Paketleyici
Basitçe `dx bundle` komutunu çalıştır ve uygulaman maksimum optimizasyon ile derlenip paketlensin. Web üzerindeki [`.avif` oluşturma, `.wasm` sıkıştırma, küçültme](https://dioxuslabs.com/learn/0.5/reference/assets) ve daha fazlası ile avantajı yakala. [50kb'dan daha küçük](https://github.com/ealmloff/tiny-dioxus/) hafif web uygulamaları ve 15mb'dan daha az boyutlarda masaüstü/mobil uygulamalar üret.
Basitçe `dx bundle` komutunu çalıştır ve uygulaman maksimum optimizasyon ile derlenip paketlensin. Web üzerindeki [`.avif` oluşturma, `.wasm` sıkıştırma, küçültme](https://dioxuslabs.com/learn/0.6/guides/assets) ve daha fazlası ile avantajı yakala. [50kb'dan daha küçük](https://github.com/ealmloff/tiny-dioxus/) hafif web uygulamaları ve 15mb'dan daha az boyutlarda masaüstü/mobil uygulamalar üret.
<div align="center">
<img src="../../notes/bundle.gif">
@@ -101,7 +101,7 @@ Basitçe `dx bundle` komutunu çalıştır ve uygulaman maksimum optimizasyon il
## Fantastik Dökümantasyon
Temiz, okunabilir ve kapsayıcı döküman için bir ton uğraştık. Bütün html elementleri ve listeners(takipçiler) MDN (geliştiriciler için dökümantasyon detay için [tıkla](https://developer.mozilla.org)) ile dökümente edildi, ve güncelliğinden emin olmak için docsite(dökümanlar) Dioxus'un kendisi ile sürekli entegrasyon halinde. Rehbeler, referanslar, tarifler, ve daha fazlası için göz at [Dioxus websitesi](https://dioxuslabs.com/learn/0.5/). İlginç gerçek: Dioxus'un sitesini yeni özelliklerimizi test etmek için deneme tahtası olarak kullanıyoruz -> [Göz at!](https://github.com/dioxusLabs/docsite)
Temiz, okunabilir ve kapsayıcı döküman için bir ton uğraştık. Bütün html elementleri ve listeners(takipçiler) MDN (geliştiriciler için dökümantasyon detay için [tıkla](https://developer.mozilla.org)) ile dökümente edildi, ve güncelliğinden emin olmak için docsite(dökümanlar) Dioxus'un kendisi ile sürekli entegrasyon halinde. Rehbeler, referanslar, tarifler, ve daha fazlası için göz at [Dioxus websitesi](https://dioxuslabs.com/learn/0.6/). İlginç gerçek: Dioxus'un sitesini yeni özelliklerimizi test etmek için deneme tahtası olarak kullanıyoruz -> [Göz at!](https://github.com/dioxusLabs/docsite)
<div align="center">
<img src="../../notes/docs.avif">
@@ -109,7 +109,7 @@ Temiz, okunabilir ve kapsayıcı döküman için bir ton uğraştık. Bütün ht
## Geliştirici Deneyimini Önemse
Dioxus geliştirici deneyimini önceliklendirir, bu kapsamda end-to-end tooling (uçtan uca araç desteği) için tonla efor harcadık. [VSCode eklentisi](https://marketplace.visualstudio.com/items?itemName=DioxusLabs.dioxus) geliştirdik bu sayede RSX kodlarınızı otomatik formatlayabilir, HTML', RSX e çevirebilir ve daha fazlasını yapabilirsiniz. Aynı zamanda geliştirdiğimiz çok güçlü [CLI](https://dioxuslabs.com/learn/0.5/CLI) sayesinde yeni uygulamalar üretmenize yardım ediyor, onları serve (sunmanızı) ve çapraz platform çalışacak şekilde paketlemenizi sağlıyoruz. Yol haritamızda deployment da mevcut.
Dioxus geliştirici deneyimini önceliklendirir, bu kapsamda end-to-end tooling (uçtan uca araç desteği) için tonla efor harcadık. [VSCode eklentisi](https://marketplace.visualstudio.com/items?itemName=DioxusLabs.dioxus) geliştirdik bu sayede RSX kodlarınızı otomatik formatlayabilir, HTML', RSX e çevirebilir ve daha fazlasını yapabilirsiniz. Aynı zamanda geliştirdiğimiz çok güçlü [CLI](https://dioxuslabs.com/learn/0.6/CLI) sayesinde yeni uygulamalar üretmenize yardım ediyor, onları serve (sunmanızı) ve çapraz platform çalışacak şekilde paketlemenizi sağlıyoruz. Yol haritamızda deployment da mevcut.
<div align="center">
<img src="../../notes/autofmt.gif">
@@ -391,7 +391,7 @@ Dioxus ve Electron benzer amaçlara sahip tamamıyla farklı iki projedir. Elect
## Katkı Sağlama
- [Katkı sağlamayla alakalı kısım](https://dioxuslabs.com/learn/0.5/contributing) için web sitemizi ziyaret edin.
- [Katkı sağlamayla alakalı kısım](https://dioxuslabs.com/learn/0.6/contributing) için web sitemizi ziyaret edin.
- [Issue tracker(sorun takipçisi)](https://github.com/dioxuslabs/dioxus/issues) üzerinden sorunlarınızı raporlayabilirsiniz.
- Discord'a [katıl](https://discord.gg/XgGxMSkvUM) ve sorularını sor!
translations/zh-cn/README.md
+6 -6
View File
@@ -45,7 +45,7 @@
<span> | </span>
<a href="https://github.com/DioxusLabs/example-projects"> 示例 </a>
<span> | </span>
<a href="https://dioxuslabs.com/learn/0.5/guide"> 指南 </a>
<a href="https://dioxuslabs.com/learn/0.6/guide"> 指南 </a>
<span> | </span>
<a href="https://github.com/DioxusLabs/dioxus/blob/main/README.md"> English </a>
<span> | </span>
@@ -79,7 +79,7 @@ fn app() -> Element {
- [人体工程学的状态管理](https://dioxuslabs.com/blog/release-050)，结合了 React、Solid 和 Svelte 的优点
- 非常高效，由 Rust 最快的 wasm 框架 [sledgehammer](https://dioxuslabs.com/blog/templates-diffing) 提供支持
- 集成的捆绑包，可部署到 Web、macOS、Linux 和 Windows
- 还有更多！阅读 [Dioxus 漫游之旅](https://dioxuslabs.com/learn/0.5/)。
- 还有更多！阅读 [Dioxus 漫游之旅](https://dioxuslabs.com/learn/0.6/)。
## 瞬时热重载
@@ -91,7 +91,7 @@ fn app() -> Element {
## 用于 Web 和桌面部署的捆绑包
只需运行 `dx bundle`，您的应用程序将被构建和捆绑，并进行最大化的优化。在 Web 上，利用 [`.avif` 生成，`.wasm` 压缩，代码缩小](https://dioxuslabs.com/learn/0.5/reference/assets)，等等。构建的 Web 应用程序大小 [不到 50kb](https://github.com/ealmloff/tiny-dioxus/)，桌面/移动应用程序小于 15mb。
只需运行 `dx bundle`，您的应用程序将被构建和捆绑，并进行最大化的优化。在 Web 上，利用 [`.avif` 生成，`.wasm` 压缩，代码缩小](https://dioxuslabs.com/learn/0.6/guides/assets)，等等。构建的 Web 应用程序大小 [不到 50kb](https://github.com/ealmloff/tiny-dioxus/)，桌面/移动应用程序小于 15mb。
<div align="center">
<img src="../../notes/bundle.gif">
@@ -99,7 +99,7 @@ fn app() -> Element {
## 出色的文档
我们花费了大量精力构建清晰、易读和全面的文档。所有 HTML 元素和监听器都使用 MDN 文档进行了记录，并且我们的文档站点通过 Dioxus 本身进行持续集成，以确保文档始终保持最新。查看 [Dioxus 网站](https://dioxuslabs.com/learn/0.5/) 获取指南、参考资料、示例和更多信息。有趣的事实：我们将 Dioxus 网站用作新特性的测试平台 - [来看看吧！](https://github.com/dioxusLabs/docsite)
我们花费了大量精力构建清晰、易读和全面的文档。所有 HTML 元素和监听器都使用 MDN 文档进行了记录，并且我们的文档站点通过 Dioxus 本身进行持续集成，以确保文档始终保持最新。查看 [Dioxus 网站](https://dioxuslabs.com/learn/0.6/) 获取指南、参考资料、示例和更多信息。有趣的事实：我们将 Dioxus 网站用作新特性的测试平台 - [来看看吧！](https://github.com/dioxusLabs/docsite)
<div align="center">
<img src="../../notes/docs.avif">
@@ -107,7 +107,7 @@ fn app() -> Element {
## 开发者体验的重点
Dioxus 优先考虑开发者体验，我们为端到端工具链付出了大量努力。我们构建了一个 [VSCode 扩展](https://marketplace.visualstudio.com/items?itemName=DioxusLabs.dioxus)，可以自动格式化您的 RSX 代码，将 HTML 转换为 RSX 等等。我们还建立了一个非常强大的 [CLI](https://dioxuslabs.com/learn/0.5/CLI)，支持创建新应用程序、提供服务和跨平台捆绑，并且部署正在路上。
Dioxus 优先考虑开发者体验，我们为端到端工具链付出了大量努力。我们构建了一个 [VSCode 扩展](https://marketplace.visualstudio.com/items?itemName=DioxusLabs.dioxus)，可以自动格式化您的 RSX 代码，将 HTML 转换为 RSX 等等。我们还建立了一个非常强大的 [CLI](https://dioxuslabs.com/learn/0.6/CLI)，支持创建新应用程序、提供服务和跨平台捆绑，并且部署正在路上。
<div align="center">
<img src="./notes/autofmt.gif">
@@ -342,7 +342,7 @@ Dioxus 和 Electron 是两个完全不同的项目，目标相似。Electron 使
## 贡献
- 查看网站上有关[贡献的部分](https://dioxuslabs.com/learn/0.5/contributing)。
- 查看网站上有关[贡献的部分](https://dioxuslabs.com/learn/0.6/contributing)。
- 在我们的 [问题跟踪器](https://github.com/dioxuslabs/dioxus/issues) 上报告问题。
- [加入](https://discord.gg/XgGxMSkvUM) discord 并提出问题！