css.lisp

   1 ;;; PHOROS -- Photogrammetric Road Survey
   2 ;;; Copyright (C) 2011 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-attribute {
 182     float: left;
 183     width: 86px;
 184 }
 185 #point-attribute-select {
 186     width: 86px;
 187 }
 188 #point-attribute-input {
 189     width: 66px;
 190 }
 191 #finish-point-button {
 192     float:right;
 193     width: 148px;
 194     height: 30px;
 195 }
 196 #delete-point-button {
 197     float: left;
 198     width: 60px;
 199     height: 30px;
 200 }
 201 #aux-point-distance-or-point-creation-date {
 202     float: left;
 203     width: 210px;
 204     height: 21px;
 205     margin-top: 5px;
 206 }
 207 #aux-point-distance {
 208     width: 100px;
 209     height: 21px;
 210     float: left;
 211 }
 212 #include-aux-data {
 213     float: right;
 214 }
 215 #point-creation-date {
 216     padding-left: 5px;
 217 }
 218 #aux-data {
 219     float: left;
 220     width: 210px;
 221     overflow: auto;
 222 }
 223 .aux-data-list {
 224     width: 170px;
 225     list-style-type: lower-latin;
 226     line-height: 1;
 227 }
 228 .phoros-controls {
 229     float: left;
 230     text-align:left;
 231     width: 210px;
 232     height: 323px;
 233 }
 234 #real-phoros-controls, #multiple-points-phoros-controls {
 235     height: 285px;
 236     width: 210px;
 237 }
 238 .help-div {
 239     float: left;
 240     cursor: default;
 241     background-image: url(/~@*~A/lib/public_html/phoros-logo-background.png);
 242     background-position: 40px 90px;
 243     background-repeat: no-repeat;
 244     width: 256px;
 245     height: 320px;
 246     margin-left: 1em;
 247 }
 248 .controlled-streetmap {
 249     float: left;
 250     margin-left: 1px;
 251     margin-right: 1em;
 252     margin-top: 1px;
 253     margin-bottom: 1px;
 254     border: 1px solid #00008B;
 255 }
 256 .streetmap {
 257     float: left;
 258     width: 512px;
 259     height: 320px;
 260 }
 261 .streetmap-controls {
 262     float: left;
 263     width: 200px;
 264     height: 320px;
 265     line-height: 1;
 266     background-color: #00008B;
 267 }
 268 .streetmap-zoom {
 269     height: 18px;
 270     width: 126px;
 271     clear: both;
 272 }
 273 .streetmap-layer-switcher {
 274     /* height: 92px; */
 275 }
 276 .streetmap-layer-switcher span {    /*layer name*/
 277     cursor: pointer;
 278     color: white;
 279 }
 280 .dataLayersDiv {
 281     cursor: pointer;            /*TODO: doesn't work*/
 282 }
 283 .streetmap-vertical-strut {
 284     float: right;
 285     height: 174px;
 286     width: px;
 287     background-color: black;
 288 }
 289 .streetmap-mouse-position {
 290     font-family: 'andale mono', 'lucida console', monospace;
 291     color: white;
 292     clear: both;
 293     float: left;
 294     height: 18px;
 295     margin-left: 5px;
 296 }
 297 .streetmap-overview {
 298     width: 190px;
 299     height: 110px;
 300     clear: both;
 301     float: left;
 302 }
 303 .image-main-controls, .walk-mode-controls {
 304     height: 18px;
 305     background-color: #00008B;
 306     margin-bottom: 2px;
 307     clear: right;
 308 }
 309 #step-button {
 310     color: #00008B;
 311     cursor: pointer;
 312     font-size: smaller;
 313     font-weight: bold;
 314     background-color: white;
 315     float: right;
 316     height: 12px;
 317     padding-left: 3px;
 318     padding-right: 3px;
 319     padding-bottom: 2px;
 320     margin-top: 2px;
 321     margin-bottom: 2px;
 322     margin-left: 10px;
 323     margin-right: 5px;
 324 }
 325 #remove-work-layers-button {
 326     color: #00008B;
 327     cursor: pointer;
 328     font-size: smaller;
 329     font-weight: bold;
 330     background-color: white;
 331     float: right;
 332     height: 12px;
 333     padding-left: 3px;
 334     padding-right: 3px;
 335     padding-bottom: 2px;
 336     margin-top: 2px;
 337     margin-bottom: 2px;
 338     margin-left: 6px;
 339     margin-right: 5px;
 340 }
 341 #auto-zoom, #walk-mode, #brighten-images {
 342     height: 18px;
 343     font-size: smaller;
 344     color: white;
 345     float: left;
 346     margin-left: 5px;
 347     margin-right: 5px;
 348 }
 349 #step-size {
 350     font-family: 'andale mono', 'lucida console', monospace;
 351     color: white;
 352     float: left;
 353     height: 18px;
 354     cursor: pointer;
 355 }
 356 #auto-zoom, #walk-mode, #include-aux-data-p, label {
 357     cursor: pointer;
 358 }
 359 #zoom-images-to-max-extent {
 360     background: url(/~@*~A/lib/ol/img/zoom-world-mini.png) no-repeat;
 361     cursor: pointer;
 362     float: left;
 363     height: 18px;
 364     width: 18px;
 365     margin-left: 10px;
 366     margin-right: 6px;
 367 }
 368 #no-footprints-p {
 369     color: red;
 370     float: left;
 371     width: 8px;
 372     height: 18px;
 373     font-size: small;
 374 }
 375 .image-controls {
 376     width: 100%;
 377     height: 18px;
 378     background-color: #00008B;
 379 }
 380 .image-zoom {
 381     height: 18px;
 382     width: 126px;
 383     float: left;
 384 }
 385 .image-layer-switcher {
 386     cursor: pointer;            /*TODO: doesn't work*/
 387     height: 18px;
 388     float: left;
 389 }
 390 .image-usable {
 391     color: red;
 392     float: left;
 393     width: 5px;
 394     height: 18px;
 395     font-size: small;
 396 }
 397 .image-trigger-time {
 398     font: smaller 'andale mono', 'lucida console', monospace;
 399     color: white;
 400     float: right;
 401     height: 15px;
 402     margin-right: 5px;
 403     margin-top: 3px;
 404     float: right;
 405 }
 406 .dataLbl, .baseLbl {            /*of layer-switcher*/
 407     display: none;
 408 }
 409 .image-layer-switcher span {    /*layer name*/
 410     display: none;
 411 }
 412 .image {
 413     background-image: url(/~@*~A/lib/public_html/phoros-logo-background.png);
 414     background-position: center;
 415     background-repeat: no-repeat;
 416     /* width and height are read via CSS DOM where we expect them
 417        to be in px. */
 418     width: 300px;
 419     height: 256px;
 420 }
 421 .controlled-image {
 422     float: left;
 423     border: 1px solid #00008B;
 424     margin: 1px;
 425 }
 426 .olControlPanWestItemInactive {
 427     background: url(/~@*~A/lib/ol/img/west-mini.png) no-repeat;
 428     cursor: pointer;
 429     float: left;
 430     height: 18px;
 431     width: 18px;
 432 }
 433 .olControlPanEastItemInactive {
 434     background: url(/~@*~A/lib/ol/img/east-mini.png) no-repeat;
 435     cursor: pointer;
 436     float: left;
 437     height: 18px;
 438     width: 18px;
 439 }
 440 .olControlPanNorthItemInactive {
 441     background: url(/~@*~A/lib/ol/img/north-mini.png) no-repeat;
 442     cursor: pointer;
 443     float: left;
 444     height: 18px;
 445     width: 18px;
 446 }
 447 .olControlPanSouthItemInactive {
 448     background: url(/~@*~A/lib/ol/img/south-mini.png) no-repeat;
 449     cursor: pointer;
 450     float: left;
 451     height: 18px;
 452     width: 18px;
 453 }
 454 .olControlZoomInItemInactive, #increase-step-size {
 455     background: url(/~@*~A/lib/ol/img/zoom-plus-mini.png) no-repeat;
 456     cursor: pointer;
 457     float: left;
 458     height: 18px;
 459     width: 18px;
 460 }
 461 .olControlZoomOutItemInactive, #decrease-step-size {
 462     background: url(/~@*~A/lib/ol/img/zoom-minus-mini.png) no-repeat;
 463     cursor: pointer;
 464     float: left;
 465     height: 18px;
 466     width: 18px;
 467 }
 468 .olControlZoomToMaxExtentItemInactive {
 469     background: url(/~@*~A/lib/ol/img/zoom-world-mini.png) no-repeat;
 470     cursor: pointer;
 471     float: left;
 472     height: 18px;
 473     width: 18px;
 474 }
 475 .olControlScaleLineBottom {     /* Imperial units */
 476     display: none;
 477 }
 478 .streetmapZoomToMaxExtentItemInactive {
 479     background: url(/~@*~A/lib/ol/img/zoom-world-mini.png) no-repeat;
 480     cursor: pointer;
 481     float: left;
 482     height: 18px;
 483     width: 18px;
 484 }
 485 .olLayerGoogleCopyright {
 486     display: none;
 487 }
 488 " *proxy-root*))
 489
 490 ;; (pushnew (hunchentoot:create-folder-dispatcher-and-handler
 491 ;;           (format nil "/phoros/lib/css-~A/" (phoros-version)) "css/") ;TODO: merge this style.css into public_html/style.css
 492 ;;          hunchentoot:*dispatch-table*)
 493
 494