Skip to content
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
48 changes: 32 additions & 16 deletions docs/devices/mobile.mdx
Original file line number Diff line number Diff line change
Expand Up @@ -8,10 +8,6 @@ The Plane mobile app is available on Android and iOS devices.

With the mobile app, you can easily manage your projects on the go. Whether you're creating, assigning, or tracking issues, stay connected with your team and keep work moving forward no matter where you are. Download the app to experience project management at your fingertips!

:::info
The mobile app is currently available for cloud users but will be coming soon for self-hosted users on all plans of the Commercial edition.
:::

## System requirements
| OS | Version |
| -------- | -----------------------------------------------|
Expand All @@ -25,6 +21,26 @@ Head over to [Download](https://plane.so/download) to install the app for Androi
Sign-up isn't available through the mobile app. To use the app, you'll need to be a member of at least one workspace.
:::


## Sign in

The app is available on Cloud and for self-hosted instances on all plans of the Commercial Edition starting from version `v1.5.0`. Here’s how you can get started:

- **For cloud users**
Tap **Cloud sign in** and enter your credentials to log in.

- **For self-Hosted users**
Tap **Self hosted sign in**, then enter your Plane app URL. Once that’s done, log in with your credentials to access your workspace.

<div class="mobile-img-container">
<div class="box">
<img src="https://media.docs.plane.so/mobile/mobile-self-hosted.png" alt="Home" width="320"/>
</div>
<div class="box">
<img src="https://media.docs.plane.so/mobile/plane-app-url.png" alt="Projects" width="320"/>
</div>
</div>

## Navigate the app
The navigation bar at the bottom of your screen helps you quickly access key areas of the app.

Expand All @@ -36,10 +52,10 @@ This screen shows all the projects you have access to, along with your role and

<div class="mobile-img-container">
<div class="box">
<img src="https://media.docs.plane.so/mobile/app-home.webp" alt="Home" width="300"/>
<img src="https://media.docs.plane.so/mobile/app-home.webp" alt="Home" width="320"/>
</div>
<div class="box">
<img src="https://media.docs.plane.so/mobile/app-projects.webp" alt="Projects" width="300"/>
<img src="https://media.docs.plane.so/mobile/app-projects.webp" alt="Projects" width="320"/>
</div>
</div>

Expand All @@ -57,10 +73,10 @@ Need to create a new project, issue, or page? Tap the + Create button.

<div class="mobile-img-container">
<div class="box">
<img src="https://media.docs.plane.so/mobile/app-create-project.webp" alt="Create project" width="300"/>
<img src="https://media.docs.plane.so/mobile/app-create-project.webp" alt="Create project" width="320"/>
</div>
<div class="box">
<img src="https://media.docs.plane.so/mobile/app-create-page.webp" alt="Create page" width="300"/>
<img src="https://media.docs.plane.so/mobile/app-create-page.webp" alt="Create page" width="320"/>
</div>
</div>

Expand All @@ -72,10 +88,10 @@ Need to create a new project, issue, or page? Tap the + Create button.

<div class="mobile-img-container">
<div class="box">
<img src="https://media.docs.plane.so/mobile/app-create-issue.webp" alt="Create issue" width="300"/>
<img src="https://media.docs.plane.so/mobile/app-create-issue.webp" alt="Create issue" width="320"/>
</div>
<div class="box">
<img src="https://media.docs.plane.so/mobile/app-issue-properties.webp" alt="Issue properties" width="300"/>
<img src="https://media.docs.plane.so/mobile/app-issue-properties.webp" alt="Issue properties" width="320"/>
</div>
</div>

Expand All @@ -87,10 +103,10 @@ View your profile and manage your account here. You can also switch between work

<div class="mobile-img-container">
<div class="box">
<img src="https://media.docs.plane.so/mobile/app-inbox.webp" alt="Inbox" width="300"/>
<img src="https://media.docs.plane.so/mobile/app-inbox.webp" alt="Inbox" width="320"/>
</div>
<div class="box">
<img src="https://media.docs.plane.so/mobile/app-profile.webp" alt="Profile" width="300"/>
<img src="https://media.docs.plane.so/mobile/app-profile.webp" alt="Profile" width="320"/>
</div>
</div>

Expand Down Expand Up @@ -121,10 +137,10 @@ View a list of all, active and backlog issues.

<div class="mobile-img-container">
<div class="box">
<img src="https://media.docs.plane.so/mobile/app-issues.webp" alt="Issues" width="300"/>
<img src="https://media.docs.plane.so/mobile/app-issues.webp" alt="Issues" width="320"/>
</div>
<div class="box">
<img src="https://media.docs.plane.so/mobile/app-issue-details.webp" alt="Issue details" width="300"/>
<img src="https://media.docs.plane.so/mobile/app-issue-details.webp" alt="Issue details" width="320"/>
</div>
</div>
<br/>
Expand All @@ -147,10 +163,10 @@ View a list of all, active and backlog issues.

<div class="mobile-img-container">
<div class="box">
<img src="https://media.docs.plane.so/mobile/app-cycles.webp" alt="Cycles" width="300"/>
<img src="https://media.docs.plane.so/mobile/app-cycles.webp" alt="Cycles" width="320"/>
</div>
<div class="box">
<img src="https://media.docs.plane.so/mobile/app-modules.webp" alt="Modules" width="300"/>
<img src="https://media.docs.plane.so/mobile/app-modules.webp" alt="Modules" width="320"/>
</div>
</div>
<br/>
Expand Down
6 changes: 3 additions & 3 deletions src/css/custom.css
Original file line number Diff line number Diff line change
Expand Up @@ -30,7 +30,7 @@
}

[data-theme='light'] body, .navbar{
background-color: rgb(237 237 235);
background-color: rgb(250 250 250);
}
[data-theme='dark'] .navbar{
background-color: #1b1b1d;
Expand Down Expand Up @@ -403,7 +403,7 @@ html[data-theme='dark'] {
border-color: rgb(158 158 158 / 20%) !important;
border-width: 1px !important;
border-style: solid !important;
background-color: #ededeb !important;
background-color: #FAFAFA !important;
}

[data-theme='dark'] .DocSearch-Button{
Expand Down Expand Up @@ -486,7 +486,7 @@ html[data-theme='dark'] {
}

table tr:nth-child(2n) {
background-color: rgb(237 237 235);
background-color: rgb(250 250 250);
}

table thead tr {
Expand Down