server/src/main/webapp/static/css/index.css
changeset 298 2f35c2ae7de8
parent 239 67c2b0fb9b19
child 305 4dc484119b4c
equal deleted inserted replaced
297:7de2652f7ee8 298:2f35c2ae7de8
     1 
     1 ::-moz-selection {
     2 ::-moz-selection { background: #a8d1ff; color: inherit; text-shadow: inherit;}
     2   background: #a8d1ff;
     3 ::selection { background: #a8d1ff; color: inherit; text-shadow: inherit;}
     3   color: inherit;
     4 
     4   text-shadow: inherit;
     5 body,html {
     5 }
     6 	height: 100%;
     6 
       
     7 ::selection {
       
     8   background: #a8d1ff;
       
     9   color: inherit;
       
    10   text-shadow: inherit;
       
    11 }
       
    12 
       
    13 body, html {
       
    14   height: 100%;
     7 }
    15 }
     8 
    16 
     9 body, h1, h2, table, tbody, thead, tr, td, th {
    17 body, h1, h2, table, tbody, thead, tr, td, th {
    10     border: none; margin: 0; padding: 0; text-align: left; font-size: 100%;
    18   border: none;
    11 }
    19   margin: 0;
       
    20   padding: 0;
       
    21   text-align: left;
       
    22   font-size: 100%;
       
    23 }
       
    24 
    12 body {
    25 body {
    13     margin: 0; padding: 0; font-family: Arial, Helvetica, sans-serif; background: #F6F6F6; color: #333333;
    26   margin: 0;
    14 }
    27   padding: 0;
       
    28   font-family: Arial, Helvetica, sans-serif;
       
    29   background: #F6F6F6;
       
    30   color: #333333;
       
    31 }
       
    32 
    15 h1 {
    33 h1 {
    16     margin-bottom: 5px; padding: 15px; background: #333333; color: #ffffff;
    34   margin-bottom: 5px;
    17     font-weight: bold; font-size: 30px;
    35   padding: 15px;
    18 }
    36   background: #333333;
       
    37   color: #ffffff;
       
    38   font-weight: bold;
       
    39   font-size: 30px;
       
    40 }
       
    41 
    19 h2 {
    42 h2 {
    20     margin: 12px 15px 2px;
    43   margin: 12px 15px 2px;
    21 }
    44 }
       
    45 
    22 h3 {
    46 h3 {
    23     color: #999999; font-size: 15px; font-weight: bold;
    47   color: #999999;
    24     font-style: italic; margin: 5px 30px;
    48   font-size: 15px;
    25 }
    49   font-weight: bold;
       
    50   font-style: italic;
       
    51   margin: 5px 30px;
       
    52 }
       
    53 
    26 a {
    54 a {
    27     text-decoration: none; color: #3030a0;
    55   text-decoration: none;
    28 }
    56   color: #3030a0;
       
    57 }
       
    58 
    29 a:hover {
    59 a:hover {
    30     text-decoration: underline;
    60   text-decoration: underline;
    31 }
    61 }
       
    62 
    32 table {
    63 table {
    33     border-collapse: collapse; margin: 5px 15px; border: 1px solid #CCCCCC;
    64   border-collapse: collapse;
    34 }
    65   margin: 5px 15px;
       
    66   border: 1px solid #CCCCCC;
       
    67 }
       
    68 
    35 th, td {
    69 th, td {
    36     padding: 4px 12px 4px 4px; border: 1px solid #cccccc;
    70   padding: 4px 12px 4px 4px;
    37 }
    71   border: 1px solid #cccccc;
       
    72 }
       
    73 
    38 thead {
    74 thead {
    39     font-size: 16px;
    75   font-size: 16px;
    40 }
    76 }
       
    77 
    41 tbody {
    78 tbody {
    42     font-size: 14px;
    79   font-size: 14px;
    43 }
    80 }
       
    81 
    44 tbody tr:nth-child(even) {
    82 tbody tr:nth-child(even) {
    45     background: #fafafa;
    83   background: #fafafa;
    46 }
    84 }
       
    85 
    47 tbody tr:nth-child(odd) {
    86 tbody tr:nth-child(odd) {
    48     background: #f0f0f0;
    87   background: #f0f0f0;
    49 }
    88 }
       
    89 
    50 thead tr {
    90 thead tr {
    51     background: #666666; color: #f0e0e0;
    91   background: #666666;
    52 }
    92   color: #f0e0e0;
       
    93 }
       
    94 
    53 tbody tr:hover {
    95 tbody tr:hover {
    54     background: #ffffff;
    96   background: #ffffff;
    55 }
    97 }
    56 
    98 
    57 .pagination-container {
    99 .pagination-container {
    58 	margin: 12px 15px 2px;
   100   margin: 12px 15px 2px;
    59 	font-size: 14px;
   101   font-size: 14px;
    60 }
   102 }
    61 
   103 
    62 .pagination-container a, .pagination-container span {
   104 .pagination-container a, .pagination-container span {
    63 	margin: 0 1px 0 1px;
   105   margin: 0 1px 0 1px;
    64 }
   106 }
    65 
   107 
    66 div#container {
   108 div#container {
    67     position:relative; /* needed for footer positioning*/
   109   position: relative; /* needed for footer positioning*/
    68     margin:0 auto; /* center, not in IE5 */
   110   margin: 0 auto; /* center, not in IE5 */
    69 
   111   height: auto !important; /* real browsers */
    70     height:auto !important; /* real browsers */
   112   height: 100%; /* IE6: treaded as min-height*/
    71     height:100%; /* IE6: treaded as min-height*/
   113   min-height: 100%; /* real browsers */
    72 
       
    73     min-height:100%; /* real browsers */
       
    74 }
   114 }
    75 
   115 
    76 div#wrapper {
   116 div#wrapper {
    77     padding-bottom: 1em; /* bottom padding for footer */
   117   padding-bottom: 1em; /* bottom padding for footer */
    78 }
   118 }
    79 
   119 
    80 header#header {
   120 header#header {
    81     border-bottom: 2px solid #ffffff; background: #333333; color: #ffffff;
   121   border-bottom: 2px solid #ffffff;
    82     font-weight: bold; font-size: 30px;
   122   background: #333333;
       
   123   color: #ffffff;
       
   124   font-weight: bold;
       
   125   font-size: 30px;
    83 }
   126 }
    84 
   127 
    85 header h1 {
   128 header h1 {
    86 	float:left;
   129   float: left;
    87 }
   130 }
    88 
   131 
    89 header #header-clear {
   132 header #header-clear {
    90 	clear: both;
   133   clear: both;
    91 }
   134 }
    92 
   135 
    93 header .header-nav {
   136 header .header-nav {
    94 	background: #333333; color: #ffffff;
   137   background: #333333;
    95 	float: right;
   138   color: #ffffff;
    96     font-weight: normal; font-size: 15px;
   139   float: right;
    97     margin-bottom: 5px; padding: 15px;
   140   font-weight: normal;
    98     text-align: right;
   141   font-size: 15px;
    99 }
   142   margin-bottom: 5px;
   100 
   143   padding: 15px;
   101 
   144   text-align: right;
   102 header .header-nav a, header .header-nav a:ACTIVE, header .header-nav a:LINK, header .header-nav a:VISITED {
   145 }
   103     color: #ffffff;
   146 
   104     text-decoration: none;
   147 header .header-nav a, header .header-nav a:ACTIVE, header .header-nav a:LINK,
       
   148   header .header-nav a:VISITED {
       
   149   color: #ffffff;
       
   150   text-decoration: none;
   105 }
   151 }
   106 
   152 
   107 header .header-nav a:HOVER {
   153 header .header-nav a:HOVER {
   108 	color: #ffffff;
   154   color: #ffffff;
   109 	text-decoration: underline;
   155   text-decoration: underline;
   110 }
   156 }
   111 
   157 
   112 #header-nav-user-avatar {
   158 #header-nav-user-avatar {
   113 	margin: 0 5px 2px 0;
   159   margin: 0 5px 2px 0;
   114 }
   160 }
   115 
   161 
   116 footer#footer {
   162 footer#footer {
   117     position:absolute;
   163   position: absolute;
   118     bottom:0;
   164   bottom: 0;
   119     width:100%;
   165   width: 100%;
   120     font-size: 12px;
   166   font-size: 12px;
   121 }
   167 }
   122  
   168 
   123 footer#footer div {
   169 footer#footer div {
   124      float:right;
   170   float: right;
   125      margin: 15px 10px 0 0;
   171   margin: 15px 10px 0 0;
   126 }
   172 }
   127 
   173 
   128 #home-link,#home-link:link,#home-link:hover,#home-link:active,#home-link:visited {
   174 #home-link, #home-link:link, #home-link:hover, #home-link:active,
   129 	text-decoration: none;
   175   #home-link:visited {
   130 	color: #ffffff;
   176   text-decoration: none;
   131 }
   177   color: #ffffff;
   132 
   178 }
   133 
   179 
   134 #inner {
   180 #inner {
   135    width: 300px;
   181   width: 350px;
   136    margin: 10px auto;
   182   height: 170px;
   137  }
   183   margin: 10px auto;
   138  
   184 }
   139  #button {
   185 
   140    margin: 0 auto;
   186 #button {
   141    border-radius: 3px;
   187   margin: 0 auto;
   142    text-align: center;
   188   border-radius: 3px;
   143    font: 36px verdana,arial,sans-serif;
   189   text-align: center;
   144    color: white;
   190   font: 36px verdana, arial, sans-serif;
   145    text-shadow: 0 -1px 0 rgba(0,0,0,.8);
   191   color: white;
   146    height: 70px;
   192   text-shadow: 0 -1px 0 rgba(0, 0, 0, .8);
   147    line-height: 70px;
   193   height: 70px;
   148    background: #555;
   194   line-height: 70px;
   149    background: -webkit-linear-gradient(#5F5F5F,#565656 50%,#4C4C4C 51%,#373737);
   195   background: #555;
   150    background: -moz-linear-gradient(#5F5F5F,#565656 50%,#4C4C4C 51%,#373737);
   196   background: -webkit-linear-gradient(#5F5F5F, #565656 50%, #4C4C4C 51%, #373737);
   151    background: -ms-linear-gradient(#5F5F5F,#565656 50%,#4C4C4C 51%,#373737);
   197   background: -moz-linear-gradient(#5F5F5F, #565656 50%, #4C4C4C 51%, #373737);
   152    background: -o-linear-gradient(#5F5F5F,#565656 50%,#4C4C4C 51%,#373737);
   198   background: -ms-linear-gradient(#5F5F5F, #565656 50%, #4C4C4C 51%, #373737);
   153    box-shadow: inset 0 1px 3px rgba(0,0,0,0.9);
   199   background: -o-linear-gradient(#5F5F5F, #565656 50%, #4C4C4C 51%, #373737);
   154  }
   200   box-shadow: inset 0 1px 3px rgba(0, 0, 0, 0.9);
   155  
   201 }
   156  #button:hover {
   202 
   157    cursor: pointer;
   203 #button:hover {
   158    background: #666;
   204   cursor: pointer;
   159    background: -webkit-linear-gradient(#707070,#666666 50%,#5B5B5B 51%,#474747);
   205   background: #666;
   160    background: -moz-linear-gradient(#707070,#666666 50%,#5B5B5B 51%,#474747);
   206   background: -webkit-linear-gradient(#707070, #666666 50%, #5B5B5B 51%, #474747);
   161    background: -ms-linear-gradient(#707070,#666666 50%,#5B5B5B 51%,#474747);
   207   background: -moz-linear-gradient(#707070, #666666 50%, #5B5B5B 51%, #474747);
   162    background: -o-linear-gradient(#707070,#666666 50%,#5B5B5B 51%,#474747);
   208   background: -ms-linear-gradient(#707070, #666666 50%, #5B5B5B 51%, #474747);
   163  }
   209   background: -o-linear-gradient(#707070, #666666 50%, #5B5B5B 51%, #474747);
   164  
   210 }
   165  #button:active {
   211 
   166    box-shadow: inset 0 1px 12px rgba(0,0,0,0.9);
   212 #button:active {
   167    background: #444;
   213   box-shadow: inset 0 1px 12px rgba(0, 0, 0, 0.9);
   168  }
   214   background: #444;
   169  
   215 }
       
   216 
   170 #label {
   217 #label {
   171    font: 30px verdana,arial,sans-serif bold;
   218   font: 30px verdana, arial, sans-serif bold;
   172    text-align: center;
   219   text-align: center;
   173    text-shadow: 0 1px 1px #fff;
   220   text-shadow: 0 1px 1px #fff;
   174    height: 70px;
   221   height: 70px;
   175    line-height: 70px;   
   222   line-height: 70px;
   176    margin: 16px auto 0;
   223   margin: 16px auto 0;
   177 }
   224 }
   178 
   225 
   179 form {
   226 form {
   180    height: 38px;   
   227   height: 38px;
   181    position: relative;
   228   position: relative;
   182 }
   229 }
   183 
   230 
   184 button, input {
   231 button, input, label {
   185    font-weight: bold;
   232   font-weight: bold;
   186    font-size: 15px;
   233   font-size: 15px;
   187 }
   234 }
       
   235 
       
   236 #inner label {
       
   237   padding: 5px 10px 5px 0px;
       
   238 }
       
   239 
       
   240 #form-fields {
       
   241   float: left;
       
   242 }
       
   243 
       
   244 #form-fields input {
       
   245   width: 290px;
       
   246 }
       
   247 
       
   248 
       
   249 #inner div {
       
   250   /*   position: absolute;*/
   188   
   251   
       
   252 }
       
   253 
       
   254 #inner input {
       
   255   padding: 5px 10px;
       
   256   *padding: 0; /* IE7 hack */
       
   257   height: 100%;
       
   258   outline: none;
       
   259 }
       
   260 
   189 #inner input[type="text"] {
   261 #inner input[type="text"] {
   190    background: #fff;
   262   background: #fff;
   191    border: 1px solid #bbb;
   263   border: 1px solid #bbb;
   192    border-radius: 3px;
   264   border-radius: 3px;
   193    box-sizing: border-box;
   265   box-sizing: border-box;
   194    -moz-box-sizing: border-box;   
   266   -moz-box-sizing: border-box;
   195    padding: 0 10px 0 10px;
   267 }
   196    *padding: 0; /* IE7 hack */
   268 
   197    width: 100%;
       
   198    height: 100%;
       
   199    outline: none;
       
   200    position: absolute;
       
   201 }
       
   202  
       
   203 #inner button[type="submit"] {
   269 #inner button[type="submit"] {
   204    position: absolute;
   270   position: absolute;
   205    right: -45px;
   271   right: -45px;
   206    width: 45px;
   272   width: 45px;
   207    height: 38px;
   273   height: 38px;
   208 }
   274 }
   209 
   275 
   210 #objects-content {
   276 #objects-content {
   211     float: left;
   277   float: left;
   212 }
   278 }
   213 
   279 
   214 #objects-content table {
   280 #objects-content table {
   215     width: 100%;
   281   width: 100%;
   216 }
   282 }
   217 
   283 
   218 .object-tools {
   284 .object-tools {
   219     font-size: 11px;
   285   font-size: 11px;
   220     font-weight: bold;
   286   font-weight: bold;
   221     font-family: Arial,Helvetica,sans-serif;
   287   font-family: Arial, Helvetica, sans-serif;
   222     padding-left: 0;
   288   padding-left: 0;
   223     float: right;
   289   float: right;
   224     position: relative;
   290   position: relative;
   225     margin: -2.4em -15px -2em 0;
   291   margin: -2.4em -15px -2em 0;
   226 }
   292 }
   227 
   293 
   228 .object-tools li {
   294 .object-tools li {
   229 	list-style: none;
   295   list-style: none;
   230 }
   296 }
   231 
   297 
   232 .object-tools a:link, .object-tools a:visited {
   298 .object-tools a:link, .object-tools a:visited {
   233     display: block;
   299   display: block;
   234     float: left;
   300   float: left;
   235     color: white;
   301   color: white;
   236     padding: .1em 8px .1em 8px;
   302   padding: .1em 8px .1em 8px;
   237     height: 14px;
   303   height: 14px;
   238     background: #666666;
   304   background: #666666;
   239     text-decoration: none;
   305   text-decoration: none;
   240 }
   306 }
   241 
   307 
   242 .object-table-title {
   308 .object-table-title {
   243 	width: 250px;
   309   width: 250px;
   244 }
   310 }
       
   311 
   245 .object-table-created {
   312 .object-table-created {
   246     width: 120px;
   313   width: 120px;
   247 }
   314 }
   248 
   315 
   249 .object-table-actions {
   316 .object-table-actions {
   250     width: 40px;
   317   width: 40px;
   251 }
   318 }
   252 
   319 
   253 .object-table-actions-disabled, .object-table-actions-disabled:link, .object-table-actions-disabled:visited, .object-table-actions-disabled:hover, .object-table-actions-disabled:active, .object-table-actions-disabled:focus {
   320 .object-table-actions-disabled, .object-table-actions-disabled:link,
   254 	color: gray;
   321   .object-table-actions-disabled:visited, .object-table-actions-disabled:hover,
   255 	text-decoration: none;
   322   .object-table-actions-disabled:active, .object-table-actions-disabled:focus
   256 	cursor: default;
   323   {
       
   324   color: gray;
       
   325   text-decoration: none;
       
   326   cursor: default;
   257 }
   327 }
   258 
   328 
   259 td.object-table-created {
   329 td.object-table-created {
   260 	text-align: center;
   330   text-align: center;
   261 }
   331 }
   262 
   332 
   263 .form-fields label, .form-fields input, .form-fields textarea, .form-fields #binConfigContainer {
   333 .form-fields label, .form-fields input, .form-fields textarea,
   264   display:inline-block;
   334   .form-fields #binConfigContainer {
       
   335   display: inline-block;
   265 }
   336 }
   266 
   337 
   267 .form-fields label {
   338 .form-fields label {
   268   width:150px;
   339   width: 150px;
   269   float: left;
   340   float: left;
   270 }
   341 }
   271 
   342 
   272 .form-fields input, .form-fields textarea, .form-fields select {
   343 .form-fields input, .form-fields textarea, .form-fields select {
   273   width:200px;
   344   width: 200px;
   274 }
   345 }
   275 
       
   276 
   346 
   277 .form-fields div {
   347 .form-fields div {
   278 	margin-bottom: 12px; 
   348   margin-bottom: 12px;
   279 }
   349 }
   280 
   350 
   281 .form-error {
   351 .form-error {
   282 	color: red;
   352   color: red;
   283 }
   353 }
   284 
   354 
   285 #binConfigDiv { 
   355 #binConfigDiv {
   286     position: relative;
   356   position: relative;
   287     width: 650px;
   357   width: 650px;
   288     height: 150px;
   358   height: 150px;
   289 }
   359 }
   290 
   360 
   291 .binConfigButton {
   361 .binConfigButton {
   292 	font-weight: normal;
   362   font-weight: normal;
   293 }
   363 }
       
   364 
   294 .binConfigButton[disabled] {
   365 .binConfigButton[disabled] {
   295     color: graytext;
   366   color: graytext;
   296 }
   367 }
   297 
   368 
   298 #binConfigDiv div {
   369 #binConfigDiv div {
   299     margin-bottom: 0; 
   370   margin-bottom: 0;
   300 }
   371 }
   301 
   372 
   302 #object-delete-container {
   373 #object-delete-container {
   303 	margin-left: 12px;
   374   margin-left: 12px;
   304 	margin-top: 1em;
   375   margin-top: 1em;
   305 }
   376 }
   306 
       
   307 
   377 
   308 #object-delete-confirm-buttons {
   378 #object-delete-confirm-buttons {
   309 	margin-top: 1em;
   379   margin-top: 1em;
   310 }
   380 }
   311 
   381 
   312 #object-delete-confirm-buttons form {
   382 #object-delete-confirm-buttons form {
   313 	margin: 0;
   383   margin: 0;
   314 	padding: 0;
   384   padding: 0;
   315 	display: inline;
   385   display: inline;
   316 }
   386 }
   317 
   387 
   318 #object-delete-confirm-buttons input[type=submit] {
   388 #object-delete-confirm-buttons input[type=submit] {
   319 	margin-right: 12px;
   389   margin-right: 12px;
   320 }
   390 }
   321 
   391 
   322 #project-filter-container {
   392 #project-filter-container {
   323     margin: 12px 0 0 15px;    
   393   margin: 12px 0 0 15px;
   324 }
   394 }
   325 
   395 
   326 #project-filter-container input[type="text"] {
   396 #project-filter-container input[type="text"] {
   327    background: #fff;
   397   background: #fff;
   328    border: 1px solid #bbb;
   398   border: 1px solid #bbb;
   329    border-radius: 3px;
   399   border-radius: 3px;
   330    padding: 2px 10px 3px;
   400   padding: 2px 10px 3px;
   331    box-sizing: border-box;
   401   box-sizing: border-box;
   332    -moz-box-sizing: border-box;
   402   -moz-box-sizing: border-box;
   333    outline: none;
   403   outline: none;
   334    font-weight: normal;
   404   font-weight: normal;
   335    font-size: 15px;
   405   font-size: 15px;
   336 }
   406 }
   337  
   407 
   338 #project-filter-container button[type="submit"] {
   408 #project-filter-container button[type="submit"] {
   339 	
   409   
   340 }
   410 }
   341 
   411 
   342 .proj-sort-form {
   412 .proj-sort-form {
   343 	float: right;
   413   float: right;
   344 	height: auto;
   414   height: auto;
   345 }
   415 }
   346 
   416 
   347 .proj-sort-form input[type=submit] {
   417 .proj-sort-form input[type=submit] {
   348     width: 16px;
   418   width: 16px;
   349     height: 16px;
   419   height: 16px;
   350     border: 0;	
   420   border: 0;
   351 }
   421 }
   352 
   422 
   353 .proj-sort-form input[type=submit]:HOVER {
   423 .proj-sort-form input[type=submit]:HOVER {
   354 	opacity: .5;
   424   opacity: .5;
   355 }
   425 }
   356 
   426 
   357 .proj-sortable-col {
   427 .proj-sortable-col {
   358 	background: url("../img/sort_arrows.png") 0 0;	
   428   background: url("../img/sort_arrows.png") 0 0;
   359 }
   429 }
   360 
   430 
   361 .proj-sort-desc-col {
   431 .proj-sort-desc-col {
   362     background: url("../img/sort_arrows.png") 0 -17px;  
   432   background: url("../img/sort_arrows.png") 0 -17px;
   363 }
   433 }
   364 
   434 
   365 .proj-sort-asc-col {
   435 .proj-sort-asc-col {
   366     background: url("../img/sort_arrows.png") 0 -33px;  
   436   background: url("../img/sort_arrows.png") 0 -33px;
   367 }
   437 }
   368 
   438 
   369 #inner-container {
   439 #inner-container {
   370     margin: 12px 0px 0px 15px;
   440   margin: 12px 0px 0px 15px;
   371 }
   441 }
   372 
   442 
   373 #login-errors {
   443 #login-errors {
   374     color: #ff0000;
   444   color: #ff0000;
   375     border: 1px solid #ff0000;
   445   border: 1px solid #ff0000;
   376     padding: 8px;
   446   padding: 8px;
   377     margin: 16px 16px 32px;
   447   margin: 16px 16px 32px;
   378     width: inherit;
   448   width: inherit;
   379     float: left;
   449   float: left;
   380 }
   450 }
   381 
   451 
   382 #login-form {
   452 #login-form {
   383 	clear: both;
   453   clear: both;
   384 }
   454 }