diff --git a/docs/feedback.html b/docs/feedback.html index c676c184..f8754182 100644 --- a/docs/feedback.html +++ b/docs/feedback.html @@ -11,30 +11,53 @@ -
-
- Deutsch - Français - 简体中文 -
- +
+
+ Deutsch + Français + 简体中文 +
+ +
+

Feedback

+

+ Your feedback is more than welcome - new issues may be opened on + GitHub. +

+
+ +
diff --git a/docs/index.html b/docs/index.html index acde8f34..28959d0b 100644 --- a/docs/index.html +++ b/docs/index.html @@ -11,106 +11,137 @@ -
-

Remote Assistance Service

-
-

- Dayon! is an open-source and cross-platform (JAVA) solution that - allows watching and controlling a remote computer. In this sense, it - is very much similar to existing remote desktop solutions. -

- -

But I guess it's got some features that makes it valuable.

-

- You'll find more details on this page. -

+ + +
+
+ +
+
+
+
+ Deutsch + Français + 简体中文 +
+ +
+

Remote Assistance Service

+

- Since release 1.9 (Promiscuous Potato), a portable "quick launch" - version is available in addition to the conventional installation - program. There are two separate "quick launch" Windows binaries, one - for the assisted and one the assistant. They are called "quick - launch", because they allow the assisted or assistant part to be run - without prior installation (require the presence of an JRE, however). - They are 100% compatible with the conventional Dayon! Versions. - Since release 12 (Adorable Asteroid), similar portable versions are - available for Linux as well. -

- Due to the lack of Apple hardware, the clipboard transfer feature - could only be tested with Windows 10 and 11, Debian and Ubuntu - Feedback - from macOS users would be very welcome! + Dayon! is an open-source and cross-platform (JAVA) solution that + allows watching and controlling a remote computer. In this sense, it + is very much similar to existing remote desktop solutions.

-

Rational

+

But I guess it's got some features that makes it valuable.

- Marc Polizzi has developed Dayon! when he was living in the - Philippines and was communicating with his family and friends back in - Europe over Skype. + You'll find more details on this page.

+
+

Features

+
+

Check mark Easy Setup

- He didn't want them to set up their firewall and DSL/cable router and NAT - and whatever else required for him to access their computer over a remote - desktop connection. So he decided to implement something very simple in - his spare time while also considering a low-bandwidth, high-latency network. + Dayon! is dedicated to people who are quite new in the computer + world. There's no need to set up the network (i.e., no firewall + setup, no router configuration, no NAT setup) on their computer. + Dayon! is acting there as a client connecting to the monitoring + computer.

+

Check mark Low Network Bandwidth

- Several years later, I found this program on - Sourceforge - when I was looking for free cross-platform remote assistance solution. - While using Dayon! to assist users running Windows 7 and later, I - realised that it had some serious flaws. As the latest version (1.2) - has been released back in early 2009, I decided to contact the author. - With his consent I moved the source code of the project over to - GitHub - in late 2016 and took over the further development. + Dayon! is sending compressed and cached gray (up to 256 levels) + pictures to minimize the network usage offering as much as possible + a real-time experience over the Internet. Those pictures are far + enough for monitoring and explaining the different menus, icons and + discovering the computer setup, etc...

+
-

- I updated the used libs to newer versions, did some refactoring on the - code, fixed some issues and created a new installer for the Windows - platform. Since version 1.4, the communication between the assistant - and the assisted is encrypted. -

+

Status (13)

+

+ Since release 1.9 (Promiscuous Potato), a portable "quick launch" + version is available in addition to the conventional installation + program. There are two separate "quick launch" Windows binaries, one + for the assisted and one the assistant. They are called "quick + launch", because they allow the assisted or assistant part to be run + without prior installation (require the presence of an JRE, however). + They are 100% compatible with the conventional Dayon! Versions. + Since release 12 (Adorable Asteroid), similar portable versions are + available for Linux as well. +

+ Due to the lack of Apple hardware, the clipboard transfer feature + could only be tested with Windows 10 and 11, Debian and Ubuntu - Feedback + from macOS users would be very welcome! +

-

- By the way, Dayon! means "Come in!" in Visayas - a local Philippine dialect. -

-

License

-

- This program is a free software licensed under the - GPL license. - - Dayon! (active) Reviews - -

-
+

Rational

+

+ Marc Polizzi has developed Dayon! when he was living in the + Philippines and was communicating with his family and friends back in + Europe over Skype. +

+ +

+ He didn't want them to set up their firewall, DSL/cable router and NAT + and whatever else required for him to access their computer over a remote + desktop connection. So he decided to implement something very simple in + his spare time while also considering a low-bandwidth, high-latency network. +

+ +

+ Several years later, I found this program on + Sourceforge + when I was looking for free cross-platform remote assistance solution. + While using Dayon! to assist users running Windows 7 and later, I + realised that it had some serious flaws. As the latest version (1.2) + has been released back in early 2009, I decided to contact the author. + With his consent I moved the source code of the project to + GitHub + in late 2016 and took over the further development. +

- +

+ By the way, Dayon! means "Come in!" in Visayas - a local Philippine dialect. +

+

License

+

+ This program is a free software licensed under the + GPL license. + + Dayon! (active) Reviews + +

+ +
diff --git a/docs/privacy.html b/docs/privacy.html index 2220c79f..1ed13308 100644 --- a/docs/privacy.html +++ b/docs/privacy.html @@ -11,33 +11,56 @@ -
-
- Deutsch - Français - 简体中文 -
- +
+
+ Deutsch + Français + 简体中文 +
+ +
+

Privacy policy

+

+ Dayon! is an absolutely free open source program. +

- +

+ Personal data is neither collected, transmitted, nor evaluated. +

+ +
diff --git a/docs/quickstart.html b/docs/quickstart.html index 119e3d2f..d0613228 100644 --- a/docs/quickstart.html +++ b/docs/quickstart.html @@ -1,6 +1,6 @@ - + @@ -9,364 +9,391 @@ Dayon! - Remote assistance for your family and friends - - -
+ + + + +
+
+ +
+
+
- Deutsch - Français - 简体中文 + Deutsch + Français + 简体中文
-

Quick Start

-

- Typically, the assistant is communicating with the assisted using Skype, the phone, - their favorite IM, or whatever tool they like. Then starting Dayon! allows for watching live the - assisted computer screen. -

- -

- In this documentation, the screenshot show the English localisation of the app. - The application itself is also completely localised in French, German, Spanish and Russian. - It will fall back to English, if the configured user language is none of the above. -

- -

- Attention: This documentation refers to the most recent program version. -
-
-

- -

- Assisted   - Setup the Assisted Computer -

- -

- Dayon! Assisted is acting as a client application calling the outside - world and as such there's no network configuration to setup. -

- -

- Download and install the Dayon! application. Then start the Dayon! - application (you should have a shortcut on the desktop) and click the "play" button. -

- -

- Dayon! Assisted : Ready -

- -

- Enter the token communicated by the assistant and acknowledge with OK: -
-

- -

- Dayon! Assisted : Token -
- (if you have already connected to this assistant recently, then you can leave the field empty) -

- -

- Alternative variant (connect without token): - Enter both the IP address and the port number as communicated by the assistant confirm with OK: -
-

- -

- Dayon! Assisted : Network -
- (both input fields can be cleared by double-clicking them) -

- -

- You'll then be shortly connected to the assistant that is monitoring your screen. Enjoy! -
-
-

- -

- Assistant   - Setup the Assistant Computer -

- -

- Dayon! Assistant is acting as a typical server application (the assisted is going to connect to) and as such you've to configure your network - to make it visible from the outside world.

- By default, the server listens to Port 8080, but you can change this if necessary. - Since version 12, Dayon! creates a corresponding port forwarding rule independently. The prerequisite for this is that UPnP is activated. - Otherwise, it will still be necessary to forward the port (TCP) via NAT on the router to the corresponding computer. -

- Check out portforward.com for a step-by-step guide for the most common router models. -

- -

- Optional: Adjust port for incoming connections: (on the left with UPnP, on the right without) -

- -

- Dayon! Assistant: Network Settings with UPnP - Dayon! Assistant: Network Settings without UPnP -

- -

- Generate an access token by clicking on the key: -

- -

- Dayon! Assistant: Create Token -

- -

- Copy the generated access token to the clipboard with a click of the - mouse: -

- -

- Dayon! Assistant: Copy Token -

- -

- That's it - communicate this Token to the assisted via mail, IM or phone. -

- -

- For the impatient: Here you'll learn, how to make the - assistant listening for incoming connections. -

- -

- Alternative variant (connect without token): You've to determine which - IP address you want to give to the assisted to connect to the - assistant; you should typically give your public IP address. - But for testing within your local network you might want to use a different one. You can retrieve your - public IP address with the following menu: -

- -

- Dayon! Assistant: Network IP Addresses -

- -

- As you can see on the following picture, the menu contains an item to copy to the clipboard the actual - IP Address & Port Number. It is then easy to paste it into a chat session - (e.g., Skype) or into an email. -

- -

- Dayon! Assistant: Network IP Address Actions -

- -

- - Note that this IP address is not required by the assistant application as it is listening on all the - available network interfaces; but you need to communicate it to the assisted. (more on this later). - -

- -

- That's it regarding the network configuration; -
- For the impatient: Here you'll learn, how to make the - assistant listening for incoming connections. -

- -

- But let's first find out about the advanced configuration options. -
-
-

- -

- Assistant -   More on the Assistant Setup -

- -

- Use that form to setup how the assisted screen is going to be captured; you can - configure the time (in milliseconds) between two captures (aka. tick) as well as the number of gray levels. -

- -

- Dayon! Assistant: Capture Settings -

- -

- You can then setup the compression - method; two methods are available: ZIP and XZ. XZ will obtain a (much) - better compression ratio but requires more CPU and RAM as it's much - more complicated than ZIP and is implemented in JAVA (ZIP is being - implemented using some native code in the JDK). -

- -

- In addition, a cache - is used that allows for not sending many times the same bitmap as for - example when opening and navigating menus (i.e., what's under the - menus are not sent more than once). The screen is divided into many - tiles, each one being possibly cached. You've to define the maximum - number of tiles in the cache. Note that a tile is currently 32x32 - pixels of 256 levels, that is 1K. -

- -

- Dayon! Assistant : Compression Settings -

- -

- - That's about it. After a click on the play button (the first from left) the - assistant is ready to accept incoming connections: - -

- -

- Dayon! Assistant : Start -

- -

- Now you can ask the assisted to connect. You'll be shortly prompted to accept the incoming - connection: -

- -

- Dayon! Assistant : Incoming Connection -

- -

- You're now connected and monitoring the remote computer. -

- -

- Dayon! Assistant : Running -

- -

- If the desktop of the assisted doesn't fit into your window, it can be scaled down: -

- -

- Dayon! Assistent : Fit Screen Toggle -

- -

- By default, the remote control mode is off; you can switch it on and off using the - following icon: -

- -

- Dayon! Assistant : Control Toggle -

- -

-

Advanced functions

-

- Prerequisites: The following functions require an established connection to the assisted. -

- -

-

Clipboard transfer

-

- By clicking on the up- or down button, the clipboard of the assistant - can either be transferred to the assisted (up) or the clipboard of the - assisted to the assistant (down). -

- -

- Dayon! Assistent : Clipboard transfer -

- -

-

Currently supported are:

-
    -
  • - Text: Select text locally or in the assisted window, copy (Ctl + c), - click up or down. Subsequently, the transmitted text can be inserted in a local or remote application - (Ctrl + v). -
    • - -
  • - Files: Select one or more files locally or in the window of the - assisted person (Ctl + c), click up or down. Subsequently, the file(s) can be - inserted at the destination. -
    • -
+

Quick Start

+

+ Typically, the assistant is communicating with the assisted using Skype, the phone, + their favorite IM, or whatever tool they like. Then starting Dayon! allows for watching live the + assisted computer screen. +

+ +

+ In this documentation, the screenshot show the English localisation of the app. + The application itself is also completely localised in French, German, Spanish and Russian. + It will fall back to English, if the configured user language is none of the above. +

+ +

+ Attention: This documentation refers to the most recent program version. +
+
+

+ +

+ Assisted   + Setup the Assisted Computer +

+ +

+ Dayon! Assisted is acting as a client application calling the outside + world and as such there's no network configuration to setup. +

+ +

+ Download and install the Dayon! application. Then start the Dayon! + application (you should have a shortcut on the desktop) and click the "play" button. +

+ +

+ Dayon! Assisted : Ready +

+ +

+ Enter the token communicated by the assistant and acknowledge with OK: +
+

+ +

+ Dayon! Assisted : Token +
+ (if you have already connected to this assistant recently, then you can leave the field empty) +

-

- Caution: Depending on the display/windows manager and JDK combination, the - clipboard content does not get copied into the recipients clipboard. So pasting (Ctrl + v) - does have no effect. -
- In most cases the content is nonetheless transferred - take a look at the /tmp - directory and look for a uuid folder (something like 68abde33-dd0d-4527-ab5c-fe4bbbec4d42). - There you will find the transferred clipboard files. -

- -

-

Transmit a Windows key press

-

- To transmit the press of the Windows key, click the Windows symbol in the assistants control panel: -

- -

- Dayon! Assistent : Windows Key -

- -

- The key remains pressed until you click the symbol again. This allows you to send Windows key shortcuts. -
- If you need for example to minimize all windows on the assisted side, you would click the Windows - symbol, press the M key and then click the Windows symbol again. -

- -

-

Automatic connection of the assisted

-

Via command line parameters

-

- The host name or IP address and port of the assistant can be passed via command line parameters: +

+ Alternative variant (connect without token): + Enter both the IP address and the port number as communicated by the assistant confirm with OK: +
+

+ +

+ Dayon! Assisted : Network +
+ (both input fields can be cleared by double-clicking them) +

+ +

+ You'll then be shortly connected to the assistant that is monitoring your screen. Enjoy! +
+
+

+ +

+ Assistant   + Setup the Assistant Computer +

+ +

+ Dayon! Assistant is acting as a typical server application (the assisted is going to connect to) and as + such you've to configure your network + to make it visible from the outside world.

+ By default, the server listens to Port 8080, but you can change this if necessary. + Since version 12, Dayon! creates a corresponding port forwarding rule independently. The prerequisite for this + is that UPnP is activated. + Otherwise, it will still be necessary to forward the port (TCP) via NAT on the + router to the corresponding computer. +

+ Check out portforward.com for a step-by-step guide for the most + common router models. +

+ +

+ Optional: Adjust port for incoming connections: (on the left with UPnP, on the right without) +

+ +

+ Dayon! Assistant: Network Settings with UPnP + Dayon! Assistant: Network Settings without UPnP +

+ +

+ Generate an access token by clicking on the key: +

+ +

+ Dayon! Assistant: Create Token +

+ +

+ Copy the generated access token to the clipboard with a click of the + mouse: +

+ +

+ Dayon! Assistant: Copy Token +

+ +

+ That's it - communicate this Token to the assisted via mail, IM or phone. +

+ +

+ For the impatient: Here you'll learn, how to make the + assistant listening for incoming connections. +

+ +

+ Alternative variant (connect without token): You've to determine which + IP address you want to give to the assisted to connect to the + assistant; you should typically give your public IP address. + But for testing within your local network you might want to use a different one. You can retrieve your + public IP address with the following menu: +

+ +

+ Dayon! Assistant: Network IP Addresses +

+ +

+ As you can see on the following picture, the menu contains an item to copy to the clipboard the actual + IP Address & Port Number. It is then easy to paste it into a chat session + (e.g., Skype) or into an email. +

+ +

+ Dayon! Assistant: Network IP Address Actions +

+ +

+ + Note that this IP address is not required by the assistant application as it is listening on all the + available network interfaces; but you need to communicate it to the assisted. (more on this later). + +

+ +

+ That's it regarding the network configuration; +
+ For the impatient: Here you'll learn, how to make the + assistant listening for incoming connections. +

+ +

+ But let's first find out about the advanced configuration options. +
+
+

+ +

+ Assistant +   More on the Assistant Setup +

+ +

+ Use that form to setup how the assisted screen is going to be captured; you can + configure the time (in milliseconds) between two captures (aka. tick) as well as the number of gray levels. +

+ +

+ Dayon! Assistant: Capture Settings +

+ +

+ You can then setup the compression + method; two methods are available: ZIP and XZ. XZ will obtain a (much) + better compression ratio but requires more CPU and RAM as it's much + more complicated than ZIP and is implemented in JAVA (ZIP is being + implemented using some native code in the JDK). +

+ +

+ In addition, a cache + is used that allows for not sending many times the same bitmap as for + example when opening and navigating menus (i.e., what's under the + menus are not sent more than once). The screen is divided into many + tiles, each one being possibly cached. You've to define the maximum + number of tiles in the cache. Note that a tile is currently 32x32 + pixels of 256 levels, that is 1K. +

+ +

+ Dayon! Assistant : Compression Settings +

+ +

+ + That's about it. After a click on the play button (the first from left) the + assistant is ready to accept incoming connections: + +

+ +

+ Dayon! Assistant : Start +

+ +

+ Now you can ask the assisted to connect. You'll be shortly prompted to accept the incoming + connection: +

+ +

+ Dayon! Assistant : Incoming Connection +

+ +

+ You're now connected and monitoring the remote computer. +

+ +

+ Dayon! Assistant : Running +

+ +

+ If the desktop of the assisted doesn't fit into your window, it can be scaled down: +

+ +

+ Dayon! Assistent : Fit Screen Toggle +

+ +

+ By default, the remote control mode is off; you can switch it on and off using the + following icon: +

+ +

+ Dayon! Assistant : Control Toggle +

+ +

+

Advanced functions

+

+ Prerequisites: The following functions require an established connection to the assisted. +

+ +

+

Clipboard transfer

+

+ By clicking on the up- or down button, the clipboard of the assistant + can either be transferred to the assisted (up) or the clipboard of the + assisted to the assistant (down). +

+ +

+ Dayon! Assistent : Clipboard transfer +

+ +

+

Currently supported are:

+
    +
  • + Text: Select text locally or in the assisted window, copy (Ctl + c), + click up or down. Subsequently, the transmitted text can be inserted in a local or remote application + (Ctrl + v). +
    • + +
  • + Files: Select one or more files locally or in the window of the + assisted person (Ctl + c), click up or down. Subsequently, the file(s) can be + inserted at the destination. +
    • +
+ +

+ Caution: Depending on the display/windows manager and JDK combination, the + clipboard content does not get copied into the recipients' clipboard. So pasting (Ctrl + v) + does have no effect. +
+ In most cases the content is nonetheless transferred - take a look at the /tmp + directory and look for a uuid folder (something like 68abde33-dd0d-4527-ab5c-fe4bbbec4d42). + There you will find the transferred clipboard files. +

+ +

+

Transmit a Windows key press

+

+ To transmit the press of the Windows key, click the Windows symbol in the assistants control panel: +

+ +

+ Dayon! Assistent : Windows Key +

+ +

+ The key remains pressed until you click the symbol again. This allows you to send Windows key shortcuts. +
+ If you need for example to minimize all windows on the assisted side, you would click the Windows + symbol, press the M key and then click the Windows symbol again. +

+ +

+

Automatic connection of the assisted

+

Via command line parameters

+

+ The host name or IP address and port of the assistant can be passed via command line parameters:

    -
  • dayon_assisted.sh ah=example.com ap=4242 (Linux/macOS)
    • -
  • dayon.assisted ah=example.com ap=4242 (Linux Snap)
    • -
  • ./assisted.sh ah=example.com ap=4242 (Linux Quick Launch)
    • -
  • java -jar dayon.jar ah=example.com ap=4242 (Windows/Linux/macOS)
    • -
  • assisted.exe ah=example.com ap=4242 (Windows Quick Launch)
    • +
  • dayon_assisted.sh ah=example.com ap=4242 (Linux/macOS)
    • +
  • dayon.assisted ah=example.com ap=4242 (Linux Snap)
    • +
  • ./assisted.sh ah=example.com ap=4242 (Linux Quick Launch)
    • +
  • java -jar dayon.jar ah=example.com ap=4242 (Windows/Linux/macOS)
    • +
  • assisted.exe ah=example.com ap=4242 (Windows Quick Launch)
- If the assistant is started with these parameters, then he connects directly to the given host without - further inquiry. -

+ If the assistant is started with these parameters, then he connects directly to the given host without + further inquiry. +

-

Via configuration file

-

- Since version v11.0.5, the connection parameters can be stored in a YAML file. - The structure is extremely simple: -

+

Via configuration file

+

+ Since version v11.0.5, the connection parameters can be stored in a YAML file. + The structure is extremely simple: +

- 
+      
 host: an.example.com
 port: 8080

-        This file can be saved under the name assisted.yaml either in the
-        Dayon! home directory, in the user directory, or in the same directory as the .jar, resp.
-        .exe file. This order also corresponds to the priority with which they are taken into account
-        in the case of multiple configurations exist. (first one wins)
-        

-        To prevent the assisted from automatically connecting right after the start,
-        assisted.yaml the following line can be added:
-        
autoConnect: false

-        

-            That's all folks! You can find more information on the support page.
-        

+      This file can be saved under the name assisted.yaml either in the
+      Dayon! home directory, in the user directory, or in the same directory as the .jar, resp.
+      .exe file. This order also corresponds to the priority with which they are taken into account
+      in the case of multiple configurations exist. (first one wins)
+      

+      To prevent the assisted from automatically connecting right after the start,
+      assisted.yaml the following line can be added:
+      
autoConnect: false

+      

+        That's all folks! You can find more information on the support page.
+
- -
- +
+ diff --git a/docs/style.css b/docs/style.css index 1ed89b57..6b3e6f56 100644 --- a/docs/style.css +++ b/docs/style.css @@ -1,114 +1,225 @@ body { - font:12px/20px Verdana, Arial, Helvetica, sans-serif; - text-align:center; - padding: 0; - margin: 0; + font:12px/20px Verdana, Arial, Helvetica, sans-serif; + text-align:center; + padding: 0; + margin: 0; } img { - border:none; + border:none; } #container { - text-align:left; - margin:0 auto; - width:75%; + text-align:left; + margin:0 auto; + width:75%; } #top { - height:130px; - padding-bottom:1.0em; - background:url('dayon.png') no-repeat left; - text-align:right; + height:130px; + padding-bottom:1.0em; + background:url('dayon.png') no-repeat left; + text-align:right; } #top img { - margin:16px 0 0 4px; -} + margin:16px 0 0 4px; +} #menu { - text-align:center; + text-align:center; } #menu a, #menu a:visited { - border-left:1px solid #ccc; - font-size:150%; - padding:0 0.5em; - text-decoration:none; - color:#666; + border-left:1px solid #ccc; + font-size:150%; + padding:0 0.5em; + text-decoration:none; + color:#666; } #menu a:last-child { - border-right:1px solid #ccc; + border-right:1px solid #ccc; } #menu a:hover { - color:#307fe1; + color:#307fe1; } #content { - padding-top:1.0em; + padding-top:1.0em; } #content ul { - list-style-image:url('bullet.gif'); + list-style-image:url('bullet.gif'); } #content a:link, #content a:visited { - text-decoration:none; - color:#307fe1; + text-decoration:none; + color:#307fe1; } #content a:hover { - color:#307fe1; - text-decoration:underline; + color:#307fe1; + text-decoration:underline; } #content h2 { - font-size:150%; + font-size:150%; } #content h3 { - font-size:120%; + font-size:120%; } #content h4 { - font-size:110%; + font-size:110%; } #intro { - min-height:120px; - background:url('intro.png') no-repeat 5px 5px; + min-height:120px; + background:url('intro.png') no-repeat 5px 5px; } #intro p { - margin-left:220px; - font-size:130%; + margin-left:220px; + font-size:130%; } #features { - border:1px dashed #666; - border-radius:4px; - background-color:#f2f7fb; - padding:0 10px; + border:1px dashed #666; + border-radius:4px; + background-color:#f2f7fb; + padding:0 10px; } #footer { - padding:2.0em 0; - text-align:center; + padding:2.0em 0; + text-align:center; } .red { - color:red; + color:red; } pre, code { - font-weight:bolder; + font-weight:bolder; } .no, .no * { - text-decoration:none !important; - color:#000 !important; -}} \ No newline at end of file + text-decoration:none !important; + color:#000 !important; +} + +h1 { + text-align: center; + letter-spacing: 1px; + word-spacing: 0.15em; + font-size: 3em; + line-height: 1.4; + transform: translateY(52%); +} + +#toggle { + display: none; +} + +.hamburger { + position: absolute; + top: 4.8em; + right: 5%; + margin-left: -2em; + margin-top: -45px; + width: 2em; + height: 45px; + z-index: 5; +} + +.hamburger div { + position: relative; + width: 3em; + height: 7px; + border-radius: 3px; + background-color: #ccc; + margin-top: 8px; + transition: all 0.3s ease-in-out; +} + +.nav { + position: fixed; + width: 100%; + height: 100%; + background-color: #222; + top: -100%; left: 0; right: 0; bottom: 0; + overflow: hidden; + transition: all 0.3s ease-in-out; + transform: scale(0); +} + +.nav-wrapper { + position: relative; + overflow: hidden; + overflow-y: auto; + height: 100%; +} + +nav { + text-align: left; + margin-left: 5%; +} + +nav .ls a { + margin-top: 22px; + margin-right: 10%; +} + +nav a { + position: relative; + text-decoration: none; + color: #ddd; + font-size: 2em; + display: inline-block; + margin-top: 1.25em; + transition: color 0.2s ease-in-out; + letter-spacing: 1px; +} + +nav a:before { + content: ''; + height: 0; + position: absolute; + width: 0.25em; + background-color: #fff; + left: -0.5em; + transition: all 0.2s ease-in-out; +} + +nav a:hover { + color: white; +} + +nav a:hover:before { + height: 100%; +} + +#toggle:checked + .hamburger .top-bun { + transform: rotate(-45deg); + margin-top: 25px; +} + +#toggle:checked + .hamburger .bottom-bun { + opacity: 0; + transform: rotate(45deg); +} + +#toggle:checked + .hamburger .meat { + transform: rotate(45deg); + margin-top: -7px; +} + +#toggle:checked + .hamburger + .nav { + top: 0; + transform: scale(1); +} \ No newline at end of file diff --git a/docs/support.html b/docs/support.html index 3e8ef154..240d0702 100644 --- a/docs/support.html +++ b/docs/support.html @@ -11,121 +11,146 @@ -
-
- Deutsch - Français - 简体中文 -
-