From 59829acabd0f69572611986fcae9feda711a642e Mon Sep 17 00:00:00 2001 From: PoojaB26 Date: Fri, 22 Aug 2025 17:43:26 +0530 Subject: [PATCH 1/2] Add workspace folder + modifier info --- .idea/modules.xml | 2 +- docs/workspace/agent-panel.md | 8 +++ docs/workspace/content-panel.md | 8 +++ docs/workspace/keyboard-shortcuts.md | 8 +++ docs/workspace/modules-panel/_category_.json | 4 ++ docs/workspace/modules-panel/theme.md | 10 ++++ docs/workspace/modules-panel/widget-panel.md | 10 ++++ docs/workspace/properties-panel.md | 54 ++++++++++++++++++++ docs/workspace/workspace.md | 10 ++++ sidebars.ts | 18 ++++++- 10 files changed, 130 insertions(+), 2 deletions(-) create mode 100644 docs/workspace/agent-panel.md create mode 100644 docs/workspace/content-panel.md create mode 100644 docs/workspace/keyboard-shortcuts.md create mode 100644 docs/workspace/modules-panel/_category_.json create mode 100644 docs/workspace/modules-panel/theme.md create mode 100644 docs/workspace/modules-panel/widget-panel.md create mode 100644 docs/workspace/properties-panel.md create mode 100644 docs/workspace/workspace.md diff --git a/.idea/modules.xml b/.idea/modules.xml index 29e3e19..52bca43 100644 --- a/.idea/modules.xml +++ b/.idea/modules.xml @@ -2,7 +2,7 @@ - + \ No newline at end of file diff --git a/docs/workspace/agent-panel.md b/docs/workspace/agent-panel.md new file mode 100644 index 0000000..50abd1e --- /dev/null +++ b/docs/workspace/agent-panel.md @@ -0,0 +1,8 @@ +--- +slug: /workspace/agent-panel +title: Agent Panel +# description: +# tags: +sidebar_position: 5 +# keywords: +--- \ No newline at end of file diff --git a/docs/workspace/content-panel.md b/docs/workspace/content-panel.md new file mode 100644 index 0000000..77fcd78 --- /dev/null +++ b/docs/workspace/content-panel.md @@ -0,0 +1,8 @@ +--- +slug: /workspace/content-panel +title: Content Panel +# description: +# tags: +sidebar_position: 3 +# keywords: +--- \ No newline at end of file diff --git a/docs/workspace/keyboard-shortcuts.md b/docs/workspace/keyboard-shortcuts.md new file mode 100644 index 0000000..fcd215e --- /dev/null +++ b/docs/workspace/keyboard-shortcuts.md @@ -0,0 +1,8 @@ +--- +slug: /workspace/keyboard-shortcuts +title: Keyboard Shortcuts +# description: +# tags: +sidebar_position: 6 +# keywords: +--- \ No newline at end of file diff --git a/docs/workspace/modules-panel/_category_.json b/docs/workspace/modules-panel/_category_.json new file mode 100644 index 0000000..53c4c51 --- /dev/null +++ b/docs/workspace/modules-panel/_category_.json @@ -0,0 +1,4 @@ +{ + "label": "Modules Panel", + "position": 1 + } \ No newline at end of file diff --git a/docs/workspace/modules-panel/theme.md b/docs/workspace/modules-panel/theme.md new file mode 100644 index 0000000..ec78cbf --- /dev/null +++ b/docs/workspace/modules-panel/theme.md @@ -0,0 +1,10 @@ +--- +slug: /workspace/theme +title: Theme +# description: +# tags: +sidebar_position: 2 +# keywords: +--- + +# Theme \ No newline at end of file diff --git a/docs/workspace/modules-panel/widget-panel.md b/docs/workspace/modules-panel/widget-panel.md new file mode 100644 index 0000000..7b57374 --- /dev/null +++ b/docs/workspace/modules-panel/widget-panel.md @@ -0,0 +1,10 @@ +--- +slug: /workspace/widget-panel +title: Widget Panel +# description: +# tags: +sidebar_position: 1 +# keywords: +--- + +# Widget Tree \ No newline at end of file diff --git a/docs/workspace/properties-panel.md b/docs/workspace/properties-panel.md new file mode 100644 index 0000000..f8a9a38 --- /dev/null +++ b/docs/workspace/properties-panel.md @@ -0,0 +1,54 @@ +--- +slug: /workspace/properties-panel +title: Properties Panel +# description: +# tags: +sidebar_position: 4 +# keywords: +--- + +# Properties Panel + +Properties Panel is.. + + + +## Modifiers + + +Modifiers refer to wrapper widgets that can be added around existing Flutter widgets to modify their behavior, appearance, or layout. Think of them as "decorators" or "containers" that wrap around your base widgets. They are Flutter widgets that wrap around other widgets to modify their: +- **Layout behavior** (positioning, sizing, constraints) +- **Visual appearance** (colors, borders, shadows, opacity) +- **Interactive behavior** (gestures, focus, accessibility) +- **Animation properties** (transitions, transformations) + + +### Common Modifier Types + +**Layout Modifiers** +- **Spacing**: Add padding, margins, or gaps +- **Positioning**: Control alignment, expansion, or positioning +- **Constraints**: Modify size constraints and boundaries +- **Flexibility**: Control how widgets grow and shrink + +**Visual Modifiers** +- **Styling**: Apply colors, borders, and backgrounds +- **Effects**: Add shadows, opacity, or transformations +- **Clipping**: Control how content is displayed +- **Decoration**: Apply complex visual treatments + +**Behavioral Modifiers** +- **Interaction**: Add gesture detection and touch handling +- **Focus**: Manage keyboard navigation and focus states +- **Accessibility**: Improve screen reader support +- **Semantics**: Add meaning for assistive technologies + +**Animation Modifiers** +- **Transitions**: Smooth changes between states +- **Transformations**: Rotate, scale, or translate widgets +- **Timing**: Control animation duration and curves +- **State Changes**: Animate opacity, size, or position + +### Adding a Modifier + + diff --git a/docs/workspace/workspace.md b/docs/workspace/workspace.md new file mode 100644 index 0000000..9c7df49 --- /dev/null +++ b/docs/workspace/workspace.md @@ -0,0 +1,10 @@ +--- +slug: /workspace +title: Workspace +# description: +# tags: +sidebar_position: 0 +# keywords: +--- + +# Workspace \ No newline at end of file diff --git a/sidebars.ts b/sidebars.ts index 6bf2a7a..b532603 100644 --- a/sidebars.ts +++ b/sidebars.ts @@ -3,8 +3,24 @@ import type {SidebarsConfig} from '@docusaurus/plugin-content-docs'; const sidebars: SidebarsConfig = { docsSidebar: [ - { type: 'autogenerated', dirName: '.' } + { + type: 'doc', + id: 'index', + label: 'Getting Started', + }, + { + type: 'category', + label: 'Workspace', + collapsed: false, + items: [ + { + type: 'autogenerated', + dirName: 'workspace' + } + ], + } ] + }; export default sidebars; From 2430754d9081d4a07b1281da46fa305bdab349e1 Mon Sep 17 00:00:00 2001 From: PoojaB26 Date: Tue, 26 Aug 2025 20:09:15 +0530 Subject: [PATCH 2/2] add AI prompt quickstart --- docs/get-started/quickstart.md | 87 ++++++++++++++++++++++++++++++++++ docs/get-started/welcome.md | 40 ++++++++++++++++ sidebars.ts | 11 +++++ src/css/custom.css | 17 ++++++- 4 files changed, 153 insertions(+), 2 deletions(-) create mode 100644 docs/get-started/quickstart.md create mode 100644 docs/get-started/welcome.md diff --git a/docs/get-started/quickstart.md b/docs/get-started/quickstart.md new file mode 100644 index 0000000..570a7d6 --- /dev/null +++ b/docs/get-started/quickstart.md @@ -0,0 +1,87 @@ + +# Quickstart + +## Start With a Prompt (4 mins) + +Dreamflow's AI-powered app generation allows you to create complete, functional applications from simple text or image descriptions. Simply describe what you want to build, and Dreamflow Agent will generate the entire app structure, UI components, and functionality for you. + +Ready to create your app? Simply: + +1. Open Dreamflow and click the textbox that says "Start with a prompt..." +2. Enter your app description and wait for the Agent to generate your complete app. +3. Review and customize the generated project in the [workspace](#) + + +The Agent will create all the necessary screens, components, and functionality based on your description, giving you a fully functional app that you can further customize and deploy. + + +
+ +
+ +Here are some prompts that we've used recently while chatting with the agent. + +**A habit tracker** + +**Prompt** + + Build the main screen for a habit tracking app. Prepopulate with common habits, and then show the tasks for today on this main screen. Make the app look modern and whimsical. + + +**Duration / Cost**: 161 seconds / 2.51 credits + +**Next steps** + - Let the user enter their own habits + - Give the user reminders for their habits, even when the app is not running. + - Allow the user to share their habit progress with others (through the share sheet of the mobile OS) + + +**Asteroids game** + +**Prompt** + +Replace the main screen with an implementation of the classic game of Asteroids. Make this look and work the same as the original arcade game. Make sure that it has keyboard controls, mouse controls, and touch controls. Store the high-score locally. + +**Duration / Cost** : 183 seconds / 2.30 credits + +**Next steps** + - Give the game a start screen (with instructions) + - Give the game an end screen (with a leaderboard) + - Store a leaderboard of highscores on a server + + + +**Chat app** + +**Prompt** + +Build a small chat app (store the data locally for now) where users can chat with their friends. Make the app look modern and familiar, but also give it some unique twists. + +**Duration / Cost** : 313 seconds / 4.42 credits + +**Next steps** + - Make the chats clustered when folks are close to each other + - Store the chat data in a cloud database + - Show a notification when a message arrives when the app is not active diff --git a/docs/get-started/welcome.md b/docs/get-started/welcome.md new file mode 100644 index 0000000..9d800a3 --- /dev/null +++ b/docs/get-started/welcome.md @@ -0,0 +1,40 @@ + + +# Welcome + +Dreamflow is ... + + +## Create Account + + +create an account... + + +## Build First Project + +
+ +
diff --git a/sidebars.ts b/sidebars.ts index b532603..8e655a0 100644 --- a/sidebars.ts +++ b/sidebars.ts @@ -6,7 +6,18 @@ const sidebars: SidebarsConfig = { { type: 'doc', id: 'index', + label: 'Index', + }, + { + type: 'category', label: 'Getting Started', + collapsed: false, + items: [ + { + type: 'autogenerated', + dirName: 'get-started' + } + ], }, { type: 'category', diff --git a/src/css/custom.css b/src/css/custom.css index d0ac69d..d439785 100644 --- a/src/css/custom.css +++ b/src/css/custom.css @@ -40,9 +40,12 @@ /* Direct body text styling that will override Docusaurus */ body { - color: #d7d7d7 !important; + color: var(--ifm-text-secondary-color) !important; + font-size: 14px !important; /* Set body text size */ } + + /* Light mode body text */ [data-theme='light'] body { color: #333333 !important; /* Dark text for light mode */ @@ -103,11 +106,21 @@ html[data-theme='dark'] { } h1 { - font-size: 2.5rem !important; /* Adjust this value as needed */ + font-size: 2.2rem !important; /* Adjust this value as needed */ font-weight: 700; line-height: 1.2; } +h2 { + font-size: 1.8rem !important; /* Adjust this value as needed */ +} + +h3 { + font-size: 1.4rem !important; /* Adjust this value as needed */ +} + + + [data-theme='dark'] { --primary-text: var(--white); --ifm-color-primary: #7e71f4; /* Primary brand color */