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 div#logout-panel button {
  79     background: #9A8;
  80     border: 1px solid #676;
  81     color: black;
  82     padding: 0.25em;
  83     padding-right: 1em;
  84     padding-left: 1em;
  85 }
  86
  87 div#login-dialog #buttons input:hover,
  88 div#logout-panel button:hover {
  89     background: #CDB;
  90     border: 1px solid #9A8;
  91 }
  92
  93 div#login-dialog #buttons input:active,
  94 div#logout-panel button:active {
  95     padding-top: 0.35em;
  96     padding-left: 1.1em;
  97
  98     padding-bottom: 0.15em;
  99     padding-right: 0.9em;
 100 }
 101
 102 div#login-dialog #login-fields {
 103
 104     background: #CDB;
 105     vertical-align: middle;
 106
 107     padding: 1em;
 108     border: 1px solid #676;
 109
 110 }
 111
 112 div#login-dialog #login-fields input {
 113     border: 1px solid #676;
 114 }
 115
 116 div#login-dialog #login-fields img.logo {
 117     float: left;
 118 }
 119
 120 div#version-dialog {
 121     position: fixed;
 122     right: 0;
 123     bottom: 0;
 124     text-align: right;
 125
 126     font-style: italic;
 127     font-size: 0.75em;
 128     color: black;
 129     opacity: 0.5;
 130
 131     padding: 0.25em;
 132 }
 133
 134 img {
 135     border: none;
 136 }
 137
 138 img#license {
 139     float: right;
 140     margin: 2px;
 141 }
 142
 143 div#connection-list-ui {
 144     background: #BCA;
 145 }
 146
 147 div#connection-list-ui table {
 148     width: 100%;
 149     border-collapse: collapse;
 150 }
 151
 152 div#connection-list-ui table thead {
 153     background: #9A8;
 154 }
 155
 156 div#connection-list-ui table thead th.protocol {
 157     width: 1em;
 158     padding: 0.5em;
 159 }
 160
 161 div#connection-list-ui table thead th.name {
 162     text-align: left;
 163     padding: 0.5em;
 164 }
 165
 166 div#connection-list-ui table thead tr {
 167     border-top:    1px solid #676;
 168     border-bottom: 1px solid gray;
 169 }
 170
 171 div#connection-list-ui table tbody {
 172     background: white;
 173 }
 174
 175 div#connection-list-ui table tbody tr {
 176     border-top:    1px solid gray;
 177     border-bottom: 1px solid gray;
 178 }
 179
 180 div#connection-list-ui table td {
 181     padding: 0.25em;
 182     text-align: center;
 183 }
 184
 185 div#connection-list-ui table td.name {
 186     text-align: left;
 187 }
 188
 189 div#connection-list-ui table tbody tr:nth-child(even) { background: #CCC; }
 190 div#connection-list-ui table tbody tr:nth-child(odd)  { background: #EEE; }
 191
 192 div#connection-list-ui table td.description {
 193     text-align: left;
 194 }
 195
 196 div#connection-list-ui h1 {
 197
 198     margin: 0;
 199     padding: 0.5em;
 200
 201     font-size: 2em;
 202     vertical-align: middle;
 203     text-align: center;
 204
 205 }
 206
 207 div#connection-list-ui img {
 208     vertical-align: middle;
 209 }
 210
 211 div#logout-panel {
 212     padding: 0.25em;
 213     text-align: right;
 214     float: right;
 215 }
 216
 217 div#connection-list-ui a[href] {
 218     text-decoration: none;
 219     color: blue;
 220 }
 221
 222 div#connection-list-ui a[href]:hover {
 223     text-decoration: underline;
 224 }
 225
 226 .protocol.icon {
 227     width: 24px;
 228     height: 24px;
 229     background-image: url('../images/protocol-icons/tango/video-display.png');
 230 }
 231
 232 .protocol.icon.ssh {
 233     background-image: url('../images/protocol-icons/tango/terminal.png');
 234 }
 235