Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Improve sidebar titles #312

Merged
merged 6 commits into from
Oct 8, 2024
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
2 changes: 1 addition & 1 deletion docs/api.md
Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@
---
id: api
title: Api
title: API
sidebar_position: 5
---

Expand Down
5 changes: 3 additions & 2 deletions docs/design-system.md
Original file line number Diff line number Diff line change
Expand Up @@ -6,7 +6,7 @@ sidebar_position: 4

# Design System

The **DHIS2 Mobile UI Library** is built upon the [DHIS2 Mobile Design System Figma library](https://www.figma.com/file/eRk6bt0B8BJlTO9PZXirHN/DHIS2-Mobile-Design-System). This design system offers a comprehensive set of guidelines, components, and best practices to ensure consistency and enhance user experience across all DHIS2 mobile applications.
The **DHIS2 Mobile UI Library** is built upon the [DHIS2 Mobile Design System Figma library](https://www.figma.com/community/file/1423970586603523207/dhis2-mobile-design-system). This design system offers a comprehensive set of guidelines, components, and best practices to ensure consistency and enhance user experience across all DHIS2 mobile applications.

![](resources/design-system.png)

Expand Down Expand Up @@ -52,7 +52,8 @@ The design system encompasses a wide array of elements that contribute to a cohe

To incorporate the DHIS2 Mobile Design System into your project:

1. **Explore the Figma Library**: Familiarize yourself with the available components and styles by accessing the [Figma library](https://www.figma.com/file/eRk6bt0B8BJlTO9PZXirHN/DHIS2-Mobile-Design-System).
1. **Explore the Figma Library**: Familiarize yourself with the available components and styles by accessing the [Figma library](https://www.figma.com/community/file/1423970586603523207/dhis2-mobile-design-system).
2. **Use the Figma Library for Mock-ups and Prototypes**: Before starting development, you can utilize the Figma library to create mock-ups and prototypes. This allows you to visualize the app's design and functionality, facilitating better planning and collaboration among team members.
2. **Follow the Guidelines**: Apply the design principles and component guidelines to ensure a consistent and user-friendly interface.
3. **Maintain Accessibility**: Ensure all design elements meet accessibility standards for color contrast, font sizes, and interactive elements.
4. **Collaborate and Contribute**: Share feedback, suggest improvements, or contribute new components to help evolve the design system.
Expand Down
9 changes: 7 additions & 2 deletions docs/overview.md
Original file line number Diff line number Diff line change
Expand Up @@ -18,10 +18,15 @@ This library currently supports **desktop** and **Android** targets, in the next
support **iOS**.

### Android

**DHIS2 Mobile UI library** provides native support for Android. When targeting Android, you can
leverage the full power of Jetpack Compose, Google's modern UI toolkit for Android. The Compose
Multiplatform library seamlessly integrates with Android Studio and the Android build system.
Multiplatform library seamlessly integrates with Android Studio and the Android build system.
However, if your project uses Java and XML layouts, you can still integrate the library by embedding Compose
components within your existing views.

#### Using with Java and XML

If your project uses Java and XML layouts, you can still integrate the library by embedding Compose components within your existing views. For guidance on interoperability between XML and Compose, refer to the [Android Developers Interoperability Guide](https://developer.android.com/develop/ui/compose/migrate/interoperability-apis).

### Desktop

Expand Down
22 changes: 11 additions & 11 deletions docs/demo.md → docs/showcase-application.md
Original file line number Diff line number Diff line change
@@ -1,18 +1,18 @@
---
id: demo
title: Demo
id: showcase-application
title: Showcase application
sidebar_position: 3
---

# Demo Application
# Showcase Application

The Mobile UI library includes a **demo application** that showcases all the components available in the library. This application allows you to see the components in action and understand how they can be integrated into your projects.
The Mobile UI library includes an application that showcases all the components available in the library. This application allows you to see the components in action and understand how they can be integrated into your projects.

![](resources/showcase.png)

## Downloading the Demo Application
## Downloading the Showcase Application

Each release of the Mobile UI library provides artifacts for various targets, including Android and desktop platforms. You can download the demo application from the **Assets** section at the bottom of each [release page](https://github.com/dhis2/dhis2-mobile-ui/releases) on GitHub.
Each release of the Mobile UI library provides artifacts for various targets, including Android and desktop platforms. You can download the Showcase application from the **Assets** section at the bottom of each [release page](https://github.com/dhis2/dhis2-mobile-ui/releases) on GitHub.

### Steps to Download:

Expand All @@ -25,7 +25,7 @@ Each release of the Mobile UI library provides artifacts for various targets, in

![](resources/assets.png)

## Installing the Demo Application
## Installing the Showcase Application

### On Android:

Expand All @@ -41,7 +41,7 @@ Each release of the Mobile UI library provides artifacts for various targets, in

1. **Ensure Java is Installed**:

- The demo application requires the Java Runtime Environment (JRE) to run.
- The Showcase application requires the Java Runtime Environment (JRE) to run.
- Download and install Java from the [official website](https://www.java.com/en/download/) if you haven't already.

2. **Extract the ZIP File**:
Expand All @@ -59,13 +59,13 @@ Each release of the Mobile UI library provides artifacts for various targets, in
- Navigate to the directory containing the `.jar` file.
- Run the command:
```
java -jar your-demo-application.jar
java -jar your-showcase-application.jar
```

**Note**: If double-clicking the `.jar` file doesn't work, ensure that the file association for `.jar` files is correctly set to the Java Runtime Environment.

## Using the Demo Application
## Using the Showcase Application

1. **Launch the App**: Open the demo application on your device.
1. **Launch the App**: Open the Showcase application on your device.
2. **Explore Components**: Browse through the various components showcased in the app.
3. **Interactive Examples**: Interact with the components to see how they behave and respond.
Loading