From 9e66c8f63ca179f113b0b189ffe7877660b0093b Mon Sep 17 00:00:00 2001
From: mxmehl <mail@mehl.mx>
Date: Thu, 9 Jul 2015 13:20:59 +0300
Subject: [PATCH] adapt design with better oversight for all items

---
 index.php | 60 ++++++++++++++++++++++++++++++-------------------------
 1 file changed, 33 insertions(+), 27 deletions(-)

diff --git a/index.php b/index.php
index 05061fd..f7a0b4b 100644
--- a/index.php
+++ b/index.php
@@ -10,25 +10,14 @@
   
 <h1>Account Administration Panel</h1>
 
-<p>You have following options:</p>
-<ul>
-  <li><a href="#adduser">Add an Email account</a></li>
-  <li><a href="#changepw">Change password of an Email account</a></li>
-  <li><a href="#listusers">List all Email accounts</a></li>
-  <li><a href="#sizeall">Show total sizes of all Email accounts</a></li>
-  <li><a href="#sizeuser">Show size of every folder of a single Email account</a></li>
-  <li><a href="#userdetail">Detailed info about a single Email account</a></li>
-  <li><a href="#deluser">Delete an Email account</a></li>
-</ul>
-<hr />
-<hr />
+<h4>You have following options:</p>
 
 <div id="gallery">  
   
-  <!-- ADDUSER - Add a new Email account -->
-  <b class="switch"><span class="turn_on">Add</span><span class="turn_off">Add</span> an account</b>
+  <!-- ADDUSER - Add a new email account -->
+  <b class="switch"><span class="turn_on">&#187;</span><span class="turn_off">&#171;</span> Add a new email</b>
   <div class="hide">
-    <p>You can add a new Email account your primary and all other domains.<br />
+    <p>You can add a new email account your primary and all other domains.<br />
     Please do not add your domain, just everything in front of the @-symbol.</p>
     <form action="submit.php" method="post">
       <label>Username:</label>
@@ -42,9 +31,10 @@
     </form>
   </div> <!-- /hide -->
 
-  <!-- CHANGEPW - Change password of an Email account -->
-  <b class="switch"><span class="turn_on">Change</span><span class="turn_off">Change</span> password</b>
+  <!-- CHANGEPW - Change password of an email account -->
+  <b class="switch"><span class="turn_on">&#187;</span><span class="turn_off">&#171;</span> Change email password</b>
   <div class="hide">
+    <p>Enables you to change the email password of a single account.</p>
     <form action="submit.php" method="post">
       <label>Username:</label>
       <input name="user" title="User" />
@@ -57,10 +47,11 @@
     </form>
   </div> <!-- /hide -->
 
-  <!-- LISTUSERS - List all Email accounts -->
-  <b class="switch">List all Email users</b>
+  <!-- LISTUSERS - List all email accounts -->
+  <b class="switch"><span class="turn_on">&#187;</span><span class="turn_off">&#171;</span> List all email accounts</b>
   <div class="hide">
-    <p>Description</p>
+    <p>Shows all available email accounts on your webhost. 
+    You will be able to see the username and if it has a mailbox or is just a redirection.</p>
     <form action="submit.php" method="post">
       <button type="submit" name="action" value="listusers">List accounts</button>
       <!-- Hidden confirmation box -->
@@ -68,14 +59,22 @@
     </form>
   </div> <!-- /hide -->
 
-  <!-- SIZEALL - Show total sizes of all Email accounts -->
+  <!-- SIZEALL - Show total sizes of all email accounts -->
+  <b class="switch"><span class="turn_on">&#187;</span><span class="turn_off">&#171;</span> Show total account sizes</b>
+  <div class="hide">
+    <p>Shows total size of every active email account on your webhost.</p>
     <form action="submit.php" method="post">
       <button type="submit" name="action" value="sizeall">Show size</button>
       <!-- Hidden confirmation box -->
       <input type="hidden" name="sure" value="yes" />
     </form>
+  </div> <!-- /hide -->
 
-  <!-- SIZEUSER - Show size of every folder of a single Email account -->
+  <!-- SIZEUSER - Show size of every folder of a single email account -->
+  <b class="switch"><span class="turn_on">&#187;</span><span class="turn_off">&#171;</span> Show detailed account size</b>
+  <div class="hide">
+    <p>Shows size of every single folder in a single email account. 
+    Very useful to detect folders which use up all your space.</p>
     <form action="submit.php" method="post">
       <label>Username:</label>
       <input name="user" title="User" />
@@ -84,8 +83,12 @@
       <!-- Hidden confirmation box -->
       <input type="hidden" name="sure" value="yes" />
     </form>
+  </div> <!-- /hide -->
 
-  <!-- USERDETAIL - Detailed info about a single Email account -->
+  <!-- USERDETAIL - Detailed info about a single email account -->
+  <b class="switch"><span class="turn_on">&#187;</span><span class="turn_off">&#171;</span> Show detailed account info</b>
+  <div class="hide">
+    <p>Show various information about a single email account.</p>
     <form action="submit.php" method="post">
       <label>Username:</label>
       <input name="user" title="User" />
@@ -94,11 +97,13 @@
       <!-- Hidden confirmation box -->
       <input type="hidden" name="sure" value="yes" />
     </form>
+  </div> <!-- /hide -->
 
-  <!-- DELUSER - Delete an Email account -->
-    <p>Delete an Email account and all its emails.<br />
-    <warn>THIS OPERATION CANNOT BE UNDONE!<br />
-    ALL EMAILS OF THIS ACCOUNT WILL BE REMOVED!</warn></p>
+  <!-- DELUSER - Delete an email account -->
+  <b class="switch"><span class="turn_on">&#187;</span><span class="turn_off">&#171;</span></b>
+  <div class="hide">
+    <p>Deletes an email account and all its emails.<br />
+    <warn>THIS OPERATION CANNOT BE UNDONE! ALL EMAILS OF THIS ACCOUNT WILL BE REMOVED!</warn></p>
     <form action="submit.php" method="post">
       <label>Username:</label>
       <input name="user" title="User" />
@@ -108,6 +113,7 @@
       </label> 
       <button type="submit" name="action" value="deluser">Delete account</button>
     </form>
+  </div> <!-- /hide -->
 
 </div> <!-- /gallery -->