Fixed document (#1395)

* Interface

Making Getting to know the interface

* Update _interface.md

* Update _interface.md

* Interface changes

Fixed interface changes per request

* Changed from Interface to webui

Per request, made a name change

* Fixed document

Too many changes to list

---------

Co-authored-by: Maxim Devaev <mdevaev@gmail.com>

docs/webui.md

@@ -1,35 +1,39 @@
-** GETTING TO KNOW THE INTERFACE **
+## GETTING TO KNOW THE INTERFACE
 
 After following the first steps document on setup, you will be presented with the following pages (Chrome is being used in the following examples)
 
 <img src="Page1.jpg" width="400" />
 
-1. Click Advanced
+Click Advanced
 
 <img src="Page2.jpg" width="400" />
 
-1. Click Proceed
+Click Proceed
 
-    Log into you PiKVM using the credentials from the frst_steps document
+!!! note "Credentials are found in the first steps document that is located to the left"
 
 <img src="Login.jpg" width="400" />
 
-1. This is where you fill in the login credentials, please be sure to review the first_steps document first.
+This is where you fill in the login credentials, please be sure to review the first steps document first.
 This is also where you configure the 2FA token
 
 <img src="Portal.jpg" width="400" />
 
-1. This is where your PiKVM name will go
-2. This is where you can access the display from the Target system
-3. You can open a web terminal and put in commands
+??? note "Please expand to see what each number represents"
+
+    1. This is where your PiKVM name will go - Please reference the first steps document on how to change this
+    2. This is where you can access the display for the Target system
+    3. You can open a web terminal and put in commands that you will find within these documents
     4. By default this will not show up till its activated, this will tell you the VNC address you need to use
     5. This is so you can logout of your PiKVM
     6. Please read carefully
     7. These are links to the PiKVM project, current documentation and support (Discord)
-8. NOT SHOWN, in the lower left of the KVM screen is some information that when you mouse over, will let you know what they are
+    8. **NOT SHOWN**, in the lower left of the KVM screen is some information that when you mouse over, will let you know what they are for
 
 <img src="Toolbar.jpg" />
 
+??? note "Please expand to see what each number represents"
+
     1. This is the system setting, more details will be shown below
     2. This is the interface to controlling the ATX, will ONLY work if wired up correctly
     3. This is part of the MSD and will show you what images/iso's are available
@@ -40,18 +44,27 @@ After following the first steps document on setup, you will be presented with th
 
 <img src="System.jpg" width="400" />
 
-!!! note
-    The following is self explanatory but will highlight the important parts
+!!! note "The following is self explanatory but will highlight the important parts"
 
+
+??? note "Please expand to see what each number represents"
     1. System Icons
+
         ETH Icon = PiKVM network connectivity
+
         Monitor Icon = Shows if the target is sending an active signal
+
         KeyBoard Icon = Shows if data for the KB is active, will likely show Orange/Green as data is passed and goes idle
+
         Mouse Icon = Same as above
     2. These are additional buttons for important acitivies
+
         Term = Can launch a quick Web Terminal along with the active KVM
+
         About = Shows everything About your PiKVM, including PiKVM Hardware and version
+
         Log = Shows the current log from your PiKVM
+
     3. ONLY for MJPEG mode
     4. ONLY for H.264 (WebRTC) mode
 
@@ -79,5 +92,5 @@ After following the first steps document on setup, you will be presented with th
 
 <img src="Shortcuts.jpg" width="400" />
 
-1. This shows the shortcuts for mostly Windows
+1. This is an expanded view and shows the shortcuts for mostly Windows