css.lisp

   1 ;;; PHOROS -- Photogrammetric Road Survey
   2 ;;; Copyright (C) 2011, 2012 Bert Burgemeister
   3 ;;;
   4 ;;; This program is free software; you can redistribute it and/or modify
   5 ;;; it under the terms of the GNU General Public License as published by
   6 ;;; the Free Software Foundation; either version 2 of the License, or
   7 ;;; (at your option) any later version.
   8 ;;;
   9 ;;; This program is distributed in the hope that it will be useful,
  10 ;;; but WITHOUT ANY WARRANTY; without even the implied warranty of
  11 ;;; MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
  12 ;;; GNU General Public License for more details.
  13 ;;;
  14 ;;; You should have received a copy of the GNU General Public License along
  15 ;;; with this program; if not, write to the Free Software Foundation, Inc.,
  16 ;;; 51 Franklin Street, Fifth Floor, Boston, MA 02110-1301 USA.
  17
  18 (in-package :phoros)
  19
  20 (hunchentoot:define-easy-handler
  21     (style.css
  22      :uri (format nil "/phoros/lib/css-~A/style.css" (phoros-version)))
  23     ()
  24   ""
  25   (setf (hunchentoot:content-type*) "text/css")
  26   (format nil "
  27 /**
  28  * CSS Reset
  29  * From Blueprint reset.css
  30  * http://blueprintcss.googlecode.com
  31  */
  32 html, body, div, span, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, code, del, dfn, em, img, q, dl, dt, dd, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td {margin:0;padding:0;border
  33 :0;font-weight:inherit;font-style:inherit;font-size:100%;font-family:inherit;vertical-align:baseline;}
  34 body {line-height:1.5;}
  35 table {border-collapse:separate;border-spacing:0;}
  36 caption, th, td {text-align:left;font-weight:normal;}
  37 table, td, th {vertical-align:middle;}
  38 blockquote:before, blockquote:after, q:before, q:after {content:'';}
  39 blockquote, q {quotes:'' '';}
  40 a img {border:none;}
  41
  42 /**
  43  * Basic Typography
  44  * From OpenLayers style.css
  45  * http://openlayers.org
  46  */
  47 body {
  48     font-family: 'Lucida Grande', Verdana, Geneva, Lucida, Arial, Helvetica, sans-serif;
  49     font-size: 80%;
  50     color: #222;
  51     background: #fff;
  52     margin: 1em 1.5em;
  53 }
  54 pre, code {
  55     margin: 1.5em 0;
  56     white-space: pre;
  57 }
  58 pre, code {
  59     font-family: 'andale mono', 'lucida console', monospace;
  60     line-height:1.5;
  61 }
  62 a[href] {
  63     color: #436976;
  64     background-color: transparent;
  65 }
  66 h1, h2, h3, h4, h5, h6 {
  67     color: #003a6b;
  68     background-color: transparent;
  69     font: 100% 'Lucida Grande', Verdana, Geneva, Lucida, Arial, Helvetica, sans-serif;
  70     margin: 0;
  71     padding-top: 0.5em;
  72 }
  73 h1 {
  74     font-size: 130%;
  75     margin-bottom: 0.5em;
  76     border-bottom: 1px solid #fcb100;
  77 }
  78 h2 {
  79     font-size: 120%;
  80     margin-bottom: 0.5em;
  81     border-bottom: 1px solid #aaa;
  82 }
  83 h3 {
  84     font-size: 110%;
  85     margin-bottom: 0.5em;
  86     text-decoration: underline;
  87 }
  88 h4 {
  89     font-size: 100%;
  90     font-weight: bold;
  91 }
  92 h5 {
  93     font-size: 100%;
  94     font-weight: bold;
  95 }
  96 h6 {
  97     font-size: 80%;
  98     font-weight: bold;
  99 }
 100
 101 /**
 102  * Phoros Specific
 103  */
 104 button, select {
 105     cursor: pointer;
 106     vertical-align: middle;
 107 }
 108 #download-user-points-button {
 109     float: left;
 110     height: 25px;
 111     margin-right: 2px;
 112 }
 113 #blurb-button {
 114     float: left;
 115     height: 25px;
 116     padding-bottom: 1px;
 117 }
 118 #logout-button {
 119     float:right;
 120     height: 25px;
 121 }
 122 #h2-help {
 123     clear: both;
 124 }
 125 .h1-right {
 126     float: right;
 127 }
 128 #caching-indicator {
 129     background: url(/~@*~A/lib/ol/theme/theme/default/img/save_features_off.png) no-repeat center center;
 130     float: left;
 131     margin-top: 3px;
 132     margin-right: 15px;
 133     height: 16px;
 134     width: 16px;
 135 }
 136 .vanilla-input {
 137     font-family: 'andale mono', 'lucida console', monospace;
 138     padding: 0px;
 139     margin: 0px;
 140 }
 141 .tight-input {
 142     padding: 0px;
 143     margin-left: 0px;
 144     margin-right: 0px;
 145     margin-top: 3px;
 146     margin-bottom: 2px;
 147 }
 148 .combobox {
 149     height: 20px;
 150 }
 151 .combobox-select {
 152     font-family: 'andale mono', 'lucida console', monospace;
 153     position:absolute;
 154     height: 20px;
 155     border-width: 2px;
 156 }
 157 .combobox-input {
 158     font-family: 'andale mono', 'lucida console', monospace;
 159     position:absolute;
 160     height: 16px;
 161     border-width: 0px;
 162     margin: 2px 18px 2px 2px;
 163     padding: 0 0px 0 0;
 164 }
 165 #point-description {
 166     float: left;
 167     width: 210px;
 168     margin-bottom: 2px;
 169 }
 170 #point-description-select {
 171     width: 210px;
 172 }
 173 #point-description-input {
 174     width: 190px;
 175 }
 176 #point-numeric-description {
 177     width: 118px;
 178     height: 16px;
 179     float: right;
 180 }
 181 #point-kind {
 182     float: left;
 183     width: 86px;
 184 }
 185 #point-kind-select {
 186     width: 86px;
 187 }
 188 #point-kind-input {
 189     width: 66px;
 190 }
 191 #finish-point-button {
 192     float: right;
 193     width: 175px;
 194     height: 30px;
 195 }
 196 #uniquify-buttons {
 197     float: right;
 198     width: 175px;
 199     height: 30px;
 200 }
 201 #suggest-unique-button {
 202     float: left;
 203     width: 130px;
 204     height: 30px;
 205 }
 206 #force-duplicate-button {
 207     float: left;
 208     width: 45px;
 209     height: 30px;
 210 }
 211 #delete-point-button {
 212     float: left;
 213     width: 33px;
 214     height: 30px;
 215 }
 216 #aux-point-distance-or-point-creation-date {
 217     float: left;
 218     width: 210px;
 219     height: 21px;
 220     margin-top: 5px;
 221 }
 222 #aux-point-distance {
 223     width: 100px;
 224     height: 21px;
 225     float: left;
 226 }
 227 #include-aux-data, #display-nearest-aux-data {
 228     float: right;
 229 }
 230 #point-creation-date {
 231     padding-left: 5px;
 232 }
 233 #aux-data {
 234     float: left;
 235     width: 210px;
 236     height: 148px;
 237     margin-top: 2px;
 238     overflow: auto;
 239     line-height: 1;
 240 }
 241 .aux-data-table {
 242     margin-top: 3px;
 243 }
 244 .aux-data-label {
 245     padding-right: 5px;
 246 }
 247 .aux-data-value {
 248     font-family: 'andale mono', 'lucida console', monospace;
 249 }
 250 .phoros-controls {
 251     float: left;
 252     text-align:left;
 253     width: 210px;
 254     height: 323px;
 255 }
 256 #real-phoros-controls {
 257     height: 285px;
 258     width: 210px;
 259 }
 260 .help-div {
 261     float: left;
 262     cursor: default;
 263     background-image: url(/~@*~A/lib/public_html/phoros-logo-background.png);
 264     background-position: 40px 90px;
 265     background-repeat: no-repeat;
 266     width: 256px;
 267     height: 320px;
 268     margin-left: 1em;
 269 }
 270 .controlled-streetmap {
 271     float: left;
 272     margin-left: 1px;
 273     margin-right: 1em;
 274     margin-top: 1px;
 275     margin-bottom: 1px;
 276     border: 1px solid #00008B;
 277 }
 278 .streetmap {
 279     float: left;
 280     width: 512px;
 281     height: 320px;
 282 }
 283 .streetmap-controls {
 284     float: left;
 285     width: 200px;
 286     height: 320px;
 287     line-height: 1;
 288     background-color: #00008B;
 289 }
 290 .streetmap-zoom {
 291     height: 18px;
 292     width: 126px;
 293     clear: both;
 294 }
 295 .streetmap-layer-switcher {
 296     width: 130px;
 297     float: left;
 298 }
 299 .streetmap-layer-switcher span {    /*layer name*/
 300     cursor: pointer;
 301     color: white;
 302 }
 303 #unselect-all-restrictions-button {
 304     font-size: smaller;
 305     width: 33px;
 306     height: 42px;
 307     padding: 0px;
 308     margin-left: 5px;
 309     margin-top: 5px;
 310     float: left;
 311     clear: both;
 312 }
 313 #restriction-select {
 314     font-family: 'andale mono', 'lucida console', monospace;
 315     font-size: small;
 316     width: 157px;
 317     height: 42px;
 318     margin-left: 0px;
 319     margin-top: 5px;
 320     padding: 0px;
 321     border-width: 2px;
 322     float: left;
 323 }
 324 .dataLayersDiv {
 325     cursor: pointer;            /*TODO: doesn't work*/
 326 }
 327 .streetmap-vertical-strut {
 328     float: right;
 329     height: 130px;
 330     width: 0px;
 331     background-color: black;
 332 }
 333 .streetmap-mouse-position {
 334     font-family: 'andale mono', 'lucida console', monospace;
 335     font-size: small;
 336     color: white;
 337     clear: both;
 338     float: left;
 339     height: 15px;
 340     margin-left: 5px;
 341 }
 342 .streetmap-overview {
 343     width: 190px;
 344     height: 110px;
 345     clear: both;
 346     float: left;
 347 }
 348 .image-main-controls, .walk-mode-controls {
 349     height: 18px;
 350     background-color: #00008B;
 351     margin-bottom: 2px;
 352     clear: right;
 353 }
 354 #step-button {
 355     color: #00008B;
 356     cursor: pointer;
 357     font-size: smaller;
 358     font-weight: bold;
 359     background-color: white;
 360     float: right;
 361     height: 12px;
 362     padding-left: 3px;
 363     padding-right: 3px;
 364     padding-bottom: 2px;
 365     margin-top: 2px;
 366     margin-bottom: 2px;
 367     margin-left: 10px;
 368     margin-right: 5px;
 369 }
 370 #remove-work-layers-button {
 371     color: #00008B;
 372     cursor: pointer;
 373     font-size: smaller;
 374     font-weight: bold;
 375     background-color: white;
 376     float: right;
 377     height: 12px;
 378     padding-left: 3px;
 379     padding-right: 3px;
 380     padding-bottom: 2px;
 381     margin-top: 2px;
 382     margin-bottom: 2px;
 383     margin-left: 6px;
 384     margin-right: 5px;
 385 }
 386 #auto-zoom, #walk-mode, #brighten-images {
 387     height: 18px;
 388     font-size: smaller;
 389     color: white;
 390     float: left;
 391     margin-left: 5px;
 392     margin-right: 5px;
 393 }
 394 #step-size {
 395     font-family: 'andale mono', 'lucida console', monospace;
 396     color: white;
 397     float: left;
 398     height: 18px;
 399     cursor: pointer;
 400 }
 401 #auto-zoom, #walk-mode, #include-aux-data-p, label {
 402     cursor: pointer;
 403 }
 404 #zoom-images-to-max-extent {
 405     background: url(/~@*~A/lib/ol/img/zoom-world-mini.png) no-repeat;
 406     cursor: pointer;
 407     float: left;
 408     height: 18px;
 409     width: 18px;
 410     margin-left: 10px;
 411     margin-right: 6px;
 412 }
 413 #no-footprints-p {
 414     color: red;
 415     float: left;
 416     width: 8px;
 417     height: 18px;
 418     font-size: small;
 419 }
 420 .image-controls {
 421     width: 100%;
 422     height: 18px;
 423     background-color: #00008B;
 424 }
 425 .image-zoom {
 426     height: 18px;
 427     width: 126px;
 428     float: left;
 429 }
 430 .image-layer-switcher {
 431     cursor: pointer;            /*TODO: doesn't work*/
 432     height: 18px;
 433     float: left;
 434 }
 435 .image-usable {
 436     color: red;
 437     float: left;
 438     width: 5px;
 439     height: 18px;
 440     font-size: small;
 441 }
 442 .image-trigger-time {
 443     font: smaller 'andale mono', 'lucida console', monospace;
 444     color: white;
 445     float: right;
 446     height: 15px;
 447     margin-right: 5px;
 448     margin-top: 3px;
 449     float: right;
 450 }
 451 .dataLbl, .baseLbl {            /*of layer-switcher*/
 452     display: none;
 453 }
 454 .image-layer-switcher span {    /*layer name*/
 455     display: none;
 456 }
 457 .image {
 458     background-image: url(/~@*~A/lib/public_html/phoros-logo-background.png);
 459     background-position: center;
 460     background-repeat: no-repeat;
 461     /* width and height are read via CSS DOM where we expect them
 462        to be in px. */
 463     width: 300px;
 464     height: 256px;
 465 }
 466 .controlled-image {
 467     float: left;
 468     border: 1px solid #00008B;
 469     margin: 1px;
 470 }
 471 .olControlPanWestItemInactive {
 472     background: url(/~@*~A/lib/ol/img/west-mini.png) no-repeat;
 473     cursor: pointer;
 474     float: left;
 475     height: 18px;
 476     width: 18px;
 477 }
 478 .olControlPanEastItemInactive {
 479     background: url(/~@*~A/lib/ol/img/east-mini.png) no-repeat;
 480     cursor: pointer;
 481     float: left;
 482     height: 18px;
 483     width: 18px;
 484 }
 485 .olControlPanNorthItemInactive {
 486     background: url(/~@*~A/lib/ol/img/north-mini.png) no-repeat;
 487     cursor: pointer;
 488     float: left;
 489     height: 18px;
 490     width: 18px;
 491 }
 492 .olControlPanSouthItemInactive {
 493     background: url(/~@*~A/lib/ol/img/south-mini.png) no-repeat;
 494     cursor: pointer;
 495     float: left;
 496     height: 18px;
 497     width: 18px;
 498 }
 499 .olControlZoomInItemInactive, #increase-step-size {
 500     background: url(/~@*~A/lib/ol/img/zoom-plus-mini.png) no-repeat;
 501     cursor: pointer;
 502     float: left;
 503     height: 18px;
 504     width: 18px;
 505 }
 506 .olControlZoomOutItemInactive, #decrease-step-size {
 507     background: url(/~@*~A/lib/ol/img/zoom-minus-mini.png) no-repeat;
 508     cursor: pointer;
 509     float: left;
 510     height: 18px;
 511     width: 18px;
 512 }
 513 .olControlZoomToMaxExtentItemInactive {
 514     background: url(/~@*~A/lib/ol/img/zoom-world-mini.png) no-repeat;
 515     cursor: pointer;
 516     float: left;
 517     height: 18px;
 518     width: 18px;
 519 }
 520 .olControlScaleLineBottom {     /* Imperial units */
 521     display: none;
 522 }
 523 .streetmapZoomToMaxExtentItemInactive {
 524     background: url(/~@*~A/lib/ol/img/zoom-world-mini.png) no-repeat;
 525     cursor: pointer;
 526     float: left;
 527     height: 18px;
 528     width: 18px;
 529 }
 530 .olLayerGoogleCopyright {
 531     display: none;
 532 }
 533 " *proxy-root*))
 534
 535 ;; (pushnew (hunchentoot:create-folder-dispatcher-and-handler
 536 ;;           (format nil "/phoros/lib/css-~A/" (phoros-version)) "css/") ;TODO: merge this style.css into public_html/style.css
 537 ;;          hunchentoot:*dispatch-table*)
 538
 539