Clean up styling.

guacamole/src/main/webapp/admin.xhtml

@@ -84,10 +84,6 @@
 
         </div>
 
-        <div id="version-dialog">
-            Guacamole ${project.version}
-        </div>
-
         <script type="text/javascript" src="scripts/session.js"></script>
         <script type="text/javascript" src="scripts/guac-ui.js"></script>
         <script type="text/javascript" src="scripts/service.js"></script>

guacamole/src/main/webapp/index.xhtml

@@ -41,6 +41,10 @@
 
                     <form id="login-form" action="#" method="post">
 
+                        <div id="version">
+                            Guacamole ${project.version}
+                        </div>
+
                         <div id="login-fields">
                             <table>
                                 <tr>
@@ -57,7 +61,7 @@
                         </div>
 
                         <div id="buttons">
-                            <input type="submit" name="login" id="login" value="Login"/>
+                            <input type="submit" name="login" class="login" id="login" value="Login"/>
                         </div>
 
                     </form>
@@ -134,10 +138,6 @@
 
         </div>
 
-        <div id="version-dialog">
-            Guacamole ${project.version}
-        </div>
-
         <script type="text/javascript" src="scripts/service.js"></script>
         <script type="text/javascript" src="scripts/session.js"></script>
         <script type="text/javascript" src="scripts/history.js"></script>

guacamole/src/main/webapp/styles/login.css

@@ -93,50 +93,15 @@ div#login-dialog #buttons {
     text-align: right;
 }
 
-div#login-dialog #buttons input,
+input[type="submit"].login, button.login {
-div#logout-panel button {
 
-    background: #8A6;
+    background-image: url('../images/guacamole-logo-64.png');
-    border: 1px solid rgba(0, 0, 0, 0.4);
+    background-repeat: no-repeat;
-    -moz-border-radius: 0.6em;
+    background-size: 1.5em;
-    -webkit-border-radius: 0.6em;
+    background-position: 0.5em 0.25em;
-    -khtml-border-radius: 0.6em;
-    border-radius: 0.6em;
 
-    color: white;
+    padding-left: 2.5em;
-    text-shadow: -1px -1px rgba(0, 0, 0, 0.3);
-    font-weight: bold;
-    font-size: 1.125em;
 
-    box-shadow: inset -1px -1px 0.25em rgba(0, 0, 0, 0.25),
-                inset 1px 1px 0.25em rgba(255, 255, 255, 0.25),
-                -1px -1px 0.25em rgba(0, 0, 0, 0.25),
-                1px 1px 0.25em rgba(255, 255, 255, 0.25);
-    
-    padding: 0.35em;
-    padding-right: 1em;
-    padding-left: 1em;
-    min-width: 5em;
-
-}
-
-div#login-dialog #buttons input:hover,
-div#logout-panel button:hover {
-    background: #9C7;
-}
-
-div#login-dialog #buttons input:active,
-div#logout-panel button:active {
-
-    padding-left: 1.1em;
-    padding-right: 0.9em;
-    padding-top: 0.45em;
-    padding-bottom: 0.25em;
-    
-    box-shadow: 
-                inset 1px 1px 0.25em rgba(0, 0, 0, 0.25),
-                -1px -1px 0.25em rgba(0, 0, 0, 0.25),
-                1px 1px 0.25em rgba(255, 255, 255, 0.25);
 }
 
 div#login-dialog #login-fields {
@@ -144,12 +109,8 @@ div#login-dialog #login-fields {
     vertical-align: middle;
 
     padding: 1em;
-    background: #DDD;
+    border-top: 1px solid #999;
-    border: 1px solid #999;
+    border-bottom: 1px solid #999;
-    -moz-border-radius: 0.25em;
-    -webkit-border-radius: 0.25em;
-    -khtml-border-radius: 0.25em;
-    border-radius: 0.25em;
 
 }
 
@@ -175,12 +136,8 @@ div#login-dialog #login-fields img.logo {
     z-index: -1;
 }
 
-div#version-dialog {
+div#version {
-    position: fixed;
+    text-align: center;
-    right: 0;
-    bottom: 0;
-    text-align: right;
-
     font-style: italic;
     font-size: 0.75em;
     color: black;

guacamole/src/main/webapp/styles/ui.css

@@ -53,24 +53,24 @@ textarea {
     overflow: auto;
 }
 
-button {
+input[type="submit"], button {
+
+    background-color: #3C3C3C;
 
-    background: #8A6;
     border: 1px solid rgba(0, 0, 0, 0.4);
-    -moz-border-radius: 0.6em;
+    -moz-border-radius: 0.25em;
-    -webkit-border-radius: 0.6em;
+    -webkit-border-radius: 0.25em;
-    -khtml-border-radius: 0.6em;
+    -khtml-border-radius: 0.25em;
-    border-radius: 0.6em;
+    border-radius: 0.25em;
 
     color: white;
     text-shadow: -1px -1px rgba(0, 0, 0, 0.3);
-    font-weight: bold;
+    font-size: 1em;
-    font-size: 1.125em;
 
-    box-shadow: inset -1px -1px 0.25em rgba(0, 0, 0, 0.25),
+    box-shadow: inset -1px -1px 0.1em rgba(0, 0, 0, 0.25),
-                inset 1px 1px 0.25em rgba(255, 255, 255, 0.25),
+                inset 1px 1px 0.1em rgba(255, 255, 255, 0.25),
-                -1px -1px 0.25em rgba(0, 0, 0, 0.25),
+                -1px -1px 0.1em rgba(0, 0, 0, 0.25),
-                1px 1px 0.25em rgba(255, 255, 255, 0.25);
+                1px 1px 0.1em rgba(255, 255, 255, 0.25);
     
     padding: 0.35em;
     padding-right: 1em;
@@ -79,16 +79,13 @@ button {
 
 }
 
-button:hover {
+input[type="submit"]:hover, button:hover {
-    background: #9C7;
+    background-color: #5A5A5A;
 }
 
-button:active {
+input[type="submit"]:active, button:active {
 
-    padding-left: 1.1em;
+    background-color: #2C2C2C;
-    padding-right: 0.9em;
-    padding-top: 0.45em;
-    padding-bottom: 0.25em;
     
     box-shadow: 
                 inset 1px 1px 0.25em rgba(0, 0, 0, 0.25),
@@ -104,6 +101,10 @@ button.danger:hover {
     background: #C54;
 }
 
+button.danger:active {
+    background: #932;
+}
+
 body {
     background: #EEE;
     font-family: FreeSans, Helvetica, Arial, sans-serif;
@@ -116,20 +117,6 @@ img {
     vertical-align: middle;
 }
 
-div#version-dialog {
-    position: fixed;
-    right: 0;
-    bottom: 0;
-    text-align: right;
-
-    font-style: italic;
-    font-size: 0.75em;
-    color: black;
-    opacity: 0.5;
-
-    padding: 0.5em;
-}
-
 h1 {
     
     margin: 0;