Skip to content

New README #123

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.

Sign up for GitHub

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

Open
snshn wants to merge 8 commits into
base: main
Choose a base branch
from
Open

New README #123

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
8 commits
Select commit Hold shift + click to select a range
02779e4
add transparency screenshot + its thumbnail
Dec 7, 2022
c8d885e
ignore modifications made to assets/
Dec 7, 2022
b1a023a
add feature image to README (transparency)
Dec 7, 2022
623971a
make README easier to digest
Dec 7, 2022
038b636
move keyboard shortcuts information into separate document
Dec 7, 2022
c3656f1
align all text to be on the left side of the containing table
Dec 7, 2022
a45f094
move sections of README under docs/
Dec 7, 2022
d096cdc
improve some text
Dec 7, 2022
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
1 change: 1 addition & 0 deletions .github/workflows/ci.yml
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -4,6 +4,7 @@ on:
pull_request:
branches: [ main ]
paths-ignore:
- 'assets/'
- 'dist/'
- 'docs/'
- 'sample-apps/'
Expand Down
103 changes: 13 additions & 90 deletions README.md
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -3,97 +3,20 @@
Liquid is a tool that turns web pages into desktop applications.


## How it works
## Features

Liquid is capable of making websites appear and behave more like native OS applications: isolated, customizable, and running as separate system processes.
| | Transparent websites |
|:-|:-:|
| Liquid is capable of making websites appear semi-opaque, utilizing 32 bits of depth instead of typical 24.<br>Not only this increases the amount of information on the screen, it literally adds one more creative dimension to web design, giving a glance at how the web will visually transform after mass adoption of transparent OLED screens. | [![Transparency snapshot](assets/images/transparency-square.png)](assets/images/transparency.png) |

You’ll be able to:
- encapsulate websites the way virtual machines and Docker do it for operating systems
- safely and securely utilize different browsing identities
- remain safe from being tracked by third-party websites
- make sure you stay within specific domain range
| Full control and complete isolation | |
|:-:|:-|
| [![Transparency snapshot](assets/images/transparency-square.png)](assets/images/transparency.png) | Inspired by software such as Docker and Virtual Box, Liquid app windows behave a lot like separate mobile device emulators rather than browser windows, providing full control over the encapsulated website, preventing it from accessing or performing actions without user's permission.<br>Those can be things such as: accessing unwanted network resources, entering full-screen mode, displaying desktop notifications, opening pop-up windows, playing sounds, using third-party cookies, etc.<br>Long story short, it puts the user back in control over what happens to their data and what actions the website is capable of performing. |

What gets stored (if allowed): cookies.
| | Next-generation snapshots |
|:-|:-:|
| PNG snapshots of Liquid apps that feature semi-opaque background will retain their transparency when saved to disk.<br>Additionally, support for vector (SVG) snapshots is another great feature that will ensure impeccable quality of the saved visual representation of the page.<br>Both raster and vector snapshots can be made in viewport and full-page modes. | [![Transparency snapshot](assets/images/transparency-square.png)](assets/images/transparency.png) |


## Comparison table

| Feature | :ocean: Liquid | :earth_africa: Browsers | Notes |
|:-------------------------------------------------|:--------------:|:-------------------------------------:|:----------------------------------|
| Custom User-Agent string | ✅ | ✅ | Some browsers require a plug-in |
| Window transparency | ✅ | ❌ | See-through websites |
| Full-page snapshots | ✅ | ❌ | Possible with plug-ins |
| Transparent snapshots | ✅ | ❌ | See-through snapshots of websites |
| Vector snapshots | ❌ | ❌ | Experimental feature, SVG |
| Ability to save pages as monolithic HTML files | ❌ | ❌ | Possible with plug-ins |
| Complete absence of pop-up windows | ✅ | ❌ | Can be optionally disabled in most browsers |
| Ability to completely disable JS | ✅ | ✅ | |
| Ability to disable all cookies | ✅ | ✅ | |
| Ability to disable third-party cookies | ✅ | ✅ | |
| Ability to inject custom JS code into web pages | ✅ | ❌ | Possible with plug-ins |
| Support for HTTP basic authentication mechanism | ✅ | ✅ | |
| Ability to inject custom CSS code into web pages | ✅ | ❌ | Possible with plug-ins |
| Limit websites to stay within specific domain(s) | ✅ | ❌ | |
| Simultaneous usage of multiple user accounts | ✅ | ❌ | Can be achieved using profiles and extensions in some browsers |
| Per-website proxy settings | ✅ | ❌ | Possible with plug-ins |
| Ability to hide scroll bars | ✅ | ❌ | |
| Window geometry lock | ✅ | ❌ | Possible with plug-ins |
| Ability to remove window frame | ✅ | ❌ | |
| Minimalistic tabless design | ✅ | ❌ | |
| Fine zoom | ✅ | ❌ | |
| Search within the page | ❌ | ✅ | |
| Permanently mute website | ✅ | ❌ | Browsers automatically unmute, Liquid remembers the state |
| Ability to go full-screen | ✅ | ✅ | |
| Full control over full-screen capabilities | ✅ | ❌ | Liquid acts more like a mobile device simulator when it comes to full-screen |
| Mandatory off-the-record capabilities | ✅ | ❌ | |


## Keyboard shortcuts

| Action | Primary | Alternative |
|:------------------------------------------|:------------------:|:---------------------------------:|
| Zoom in | `Ctrl`+`=` | `Ctrl`+_mouse wheel up_ |
| Zoom out | `Ctrl`+`-` | `Ctrl`+_mouse wheel down_ |
| Fine zoom in | `Ctrl`+`Shift`+`=` | `Ctrl`+`Shift`+_mouse wheel up_ |
| Fine zoom out | `Ctrl`+`Shift`+`-` | `Ctrl`+`Shift`+_mouse wheel down_ |
| Reset zoom level | `Ctrl`+`0` | `Ctrl`+`Shift`+`0` |
| Toggle full-screen mode | `Ctrl`+`Shift`+`F` | `F11` |
| Stop loading / exit from full-screen mode | `Esc` | |
| Take snapshot | `Ctrl`+`T` | |
| Take full-page snapshot | `Ctrl`+`Shift`+`T` | |
| Toggle window size lock | `Ctrl`+`L` | |
| Toggle mute | `Ctrl`+`M` | |
| Refresh current page | `Ctrl`+`R` | |
| Reload app | `Ctrl`+`Shift`+`R` | |
| Close app | `Ctrl`+`Q` | `Ctrl`+`W` |
| Go back | `Ctrl`+`←` | `Backspace` |
| Go forward | `Ctrl`+`→` | |
| Open link using default web browser | `Ctrl`+_click_ | |


## Working with the codebase

#### Build

```console
qmake
make -j
```

#### Install

```console
sudo make install
```

#### Uninstall

```console
sudo make uninstall
```


## Customize

Placing a file named `liquid.qss` into `~/.config/liquid/` will serve as additional stylesheet for the program.
You can use [base.qss](res/styles/base.qss) as reference.
| Saving web page as single HTML file | |
|:-:|:-|
| [![Transparency snapshot](assets/images/transparency-square.png)](assets/images/transparency.png) | Alternatively to MHT and Webarchive formats found in some web browsers, Liquid is capable of saving web pages as monolithic HTML documents by utilizing data URLs, which makes it much easier to store, share, and edit those files. |
Binary file added assets/images/transparency-square.png
View file
Open in desktop
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added assets/images/transparency.png
View file
Open in desktop
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
20 changes: 20 additions & 0 deletions docs/Codebase.md
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,20 @@
# Codebase

## Build

```console
qmake
make -j
```

## Install

```console
sudo make install
```

## Uninstall

```console
sudo make uninstall
```
4 changes: 4 additions & 0 deletions docs/Customization.md
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,4 @@
# Customization

Placing a file named `liquid.qss` into `~/.config/liquid/` will serve as additional stylesheet for the program.
You can use [base.qss](res/styles/base.qss) as reference.
21 changes: 21 additions & 0 deletions docs/Keyboard Shortcuts.md
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,21 @@
# Keyboard shortcuts

| Action | Primary | Alternative |
|:------------------------------------------|:------------------:|:---------------------------------:|
| Zoom in | `Ctrl`+`=` | `Ctrl`+_mouse wheel up_ |
| Zoom out | `Ctrl`+`-` | `Ctrl`+_mouse wheel down_ |
| Fine zoom in | `Ctrl`+`Shift`+`=` | `Ctrl`+`Shift`+_mouse wheel up_ |
| Fine zoom out | `Ctrl`+`Shift`+`-` | `Ctrl`+`Shift`+_mouse wheel down_ |
| Reset zoom level | `Ctrl`+`0` | `Ctrl`+`Shift`+`0` |
| Toggle full-screen mode | `Ctrl`+`Shift`+`F` | `F11` |
| Stop loading / exit from full-screen mode | `Esc` | |
| Take snapshot | `Ctrl`+`T` | |
| Take full-page snapshot | `Ctrl`+`Shift`+`T` | |
| Toggle window size lock | `Ctrl`+`L` | |
| Toggle mute | `Ctrl`+`M` | |
| Refresh current page | `Ctrl`+`R` | |
| Reload app | `Ctrl`+`Shift`+`R` | |
| Close app | `Ctrl`+`Q` | `Ctrl`+`W` |
| Go back | `Ctrl`+`←` | `Backspace` |
| Go forward | `Ctrl`+`→` | |
| Open link using default web browser | `Ctrl`+_click_ | |