mirror of
https://github.com/zen-browser/docs.git
synced 2025-07-07 17:05:34 +02:00
Merge branch 'zen-browser:main' into main
This commit is contained in:
blu3
GitHub
commit
c201663108
13 changed files with 133 additions and 139 deletions
BIN
content/assets/user-manual/urlbar/vid.mov
Normal file
BIN
content/assets/user-manual/urlbar/vid.mov
Normal file
Binary file not shown.
|
|
@ -1,7 +1,7 @@
|
|||
---
|
||||
title: Contributing to Zen Browser
|
||||
draft: false
|
||||
lastmod: 2024-08-26
|
||||
lastmod: 2025-02-07
|
||||
---
|
||||
|
||||
Thank you for considering contributing to Zen Browser! We appreciate your time and effort in improving this project. The following is a set of guidelines for contributing to Zen Browser. These guidelines are intended to make it easier for you to get involved.
|
||||
|
|
@ -23,7 +23,7 @@ To help you get started with contributing, we have created separate guides for e
|
|||
- [[www | Getting Started with Zen's Homepage Development]]
|
||||
- [[docs | Getting Started with Documentation Contributions]]
|
||||
- [[translation | Getting Started with Translations]]
|
||||
|
||||
|
||||
Please follow the appropriate guide based on the repository you want to contribute to.
|
||||
|
||||
### Reporting Bugs
|
||||
|
|
@ -33,7 +33,7 @@ If you find a bug, please open an issue and describe the problem in detail. Incl
|
|||
>[!important]
|
||||
>Open the issue in it's corresponding GitHub repository:
|
||||
>- [Desktop Browser App](https://github.com/zen-browser/desktop/issues)
|
||||
>- [Zen's Custom Themes](https://github.com/zen-browser/theme-store)
|
||||
>- [Zen's Custom Mods](https://github.com/zen-browser/theme-store)
|
||||
>- [Zen's Homepage Website](https://github.com/zen-browser/www)
|
||||
>- [This documentation Website](https://github.com/zen-browser/docs)
|
||||
|
||||
|
|
@ -41,7 +41,7 @@ If you find a bug, please open an issue and describe the problem in detail. Incl
|
|||
|
||||
![[discuss.png]]
|
||||
|
||||
We welcome suggestions for new features or improvements to existing ones. To suggest a feature, please start a new Github discussion in the Ideas category.
|
||||
We welcome suggestions for new features or improvements to existing ones. To suggest a feature, please start a new Github discussion in the Ideas category.
|
||||
*Use the correct Github Repository based on the list above*
|
||||
|
||||
---
|
||||
|
|
|
|||
|
|
@ -55,7 +55,7 @@ Your support helps the team maintain and enhance Zen Browser for everyone!
|
|||
|
||||
1. Select multiple tabs by left-clicking them while holding the `Ctrl` key, or left-click 2 tabs while holding the `Shift` key to select all tabs in between
|
||||
2. Right click a tab, and select `Split x Tabs`
|
||||
3. Change the view mode by pressing the 🔗 button in the top address bar
|
||||
3. Change the view mode by pressing the `[|]` button in the top address bar
|
||||
|
||||
## How to switch tabs by scrolling?
|
||||
You can enable this feature by changing a setting in the browser's configuration. Here's how:
|
||||
|
|
|
|||
|
|
@ -53,11 +53,9 @@ In MacOS you can use the Graphical Interface of the Desktop app to add Zen Brows
|
|||
|
||||
#### 1. Go into the 1Password desktop app and open Settings.
|
||||
|
||||
#### 2. In the Labs tab, click "Enable Custom Browser Support" and enable it.
|
||||
#### 2. In the Browser tab, click "Add Browser".
|
||||
|
||||
#### 3. In the Browser tab, click "Add Browser".
|
||||
|
||||
#### 4. In your Applications folder, find and add "Zen Browser, then authorize 1Password when prompted.
|
||||
#### 3. In your Applications folder, find and add "Zen Browser", then authorize 1Password when prompted.
|
||||
|
||||
![[macos-settings-4.png]]
|
||||
|
||||
|
|
|
|||
|
|
@ -19,6 +19,7 @@ This [[guides/index|guide]] will help you customize the appearance of Zen Browse
|
|||
|
||||
1. In the Profile Folder, create a new folder and name it `chrome`.
|
||||
2. Inside the `chrome` folder, create a new blank file named `userChrome.css`.
|
||||
3. Restart Zen Browser to apply the changes.
|
||||
|
||||
## Step 3: Open Style Editor in Zen Browser
|
||||
|
||||
|
|
|
|||
|
|
@ -9,9 +9,8 @@ Welcome to **Zen Browser's Documentation!** Here, you'll find everything you nee
|
|||
* #### [[building|Building Zen Browser 📦]]
|
||||
* #### [[user-manual/index|User Manual 📖]]
|
||||
* #### [[guides/index|Guides 🛠️]]
|
||||
* #### [[themes-store/index|Theme Store 🎨]]
|
||||
* #### [[themes-store/index|Mods Registry 🎨]]
|
||||
* #### [[faq | Frequently Asked Questions ❓]]
|
||||
* #### [[benchmarks | Performance Benchmarks 📊]]
|
||||
* #### [[contribute/index | Contribution Guides 🌟]]
|
||||
* #### [[security|Security 🔐]]
|
||||
* #### [[welcome-to-zen|Welcome to Zen 🔐]]
|
||||
|
|
|
|||
|
|
@ -1,34 +1,59 @@
|
|||
---
|
||||
title: Security 🔐
|
||||
title: Privacy & Security 🔐
|
||||
aliases:
|
||||
- Security 🔐
|
||||
- Privacy & Security 🔐
|
||||
description: At Zen Browser, your online safety and privacy are our top priorities. We've implemented a range of security features to ensure you're protected while browsing.
|
||||
lastmod: 2024-09-18
|
||||
---
|
||||
> [!important] Password, Cookies, and Cache Management
|
||||
> All passwords, cookies, and cache in Zen Browser are managed by Firefox. This means your saved passwords are automatically encrypted, providing an extra layer of security to keep your login credentials safe. Cookies and cache are also handled according to Firefox's strict privacy policies, ensuring your data is stored securely and only accessible to you.
|
||||
> All passwords, cookies, and cache in Zen Browser are **managed by Firefox**. This means your saved passwords are **automatically encrypted**, providing an extra layer of security to keep your login credentials safe. Cookies and cache are also handled according to Firefox's strict privacy policies, ensuring your data is stored securely and only accessible to you.
|
||||
> For more information visit [Firefox Privacy and Security](https://support.mozilla.org/es/products/firefox/privacy-and-security)
|
||||
## Adjusting Security Settings
|
||||
|
||||
### 1. Latest Firefox Version
|
||||
Zen Browser lets you customize privacy and security settings to improve your browsing safety. If you want to adjust or change these settings:
|
||||
|
||||
Zen Browser is built on the latest version of Firefox, one of the most secure browsers available today. This means you benefit from all of Firefox's security patches and updates as soon as they are released, keeping you safe from known vulnerabilities.
|
||||
1. Click the `menu button` and select `Settings`.
|
||||
2. On the sidebar, go to the `Privacy & Security` section.
|
||||
|
||||
### 2. Tracking Protection
|
||||
---
|
||||
## Security settings
|
||||
|
||||
To protect your privacy, Zen Browser includes **tracking protection**. This feature automatically blocks websites and advertisers from tracking your online activity, making it harder for third parties to collect your data and show you targeted ads.
|
||||
|
||||
### 3. OCSP Enabled
|
||||
> [!success] Latest Firefox Version
|
||||
> Zen Browser is built on the **latest version of Firefox**, one of the most secure browsers available today. This means you benefit from all of Firefox's security patches and updates as soon as they are released, keeping you safe from known vulnerabilities.
|
||||
### 1. OCSP Enabled
|
||||
|
||||
Zen Browser uses **OCSP (Online Certificate Status Protocol)** to check the validity of a website’s security certificate. This ensures that you only connect to safe websites with up-to-date and valid certificates, protecting you from malicious sites that may have expired or revoked certificates.
|
||||
|
||||
### 4. HTTPS Only Mode
|
||||
### 2. HTTPS Only Mode
|
||||
|
||||
**HTTPS Only Mode** ensures that you connect securely to websites by using the HTTPS version whenever possible. HTTPS encrypts the communication between you and the website, protecting your data from being intercepted by hackers.
|
||||
|
||||
> [!info] You can enable HTTPS-Only Mode in **all windows** or **private windows only**.
|
||||
|
||||
For more information visit [HTTPS-Only Mode in Firefox](https://support.mozilla.org/en-US/kb/https-only-prefs)
|
||||
### 3. Deceptive Content and Dangerous Software Protection
|
||||
|
||||
### 5. SSL – Treat Unsafe Negotiation as Broken by Default
|
||||
Zen Browser helps protect you from **phishing, malware, and fraudulent websites**. It uses URL filters and real-time checks to block harmful content, making your browsing experience safer.
|
||||
|
||||
Zen Browser treats insecure SSL connections (those that don't meet modern security standards) as broken by default. This means that if a website is not properly secured, Zen Browser will alert you and block the unsafe connection, preventing potential security risks.
|
||||
To learn more, visit [Block deceptive content and dangerous downloads in Firefox](https://support.mozilla.org/en-US/kb/block-deceptive-content-and-dangerous-downloads-firefox)
|
||||
### 4. SSL – Treat Unsafe Negotiation as Broken by Default
|
||||
|
||||
Zen Browser treats insecure SSL connections (those that don't meet modern security standards) as broken by default. This means that if a **website is not properly secured**, Zen Browser will alert you and **block the unsafe connection**, preventing potential security risks.
|
||||
|
||||
---
|
||||
## Privacy settings
|
||||
|
||||
### 1. Tracking Protection
|
||||
|
||||
To protect your privacy, Zen Browser includes **tracking protection**. This feature automatically blocks websites and advertisers from tracking your online activity, making it harder for third parties to collect your data and show you targeted ads.
|
||||
|
||||
> [!info] You can choose from three levels of Tracking Protection: **Standard**, **Strict**, or **Custom**.
|
||||
|
||||
### 2. DNS over HTTPS
|
||||
|
||||
Zen Browser allows the users to enable DNS over HTTPS, which **sends your request for a domain name through an encrypted connection**, providing a secure DNS and making it harder for others to see which website you’re about to access.
|
||||
|
||||
> [!info] You can choose from three protection levels: **Default Protection**, **Increased Protection**, or **Max Protection**.
|
||||
|
||||
---
|
||||
|
||||
|
|
|
|||
|
|
@ -1,3 +1,3 @@
|
|||
---
|
||||
title: Themes Store 🎨
|
||||
title: Mods Registry 🎨
|
||||
---
|
||||
|
|
|
|||
|
|
@ -1,9 +1,9 @@
|
|||
---
|
||||
title: Themes Store Preferences ⚙️
|
||||
lastmod: 2024-09-16
|
||||
title: Mods Registry Preferences ⚙️
|
||||
lastmod: 2025-02-07
|
||||
---
|
||||
|
||||
The `preferences.json` file allows theme developers to define custom preferences that control the behavior and appearance of themes in the Zen Browser. Each preference is defined with a `property`, a `label`, a `type`, and optionally `options` (for dropdown preferences), `defaultValue`, `placeholder` (to configure preference placeholder) and `disabledOn` (to disable property on selected OS). The `preferences.json` file contains a list of these preference objects at its root.
|
||||
The `preferences.json` file allows mod developers to define custom preferences that control the behavior and appearance of mods in the Zen Browser. Each preference is defined with a `property`, a `label`, a `type`, and optionally `options` (for dropdown preferences), `defaultValue`, `placeholder` (to configure preference placeholder) and `disabledOn` (to disable property on selected OS). The `preferences.json` file contains a list of these preference objects at its root.
|
||||
|
||||
## Preferences fields
|
||||
|
||||
|
|
@ -11,7 +11,7 @@ The `preferences.json` file allows theme developers to define custom preferences
|
|||
|
||||
The `property` field is a string that should follow Firefox's preference naming schema, similar to `about:config` entries. The `property` name can be any valid string that aligns with this schema.
|
||||
|
||||
For example: `theme.mytheme.background_color`
|
||||
For example: `mod.mymod.background_color`
|
||||
|
||||
|
||||
### Field: `label` - Label
|
||||
|
|
@ -35,7 +35,7 @@ The `checkbox` type allows a togglable input to enable or disable a property.
|
|||
|
||||
```json title="Checkbox Example"
|
||||
{
|
||||
"property": "theme.mytheme.enable_dark_mode",
|
||||
"property": "mod.mymod.enable_dark_mode",
|
||||
"label": "Enable dark mode",
|
||||
"type": "checkbox"
|
||||
}
|
||||
|
|
@ -47,7 +47,7 @@ The `dropdown` type allows to select a single choice on multiple options.
|
|||
|
||||
```json title="Dropdown Example"
|
||||
{
|
||||
"property": "theme.mytheme.background_color",
|
||||
"property": "mod.mymod.background_color",
|
||||
"label": "Background color",
|
||||
"type": "dropdown",
|
||||
"options": [
|
||||
|
|
@ -70,7 +70,7 @@ The `string` type is a text input that allows to insert valid css values without
|
|||
|
||||
```json title="String Example"
|
||||
{
|
||||
"property": "theme.mytheme.tab_padding",
|
||||
"property": "mod.mymod.tab_padding",
|
||||
"label": "Set tab padding",
|
||||
"type": "string"
|
||||
}
|
||||
|
|
@ -161,18 +161,18 @@ For example: `e.g: 10px`
|
|||
<details>
|
||||
<summary><font weight="bold" size=4.75><b>See Full Example</b></font></summary>
|
||||
|
||||
Below is a full example of what a `preferences.json` file might look like with multiple preference objects in its root. Each object represents a preference defined for a theme:
|
||||
Below is a full example of what a `preferences.json` file might look like with multiple preference objects in its root. Each object represents a preference defined for a mod:
|
||||
|
||||
```json
|
||||
[
|
||||
{
|
||||
"property": "theme.mytheme.enable_dark_mode",
|
||||
"property": "mod.mymod.enable_dark_mode",
|
||||
"label": "Enable dark mode",
|
||||
"type": "checkbox",
|
||||
"defaultValue": true
|
||||
},
|
||||
{
|
||||
"property": "theme.mytheme.background_color",
|
||||
"property": "mod.mymod.background_color",
|
||||
"label": "Background color",
|
||||
"type": "dropdown",
|
||||
"placeholder": "Select a color",
|
||||
|
|
@ -189,7 +189,7 @@ Below is a full example of what a `preferences.json` file might look like with m
|
|||
]
|
||||
},
|
||||
{
|
||||
"property": "theme.mytheme.show_bookmarks_bar",
|
||||
"property": "mod.mymod.show_bookmarks_bar",
|
||||
"label": "Show bookmarks bar",
|
||||
"type": "string",
|
||||
"disabledOn": ["macos"]
|
||||
|
|
@ -207,19 +207,19 @@ In this example:
|
|||
|
||||
---
|
||||
|
||||
## Using preferences in the theme's CSS
|
||||
## Using preferences in the mod's CSS
|
||||
|
||||
Once you have defined your preferences in the `preferences.json` file, you can use them in your theme’s CSS to modify the appearance or behavior based on the user’s selections.
|
||||
Once you have defined your preferences in the `preferences.json` file, you can use them in your mod’s CSS to modify the appearance or behavior based on the user’s selections.
|
||||
|
||||
### Checkbox Preferences
|
||||
|
||||
Checkbox preferences can be detected in your CSS using the `-moz-bool-pref` media query, which evaluates the boolean value (`true` or `false`) of a checkbox preference.
|
||||
|
||||
For example, if you have a preference to enable dark mode in your theme:
|
||||
For example, if you have a preference to enable dark mode in your mod:
|
||||
|
||||
```json
|
||||
{
|
||||
"property": "theme.mytheme.enable_dark_mode",
|
||||
"property": "mod.mymod.enable_dark_mode",
|
||||
"label": "Enable dark mode",
|
||||
"type": "checkbox"
|
||||
}
|
||||
|
|
@ -228,7 +228,7 @@ For example, if you have a preference to enable dark mode in your theme:
|
|||
You can use the following CSS to change the background color when the dark mode preference is enabled:
|
||||
|
||||
```css {1}
|
||||
@media (-moz-bool-pref: "theme.mytheme.enable_dark_mode") {
|
||||
@media (-moz-bool-pref: "mod.mymod.enable_dark_mode") {
|
||||
body {
|
||||
background-color: #000;
|
||||
color: #fff;
|
||||
|
|
@ -238,16 +238,16 @@ You can use the following CSS to change the background color when the dark mode
|
|||
|
||||
You can also have negative conditions
|
||||
```css {1}
|
||||
@media not (-moz-bool-pref: "theme.mytheme.enable_dark_mode")
|
||||
@media not (-moz-bool-pref: "mod.mymod.enable_dark_mode")
|
||||
```
|
||||
|
||||
|
||||
### Dropdown Preferences
|
||||
|
||||
> [!attention]
|
||||
> `property` fields defined in `preferences.json` using the `"dropdown"` type will have one key difference when used in your themes CSS: **dots (`.`) in the `property` name are replaced with hyphens (`-`)**.
|
||||
> `property` fields defined in `preferences.json` using the `"dropdown"` type will have one key difference when used in your mod’s CSS: **dots (`.`) in the `property` name are replaced with hyphens (`-`)**.
|
||||
>
|
||||
> E.g. `theme.mytheme.background_color` becomes `theme-mytheme-background_color` in the CSS file.
|
||||
> E.g. `mod.mymod.background_color` becomes `mod-mymod-background_color` in the CSS file.
|
||||
> This transformation ensures that the property can be used as an attribute selector or inside a media query.
|
||||
|
||||
For dropdown preferences, you can detect the selected value using the `:has(){:css}` CSS pseudo-class, which applies styles based on the selected attribute and value in the DOM.
|
||||
|
|
@ -256,7 +256,7 @@ For example, if you have a preference to select the background color from a drop
|
|||
|
||||
```json
|
||||
{
|
||||
"property": "theme.mytheme.background_color",
|
||||
"property": "mod.mymod.background_color",
|
||||
"label": "Background color",
|
||||
"type": "dropdown",
|
||||
"options": [
|
||||
|
|
@ -276,13 +276,13 @@ You can use the following CSS to change the background color based on the select
|
|||
|
||||
```css {2,8,14}
|
||||
/* Green background */
|
||||
body:has(#theme-mytheme[theme-mytheme-background_color="green"]) {
|
||||
body:has(#mod-mymod[mod-mymod-background_color="green"]) {
|
||||
background-color: #008000;
|
||||
color: #000;
|
||||
}
|
||||
|
||||
/* Blue background */
|
||||
body:has(#theme-mytheme[theme-mytheme-background_color="blue"]) {
|
||||
body:has(#mod-mymod[mod-mymod-background_color="blue"]) {
|
||||
background-color: #0000ff;
|
||||
color: #fff;
|
||||
}
|
||||
|
|
@ -290,7 +290,7 @@ body:has(#theme-mytheme[theme-mytheme-background_color="blue"]) {
|
|||
|
||||
In this example:
|
||||
- The background color and text color change based on the value selected in the `background_color` dropdown.
|
||||
- The selector `body:has(#theme-mytheme[background_color="value"]){:css}` checks the `background_color` attribute and applies the relevant styles based on the selected option.
|
||||
- The selector `body:has(#mod-mymod[background_color="value"]){:css}` checks the `background_color` attribute and applies the relevant styles based on the selected option.
|
||||
|
||||
---
|
||||
|
||||
|
|
@ -302,12 +302,12 @@ Suppose your `preferences.json` file includes these two preferences:
|
|||
```json
|
||||
[
|
||||
{
|
||||
"property": "theme.mytheme.enable_dark_mode",
|
||||
"property": "mod.mymod.enable_dark_mode",
|
||||
"label": "Enable dark mode",
|
||||
"type": "checkbox"
|
||||
},
|
||||
{
|
||||
"property": "theme.mytheme.background_color",
|
||||
"property": "mod.mymod.background_color",
|
||||
"label": "Background color",
|
||||
"type": "dropdown",
|
||||
"options": [
|
||||
|
|
@ -328,7 +328,7 @@ You can combine the CSS like this:
|
|||
|
||||
```css
|
||||
/* Checkbox for dark mode */
|
||||
@media (-moz-bool-pref: "theme.mytheme.enable_dark_mode") {
|
||||
@media (-moz-bool-pref: "mod.mymod.enable_dark_mode") {
|
||||
body {
|
||||
background-color: #000;
|
||||
color: #fff;
|
||||
|
|
@ -336,12 +336,12 @@ You can combine the CSS like this:
|
|||
}
|
||||
|
||||
/* Dropdown for background color selection */
|
||||
body:has(#theme-mytheme[theme-mytheme-background_color="green"]) {
|
||||
body:has(#mod-mymod[mod-mymod-background_color="green"]) {
|
||||
background-color: #008000;
|
||||
color: #000;
|
||||
}
|
||||
|
||||
body:has(#theme-mytheme[theme-mytheme-background_color="blue"]) {
|
||||
body:has(#mod-mymod[mod-mymod-background_color="blue"]) {
|
||||
background-color: #0000ff;
|
||||
color: #fff;
|
||||
}
|
||||
|
|
@ -358,16 +358,16 @@ This allows users to:
|
|||
String preferences can be detected in your CSS using the `var(--property)` operator. The preference property is saved at `:root` level.
|
||||
|
||||
> [!attention]
|
||||
> `property` fields defined in `preferences.json` using the `"string"` type will have one key difference when used in your themes CSS: **dots (`.`) in the `property` name are replaced with hyphens (`-`)**.
|
||||
> `property` fields defined in `preferences.json` using the `"string"` type will have one key difference when used in your mod’s CSS: **dots (`.`) in the `property` name are replaced with hyphens (`-`)**.
|
||||
>
|
||||
> E.g. `theme.mytheme.background_color` becomes `theme-mytheme-background_color` in the CSS file.
|
||||
> E.g. `mod.mymod.background_color` becomes `mod-mymod-background_color` in the CSS file.
|
||||
> This transformation ensures that the property can be used as an attribute selector or inside a media query.
|
||||
|
||||
For example, if you have a preference to enable dark mode in your theme:
|
||||
For example, if you have a preference to enable dark mode in your mod:
|
||||
|
||||
```json
|
||||
{
|
||||
"property": "theme.mytheme.background_color",
|
||||
"property": "mod.mymod.background_color",
|
||||
"label": "Background color",
|
||||
"type": "string"
|
||||
}
|
||||
|
|
@ -377,6 +377,6 @@ You can use the following CSS to change the background color when the dark mode
|
|||
|
||||
```css {2}
|
||||
.myClass {
|
||||
background-color: var(--theme-mytheme-background_color)
|
||||
background-color: var(--mod-mymod-background_color)
|
||||
}
|
||||
```
|
||||
|
|
|
|||
|
|
@ -1,33 +1,33 @@
|
|||
---
|
||||
title: Themes Store Submission Guidelines 📋
|
||||
lastmod: 2024-08-19
|
||||
title: Mods Registry Submission Guidelines 📋
|
||||
lastmod: 2025-02-07
|
||||
---
|
||||
|
||||
If you are a theme developer and would like to submit your theme, please follow these guidelines:
|
||||
If you are a [mod developer] and would like to submit your mod, please follow these guidelines:
|
||||
|
||||
1. **Theme requirements**:
|
||||
- Your theme must be compatible with Zen Browser.
|
||||
- Your theme must be open-source.
|
||||
- Your theme must not contain any malicious code.
|
||||
- Your theme must not violate any copyright laws.
|
||||
1. **Mod requirements**:
|
||||
- Your mod must be compatible with Zen Browser.
|
||||
- Your mod must be open-source.
|
||||
- Your mod must not contain any malicious code.
|
||||
- Your mod must not violate any copyright laws.
|
||||
|
||||
2. **Theme Validation**:
|
||||
- Your theme's name must be unique and less than `25` characters.
|
||||
- Your theme's description must be less than `100` characters.
|
||||
- Your theme's screenshot must be a `PNG` with a size of `300x200` (it can be resized after upload).
|
||||
- Your theme must contain a valid `README` describing the theme and how to use it.
|
||||
- If your theme has any preferences values, they must be set in the `preferences` text area as a `JSON` object.
|
||||
2. **Mod Validation**:
|
||||
- Your mod's name must be unique and less than `25` characters.
|
||||
- Your mod's description must be less than `100` characters.
|
||||
- Your mod's screenshot must be a `PNG` with a size of `300x200` (it can be resized after upload).
|
||||
- Your mod must contain a valid `README` describing the mod and how to use it.
|
||||
- If your mod has any preferences values, they must be set in the `preferences` text area as a `JSON` object.
|
||||
- See how preferences work [here](themes-store/themes-marketplace-preferences.md).
|
||||
|
||||
3. **Theme Submission**:
|
||||
- To submit your theme, please create an issue [here](https://github.com/zen-browser/theme-store/issues/new?assignees=&labels=new-theme&projects=&template=create-theme.yml&title=%5Bcreate-theme%5D%3A+)
|
||||
3. **Mod Submission**:
|
||||
- To submit your mod, please create an issue [here](https://github.com/zen-browser/theme-store/issues/new?assignees=&labels=new-theme&projects=&template=create-theme.yml&title=%5Bcreate-theme%5D%3A+)
|
||||
- Fill out the template with the required information.
|
||||
- Once you have submitted your theme, it will be analyzed by a bot and a pull request will be created.
|
||||
- If your theme is approved, it will be added to the Themes Marketplace.
|
||||
- Once you have submitted your mod, it will be analyzed by a bot and a pull request will be created.
|
||||
- If your mod is approved, it will be added to the Mods Registry.
|
||||
|
||||
4. **Theme Update**:
|
||||
- If you would like to update your theme, please create an issue [here](https://github.com/zen-browser/theme-store/issues/new)
|
||||
4. **Mod Update**:
|
||||
- If you would like to update your mod, please create an issue [here](https://github.com/zen-browser/theme-store/issues/new)
|
||||
- Please explain the changes you have made.
|
||||
|
||||
> [!info]
|
||||
> Themes are automatically updated and generated by the bot. If your theme is not approved, you will receive a message with the reason why it was not approved.
|
||||
> Mods are automatically updated and generated by the bot. If your mod is not approved, you will receive a message with the reason why it was not approved.
|
||||
|
|
|
|||
|
|
@ -1,16 +1,16 @@
|
|||
---
|
||||
title: Information about Themes Store ℹ️
|
||||
lastmod: 2024-09-19
|
||||
title: Information about Mods Registry ℹ️
|
||||
lastmod: 2025-02-07
|
||||
---
|
||||
|
||||
The Themes Store is a place where you can find and install themes for Zen Browser.
|
||||
The Mods Registry is a place where you can find and install mods for Zen Browser.
|
||||
|
||||
## How to install a theme
|
||||
## How to install a mod
|
||||
|
||||
1. Open Zen Browser.
|
||||
2. Click on the theme you would like to install on the [Themes Store](https://www.zen-browser.app/themes).
|
||||
2. Click on the mod you would like to install on the [Mods Registry](https://www.zen-browser.app/mods).
|
||||
3. Click on the "Install" button.
|
||||
|
||||
## For theme developers
|
||||
## For mod developers
|
||||
|
||||
If you are a theme developer and would like to submit your theme, please follow the instructions on the [Submission Guidelines](themes-store/themes-marketplace-submission-guidelines.md) page.
|
||||
If you are a mod developer and would like to submit your mod, please follow the instructions on the [Submission Guidelines](themes-store/themes-marketplace-submission-guidelines.md) page.
|
||||
|
|
|
|||
25
content/user-manual/urlbar/index.md
Normal file
25
content/user-manual/urlbar/index.md
Normal file
|
|
@ -0,0 +1,25 @@
|
|||
---
|
||||
title: Zen URL bar
|
||||
aliases:
|
||||
- URL bar
|
||||
---
|
||||
|
||||
<div align="center">
|
||||
<video width="100%" loop autoplay>
|
||||
<source src="/assets/user-manual/urlbar/vid.mov" type="video/mp4">
|
||||
Your browser does not support the video tag.
|
||||
</video>
|
||||
</div>
|
||||
|
||||
## Zen URL bar
|
||||
|
||||
Zen Browser’s **URL bar** is a powerful tool that helps you navigate the web quickly and efficiently. There's no need to open a new tab or window to search the web—simply type your query into the URL bar and hit Enter to search. The URL bar also supports direct navigation to websites, so you can type a URL and press Enter to visit the site directly.
|
||||
|
||||
* Can be disabled in settings or `about:config` (`zen.urlbar.replace-newtab`)
|
||||
|
||||
### How does it work?
|
||||
|
||||
* When trying to open a new tab, the search bar will appear. This allows you to navigate faster and more efficiently by being able to type out the address or getting auto-completed without having a change in the view.
|
||||
* If the newtab urlbar is closed but you've typed something. The text is remembered unless the URL or tab has been changed.
|
||||
* Otherwise, the functionality is basically the same as before, only when focusing the urlbar either by clicking on with the shortcut
|
||||
|
||||
|
|
@ -1,54 +0,0 @@
|
|||
---
|
||||
title: Welcome to Zen!
|
||||
aliases:
|
||||
- Welcome ✨
|
||||
description: Welcome to zen, this is a quick guide of common features people commonly miss out!
|
||||
lastmod: 2024-12-18
|
||||
---
|
||||
# Welcome to Zen!
|
||||
|
||||
If you've recently updated Zen after a significant version jump, I recommend creating a new profile. You can do this by clicking the button in the bottom-left corner and selecting the option to create a new profile.
|
||||
|
||||
## Cool New Improvements in Zen:
|
||||
|
||||
## Better Themes:
|
||||
|
||||
<div align="center">
|
||||
<img src="/assets/welcome/image.png" />
|
||||
</div>
|
||||
|
||||
You can change the gradient by right-clicking on the sidebar and clicking ”Change Theme Colors.” You can also add custom colors via hex codes or other color formats.
|
||||
|
||||
[Zen Gradients](https://youtu.be/a3p7tWeK4io)
|
||||
|
||||
## Zen Glance:
|
||||
|
||||
<div align="center">
|
||||
<img src="/assets/welcome/image 1.png" />
|
||||
</div>
|
||||
|
||||
This opens links in a mini tab (this can be especially useful because you can open bookmarks from the top bar in Glance). If you want to swap the modifier key used to activate Glance you can go to settings under “Look and Feel”.
|
||||
|
||||
## New Tab Organization:
|
||||
|
||||
<div align="center">
|
||||
<img src="/assets/welcome/image 4.png" />
|
||||
</div>
|
||||
|
||||
There is now an option for the URL in the sidebar (We also made this work with Windows even). Tabs are now organized into 3 categories.
|
||||
|
||||
- Essentials (the square ones at the top)
|
||||
- Pinned (these are workspace specific)
|
||||
- Normal tabs (parenthesis cuz symmetry)
|
||||
|
||||
## Split View:
|
||||
|
||||
<div align="center">
|
||||
<img src="/assets/welcome/image 2.png" />
|
||||
</div>
|
||||
|
||||
Split view now has options for resizing the splits as well as rearranging split view items. You can split more than 20 tabs in one split view at a time (this is insane but Arc limited me to 4 even on a widescreen).
|
||||
|
||||
<div align="center">
|
||||
<img src="/assets/welcome/image 3.png" />
|
||||
</div>
|
||||
Loading…
Add table
Add a link
Reference in a new issue