src/main/webapp/styles/login.css

   1
   2 /*
   3  *  Guacamole - Clientless Remote Desktop
   4  *  Copyright (C) 2010  Michael Jumper
   5  *
   6  *  This program is free software: you can redistribute it and/or modify
   7  *  it under the terms of the GNU Affero General Public License as published by
   8  *  the Free Software Foundation, either version 3 of the License, or
   9  *  (at your option) any later version.
  10  *
  11  *  This program is distributed in the hope that it will be useful,
  12  *  but WITHOUT ANY WARRANTY; without even the implied warranty of
  13  *  MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
  14  *  GNU Affero General Public License for more details.
  15  *
  16  *  You should have received a copy of the GNU Affero General Public License
  17  *  along with this program.  If not, see <http://www.gnu.org/licenses/>.
  18  */
  19
  20 body {
  21     background: gray;
  22     font-family: sans-serif;
  23     padding: 0;
  24     margin: 0;
  25 }
  26
  27 div#login-ui {
  28     background: #BCA;
  29     height: 100%;
  30     width: 100%;
  31     position: fixed;
  32     left: 0;
  33     top: 0;
  34     display: table;
  35 }
  36
  37 p#login-error {
  38     text-align: center;
  39     background: #FDD;
  40     color: red;
  41     margin: 0.2em;
  42 }
  43
  44 div#login-logo {
  45     position: relative;
  46     bottom: 0;
  47     display: inline-block;
  48     vertical-align: middle;
  49 }
  50
  51 div#login-dialog-middle {
  52     width: 100%;
  53     display: table-cell;
  54     vertical-align: middle;
  55     text-align: center;
  56 }
  57
  58 div#login-dialog {
  59
  60     max-width: 75%;
  61     text-align: left;
  62
  63     display: inline-block;
  64 }
  65
  66 div#login-dialog h1 {
  67     margin-top: 0;
  68     margin-bottom: 0em;
  69     text-align: center;
  70 }
  71
  72 div#login-dialog #buttons {
  73     padding-top: 0.5em;
  74     text-align: right;
  75 }
  76
  77 div#login-dialog #buttons input {
  78     background: #9A8;
  79     border: 1px solid #676;
  80     color: black;
  81     padding: 0.25em;
  82     padding-right: 1em;
  83     padding-left: 1em;
  84 }
  85
  86 div#login-dialog #buttons input:hover {
  87     background: #CDB;
  88     border: 1px solid #9A8;
  89 }
  90
  91 div#login-dialog #buttons input:active {
  92     padding-top: 0.35em;
  93     padding-left: 1.1em;
  94
  95     padding-bottom: 0.15em;
  96     padding-right: 0.9em;
  97 }
  98
  99 div#login-dialog #login-fields {
 100
 101     background: #CDB;
 102     vertical-align: middle;
 103
 104     padding: 1em;
 105     border: 1px solid #676;
 106
 107 }
 108
 109 div#login-dialog #login-fields input {
 110     border: 1px solid #676;
 111 }
 112
 113 div#login-dialog #login-fields img.logo {
 114     float: left;
 115 }
 116
 117 div#version-dialog {
 118     position: fixed;
 119     right: 0;
 120     bottom: 0;
 121     text-align: right;
 122
 123     font-style: italic;
 124     font-size: 0.75em;
 125     color: black;
 126     opacity: 0.5;
 127
 128     padding: 0.25em;
 129 }
 130
 131 img {
 132     border: none;
 133 }
 134
 135 img#license {
 136     float: right;
 137     margin: 2px;
 138 }
 139
 140 div#connection-list-ui {
 141     background: #BCA;
 142 }
 143
 144 div#connection-list-ui table {
 145     width: 100%;
 146     border-collapse: collapse;
 147 }
 148
 149 div#connection-list-ui table thead {
 150     background: #9A8;
 151 }
 152
 153 div#connection-list-ui table thead th.protocol {
 154     width: 1em;
 155     padding: 0.5em;
 156 }
 157
 158 div#connection-list-ui table thead th.name {
 159     text-align: left;
 160     padding: 0.5em;
 161 }
 162
 163 div#connection-list-ui table thead tr {
 164     border-top:    1px solid #676;
 165     border-bottom: 1px solid gray;
 166 }
 167
 168 div#connection-list-ui table tbody {
 169     background: white;
 170 }
 171
 172 div#connection-list-ui table tbody tr {
 173     border-top:    1px solid gray;
 174     border-bottom: 1px solid gray;
 175 }
 176
 177 div#connection-list-ui table td {
 178     padding: 0.25em;
 179     text-align: center;
 180 }
 181
 182 div#connection-list-ui table td.name {
 183     text-align: left;
 184 }
 185
 186 div#connection-list-ui table tbody tr:nth-child(even) { background: #CCC; }
 187 div#connection-list-ui table tbody tr:nth-child(odd)  { background: #EEE; }
 188
 189 div#connection-list-ui table td.description {
 190     text-align: left;
 191 }
 192
 193 div#connection-list-ui h1 {
 194
 195     margin: 0;
 196     padding: 0.5em;
 197
 198     font-size: 2em;
 199     vertical-align: middle;
 200     text-align: center;
 201
 202 }
 203
 204 div#connection-list-ui img {
 205     vertical-align: middle;
 206 }
 207
 208 div#logout-panel {
 209     padding: 0.25em;
 210     text-align: right;
 211     float: right;
 212 }
 213
 214 div#connection-list-ui a[href] {
 215     text-decoration: none;
 216     color: blue;
 217 }
 218
 219 div#connection-list-ui a[href]:hover {
 220     text-decoration: underline;
 221 }
 222
 223 .protocol.icon {
 224     width: 24px;
 225     height: 24px;
 226     background-image: url('../images/protocol-icons/tango/video-display.png');
 227 }
 228
 229 .protocol.icon.ssh {
 230     background-image: url('../images/protocol-icons/tango/terminal.png');
 231 }
 232