docs: add new Access Control and Logs documentation pages
- Documented Access Control features (e.g., Device Approvals, Password Rotation, 2FA, Custom Login Pages). - Added detailed descriptions for Logs & Analytics (Access Logs, Request Logs, Action Logs). - Included configuration instructions and feature-specific notes for Pangolin Cloud and Enterprise Edition. Signed-off-by: Stefan Mogeritsch <stefan.mo.co@gmail.com>
This commit is contained in:
@@ -0,0 +1,328 @@
|
||||
> ## Documentation Index
|
||||
> Fetch the complete documentation index at: https://docs.pangolin.net/llms.txt
|
||||
> Use this file to discover all available pages before exploring further.
|
||||
|
||||
# Branding
|
||||
|
||||
> Learn how to customize the look your Pangolin dashboard and login pages with custom branding
|
||||
|
||||
<div id="pangolin-toc-cta" className="pangolin-toc-cta-source">
|
||||
<Card title="Try free on Pangolin Cloud" icon="cloud" href="https://app.pangolin.net/auth/signup" arrow="true" cta="Sign up free">
|
||||
Fastest way to get started with Pangolin using the hosted control plane. No credit card required.
|
||||
</Card>
|
||||
</div>
|
||||
|
||||
<Note>
|
||||
Branding is only available in [Enterprise Edition](/self-host/enterprise-edition).
|
||||
</Note>
|
||||
|
||||
Pangolin allows you to customize the appearance of your dashboard with your own branding, including colors, logos, and
|
||||
custom text for authentication pages. Branding is configured through the `privateConfig.yml` file.
|
||||
|
||||
## Organization Branding
|
||||
|
||||
In the settings of each organization, there is an Authentication Page branding settings section. These settings enable
|
||||
you to brand the resource authentication page and organization authentication page for that specific organization. These
|
||||
settings will override anything set in the configuration file.
|
||||
|
||||
## Setting up Branding
|
||||
|
||||
To get started, create a `privateConfig.yml` file next to your existing `config.yml` file:
|
||||
|
||||
```yaml title="privateConfig.yml" theme={null}
|
||||
branding:
|
||||
app_name: "MyApp"
|
||||
|
||||
logo:
|
||||
light_path: "/branding/logo-light.svg"
|
||||
dark_path: "/branding/logo-dark.svg"
|
||||
|
||||
colors:
|
||||
light:
|
||||
primary: "hsl(212, 65%, 35%)"
|
||||
ring: "hsl(212, 65%, 35%)"
|
||||
primary-foreground: "hsl(0 0% 98%)"
|
||||
dark:
|
||||
primary: "hsl(212, 65%, 45%)"
|
||||
ring: "hsl(212, 65%, 35%)"
|
||||
primary-foreground: "hsl(0 0% 98%)"
|
||||
```
|
||||
|
||||
## Mounting Branding Assets
|
||||
|
||||
For image assets like logos and backgrounds, you need to mount a volume to the Pangolin container to make them
|
||||
accessible to the application:
|
||||
|
||||
```yaml title="docker-compose.yml" theme={null}
|
||||
volumes:
|
||||
- ./config:/app/config
|
||||
- ./branding:/app/public/branding
|
||||
```
|
||||
|
||||
Your folder structure should look like this:
|
||||
|
||||
```
|
||||
.
|
||||
├── config/
|
||||
│ ├── config.yml
|
||||
│ └── privateConfig.yml
|
||||
└── branding/
|
||||
├── logo-light.svg
|
||||
├── logo-dark.svg
|
||||
└── favicon.ico
|
||||
```
|
||||
|
||||
## Reference
|
||||
|
||||
All branding configuration options are optional. Only specify the sections you want to customize.
|
||||
|
||||
### Application Name
|
||||
|
||||
<ResponseField name="app_name" type="string">
|
||||
The name of your application that appears in various places throughout the UI.
|
||||
|
||||
**Example**: `"MyApp"`
|
||||
</ResponseField>
|
||||
|
||||
### Favicon
|
||||
|
||||
To customize the favicon, mount your favicon to `/app/public/favicon.ico` in the container.
|
||||
|
||||
```yaml title="docker-compose.yml" theme={null}
|
||||
volumes:
|
||||
- ./config:/app/config
|
||||
- ./branding/favicon.ico:/app/public/favicon.ico
|
||||
```
|
||||
|
||||
### Background Image
|
||||
|
||||
<ResponseField name="background_image_path" type="string">
|
||||
Path to a custom background image used on authentication pages.
|
||||
|
||||
**Example**: `"/branding/backgrounds/bg.png"`
|
||||
|
||||
<Note>
|
||||
Requires mounting a volume to `/app/public`.
|
||||
</Note>
|
||||
</ResponseField>
|
||||
|
||||
### Colors
|
||||
|
||||
<ResponseField name="colors" type="object">
|
||||
Custom color scheme that overrides the default Tailwind classes for shadcn components.
|
||||
|
||||
Colors can be provided in OKLCH or HSL format for example and apply to both light and dark modes.
|
||||
|
||||
**Color Reference**: Available color properties include `background`, `foreground`, `card`, `card-foreground`,
|
||||
`popover`, `popover-foreground`, `primary`, `primary-foreground`, `secondary`, `secondary-foreground`, `muted`,
|
||||
`muted-foreground`, `accent`, `accent-foreground`, `destructive`, `destructive-foreground`, `border`, `input`, `ring`,
|
||||
`radius`, and `chart-1` through `chart-5`.
|
||||
|
||||
**Example**:
|
||||
|
||||
```yaml theme={null}
|
||||
colors:
|
||||
light:
|
||||
primary: "hsl(212, 65%, 35%)"
|
||||
background: "hsl(212, 65%, 35%)"
|
||||
foreground: "hsl(0 0% 98%)"
|
||||
dark:
|
||||
primary: "hsl(212, 65%, 45%)"
|
||||
background: "hsl(212, 65%, 35%)"
|
||||
foreground: "hsl(0 0% 98%)"
|
||||
```
|
||||
|
||||
<Tip>
|
||||
For a complete list of Tailwind color classes used by shadcn components, refer to the [shadcn/ui documentation](https://ui.shadcn.com/docs/theming).
|
||||
</Tip>
|
||||
</ResponseField>
|
||||
|
||||
### Logo
|
||||
|
||||
<ResponseField name="logo" type="object">
|
||||
Logo configuration for different parts of the application.
|
||||
|
||||
<Expandable title="Logo">
|
||||
<ResponseField name="light_path" type="string">
|
||||
Path to the logo image used in light mode.
|
||||
|
||||
**Example**: `"/branding/logo-light.svg"`
|
||||
</ResponseField>
|
||||
|
||||
<ResponseField name="dark_path" type="string">
|
||||
Path to the logo image used in dark mode.
|
||||
|
||||
**Example**: `"/branding/logo-dark.svg"`
|
||||
</ResponseField>
|
||||
|
||||
<ResponseField name="auth_page" type="object">
|
||||
Logo dimensions for authentication pages.
|
||||
|
||||
<Expandable title="Auth Page">
|
||||
<ResponseField name="width" type="integer">
|
||||
Logo width in pixels.
|
||||
|
||||
**Example**: `200`
|
||||
</ResponseField>
|
||||
|
||||
<ResponseField name="height" type="integer">
|
||||
Logo height in pixels.
|
||||
|
||||
**Example**: `80`
|
||||
</ResponseField>
|
||||
</Expandable>
|
||||
</ResponseField>
|
||||
|
||||
<ResponseField name="navbar" type="object">
|
||||
Logo dimensions for the navigation bar.
|
||||
|
||||
<Expandable title="Navbar">
|
||||
<ResponseField name="width" type="integer">
|
||||
Logo width in pixels.
|
||||
|
||||
**Example**: `150`
|
||||
</ResponseField>
|
||||
|
||||
<ResponseField name="height" type="integer">
|
||||
Logo height in pixels.
|
||||
|
||||
**Example**: `60`
|
||||
</ResponseField>
|
||||
</Expandable>
|
||||
</ResponseField>
|
||||
|
||||
</Expandable>
|
||||
</ResponseField>
|
||||
|
||||
### Footer
|
||||
|
||||
<ResponseField name="footer" type="array of objects">
|
||||
Custom footer links displayed at the bottom of the page.
|
||||
|
||||
**Example**:
|
||||
|
||||
```yaml theme={null}
|
||||
footer:
|
||||
- text: "Privacy Policy"
|
||||
href: "https://example.com/privacy"
|
||||
- text: "Terms of Service"
|
||||
href: "https://example.com/terms"
|
||||
```
|
||||
|
||||
<ResponseField name="text" type="string">
|
||||
The display text for the footer link.
|
||||
</ResponseField>
|
||||
|
||||
<ResponseField name="href" type="string">
|
||||
The URL or path for the footer link.
|
||||
</ResponseField>
|
||||
</ResponseField>
|
||||
|
||||
### Hide Auth Page Footer
|
||||
|
||||
<ResponseField name="hide_auth_layout_footer" type="boolean">
|
||||
Hide the horizontal footer text that appears in the bottom layout of all authentication pages.
|
||||
|
||||
**Default**: `false`
|
||||
</ResponseField>
|
||||
|
||||
### Login Page
|
||||
|
||||
<ResponseField name="login_page" type="object">
|
||||
Custom text for the login page.
|
||||
|
||||
<Expandable title="Login Page">
|
||||
<ResponseField name="subtitle_text" type="string">
|
||||
The subtitle text displayed below the title.
|
||||
|
||||
**Example**: `"Sign in to continue to your account"`
|
||||
</ResponseField>
|
||||
|
||||
</Expandable>
|
||||
</ResponseField>
|
||||
|
||||
### Signup Page
|
||||
|
||||
<ResponseField name="signup_page" type="object">
|
||||
Custom text for the signup page.
|
||||
|
||||
<Expandable title="Signup Page">
|
||||
<ResponseField name="subtitle_text" type="string">
|
||||
The subtitle text displayed below the title.
|
||||
|
||||
**Example**: `"Join us and get started today"`
|
||||
</ResponseField>
|
||||
|
||||
</Expandable>
|
||||
</ResponseField>
|
||||
|
||||
### Resource Auth Page
|
||||
|
||||
<ResponseField name="resource_auth_page" type="object">
|
||||
Configuration for the resource authentication page shown to users when accessing protected resources.
|
||||
|
||||
<Expandable title="Resource Auth Page">
|
||||
<ResponseField name="show_logo" type="boolean">
|
||||
Whether to display the logo on the resource auth page.
|
||||
|
||||
**Default**: `true`
|
||||
</ResponseField>
|
||||
|
||||
<ResponseField name="hide_powered_by" type="boolean">
|
||||
Whether to hide the "Powered by Pangolin" text on the resource auth page.
|
||||
|
||||
**Default**: `false`
|
||||
</ResponseField>
|
||||
|
||||
<ResponseField name="title_text" type="string">
|
||||
The main title text displayed on the resource auth page.
|
||||
|
||||
**Example**: `"Access Restricted"`
|
||||
</ResponseField>
|
||||
|
||||
<ResponseField name="subtitle_text" type="string">
|
||||
The subtitle text displayed below the title.
|
||||
|
||||
**Example**: `"Please sign in to view this resource"`
|
||||
</ResponseField>
|
||||
|
||||
</Expandable>
|
||||
</ResponseField>
|
||||
|
||||
### Emails
|
||||
|
||||
<ResponseField name="emails" type="object">
|
||||
Email customization settings.
|
||||
|
||||
<Expandable title="Emails">
|
||||
<ResponseField name="signature" type="string">
|
||||
Custom signature appended to sent emails.
|
||||
|
||||
**Example**: `"Best regards,\nThe MyApp Team"`
|
||||
|
||||
<Note>
|
||||
Use `\n` for line breaks in the signature.
|
||||
</Note>
|
||||
</ResponseField>
|
||||
|
||||
<ResponseField name="colors" type="object">
|
||||
Email color scheme.
|
||||
|
||||
<Expandable title="Colors">
|
||||
<ResponseField name="primary" type="string">
|
||||
Primary color for email elements.
|
||||
|
||||
**Example**: `"oklch(0.6717 0.1946 41.93)"`
|
||||
</ResponseField>
|
||||
</Expandable>
|
||||
</ResponseField>
|
||||
|
||||
</Expandable>
|
||||
</ResponseField>
|
||||
|
||||
## Applying Changes
|
||||
|
||||
<Warning>
|
||||
After creating or modifying `privateConfig.yml`, you must restart the Pangolin container for changes to take effect.
|
||||
</Warning>
|
||||
|
||||
Reference in New Issue
Block a user