You are here

openlayers_plus.css in OpenLayers Plus 7.2

Same filename and directory in other branches
  1. 7.3 theme/openlayers_plus.css
  2. 7 theme/openlayers_plus.css
/**
 * Legend =============================================================
 */
.openlayers-legends {
  background: #fff;
  border-radius: 3px;
  bottom: 5px;
  left: 5px;
  -moz-border-radius: 3px;
  padding: 5px;
  position: absolute;
  -webkit-border-radius: 3px;
  z-index: 3000;
}

.openlayers-legends .legend {
  background: #fff;
  -moz-border-radius: 3px;
  -webkit-border-radius: 3px;
}

.openlayers-legends .legend .legend-item {
  margin: 10px 0;
}

.openlayers-legends .swatch {
  display: block;
  float: left;
  height: 15px;
  margin-right: 5px;
  width: 15px;
}

.openlayers-legends .clear-block {
  clear: both;
}

/**
 * Blockswitcher ======================================================
 */
.openlayers-blockswitcher span.key {
  display: block;
  float: left;
  height: 20px;
  margin-right: 5px;
  width: 20px;
}

.openlayers-blockswitcher input.form-radio,
.openlayers-blockswitcher input.form-checkbox {
  margin-right: 5px;
}

div.openlayers-map .openlayers_plus-blockswitcher {
  background: #fff;
  width: auto;
  z-index: 3000;
}

div.openlayers-map .openlayers_plus-blockswitcher.ne {
  right: 0px;
  top: 0px;
}

div.openlayers-map .openlayers_plus-blockswitcher.nw {
  left: 0px;
  top: 0px;
}

div.openlayers-map .openlayers_plus-blockswitcher.se {
  bottom: 0px;
  right: 0px;
}

div.openlayers-map .openlayers_plus-blockswitcher.sw {
  bottom: 0px;
  left: 0px;
}

.openlayers_plus-blockswitcher h2.block-title {
  cursor: pointer;
}

.openlayers_plus-blockswitcher div.block-content {
  display: none;
}

.openlayers_plus-blockswitcher div.radio {
  background: #fff url('inactive.png');
  background-repeat: no-repeat;
  padding: 3px 0 3px 25px;
}

.openlayers_plus-blockswitcher div.activated {
  background: #fff url('active.png');
  background-repeat: no-repeat;
  padding: 3px 0 3px 25px;
}

/**
 * Blocktoggle ========================================================
 */
div.openlayers-map .block-openlayers_plus-blocktoggle {
  background: transparent;
  padding: 0;
  position: absolute;
  -moz-border-radius: 3px;
  -webkit-border-radius: 3px;
  width: auto;
  z-index: 3001;
}

div.openlayers-map .block-openlayers_plus-blocktoggle.ne {
  right: 0px;
  top: 0px;
}

div.openlayers-map .block-openlayers_plus-blocktoggle.nw {
  left: 0px;
  top: 0px;
}

div.openlayers-map .block-openlayers_plus-blocktoggle.se {
  bottom: 0px;
  right: 0px;
}

div.openlayers-map .block-openlayers_plus-blocktoggle.sw {
  bottom: 0px;
  left: 0px;
}

.block-openlayers_plus-blocktoggle h2.block-title {
  display: none;
}

.block-openlayers_plus-blocktoggle .openlayers-blocktoggle-a,
.block-openlayers_plus-blocktoggle .openlayers-blocktoggle-b {
  background: url('point-button.png') #fff 5px 50% no-repeat;
  color: #666;
  cursor: pointer;
  float: left;
  line-height: 20px;
  padding: 0px 5px 0px 20px;
  width: 50px;
}

.block-openlayers_plus-blocktoggle .openlayers-blocktoggle-a {
  border-right: 1px solid #ccc;
  -moz-border-radius: 3px 0 0 3px;
  -webkit-border-radius: 3px 0 0 3px;
}

.block-openlayers_plus-blocktoggle .openlayers-blocktoggle-b {
  background-image: url('point-choro.png');
  -moz-border-radius: 0 3px 3px 0;
  -webkit-border-radius: 0 3px 3px 0;
}

.block-openlayers_plus-blocktoggle .activated {
  background-color: #eee;
  color: #222;
}

/**  
 * Sample themeregion css. You probably want to override this *
 */
.openlayers_plus-themeregion {
  /* this is tricky, the layers are 999, the first OpenLayers control is 1001 */
  position: absolute;
  /* We do this in code, too, as some themes position the region by ID, so we lose */
  z-index: 1000;
}

/*
** For sample purposes, place the selected region at the top of the map
** If you select more regions, that wont work too well.
*/
.openlayers_plus-themeregion.olControlNoSelect {
  right: 0px;
  top: 0px;
}

File

theme/openlayers_plus.css
View source
  1. /**
  2. * Legend =============================================================
  3. */
  4. .openlayers-legends {
  5. background: #fff;
  6. border-radius: 3px;
  7. bottom: 5px;
  8. left: 5px;
  9. -moz-border-radius: 3px;
  10. padding: 5px;
  11. position: absolute;
  12. -webkit-border-radius: 3px;
  13. z-index: 3000;
  14. }
  15. .openlayers-legends .legend {
  16. background: #fff;
  17. -moz-border-radius: 3px;
  18. -webkit-border-radius: 3px;
  19. }
  20. .openlayers-legends .legend .legend-item {
  21. margin: 10px 0;
  22. }
  23. .openlayers-legends .swatch {
  24. display: block;
  25. float: left;
  26. height: 15px;
  27. margin-right: 5px;
  28. width: 15px;
  29. }
  30. .openlayers-legends .clear-block {
  31. clear: both;
  32. }
  33. /**
  34. * Blockswitcher ======================================================
  35. */
  36. .openlayers-blockswitcher span.key {
  37. display: block;
  38. float: left;
  39. height: 20px;
  40. margin-right: 5px;
  41. width: 20px;
  42. }
  43. .openlayers-blockswitcher input.form-radio,
  44. .openlayers-blockswitcher input.form-checkbox {
  45. margin-right: 5px;
  46. }
  47. div.openlayers-map .openlayers_plus-blockswitcher {
  48. background: #fff;
  49. width: auto;
  50. z-index: 3000;
  51. }
  52. div.openlayers-map .openlayers_plus-blockswitcher.ne {
  53. right: 0px;
  54. top: 0px;
  55. }
  56. div.openlayers-map .openlayers_plus-blockswitcher.nw {
  57. left: 0px;
  58. top: 0px;
  59. }
  60. div.openlayers-map .openlayers_plus-blockswitcher.se {
  61. bottom: 0px;
  62. right: 0px;
  63. }
  64. div.openlayers-map .openlayers_plus-blockswitcher.sw {
  65. bottom: 0px;
  66. left: 0px;
  67. }
  68. .openlayers_plus-blockswitcher h2.block-title {
  69. cursor: pointer;
  70. }
  71. .openlayers_plus-blockswitcher div.block-content {
  72. display: none;
  73. }
  74. .openlayers_plus-blockswitcher div.radio {
  75. background: #fff url('inactive.png');
  76. background-repeat: no-repeat;
  77. padding: 3px 0 3px 25px;
  78. }
  79. .openlayers_plus-blockswitcher div.activated {
  80. background: #fff url('active.png');
  81. background-repeat: no-repeat;
  82. padding: 3px 0 3px 25px;
  83. }
  84. /**
  85. * Blocktoggle ========================================================
  86. */
  87. div.openlayers-map .block-openlayers_plus-blocktoggle {
  88. background: transparent;
  89. padding: 0;
  90. position: absolute;
  91. -moz-border-radius: 3px;
  92. -webkit-border-radius: 3px;
  93. width: auto;
  94. z-index: 3001;
  95. }
  96. div.openlayers-map .block-openlayers_plus-blocktoggle.ne {
  97. right: 0px;
  98. top: 0px;
  99. }
  100. div.openlayers-map .block-openlayers_plus-blocktoggle.nw {
  101. left: 0px;
  102. top: 0px;
  103. }
  104. div.openlayers-map .block-openlayers_plus-blocktoggle.se {
  105. bottom: 0px;
  106. right: 0px;
  107. }
  108. div.openlayers-map .block-openlayers_plus-blocktoggle.sw {
  109. bottom: 0px;
  110. left: 0px;
  111. }
  112. .block-openlayers_plus-blocktoggle h2.block-title {
  113. display: none;
  114. }
  115. .block-openlayers_plus-blocktoggle .openlayers-blocktoggle-a,
  116. .block-openlayers_plus-blocktoggle .openlayers-blocktoggle-b {
  117. background: url('point-button.png') #fff 5px 50% no-repeat;
  118. color: #666;
  119. cursor: pointer;
  120. float: left;
  121. line-height: 20px;
  122. padding: 0px 5px 0px 20px;
  123. width: 50px;
  124. }
  125. .block-openlayers_plus-blocktoggle .openlayers-blocktoggle-a {
  126. border-right: 1px solid #ccc;
  127. -moz-border-radius: 3px 0 0 3px;
  128. -webkit-border-radius: 3px 0 0 3px;
  129. }
  130. .block-openlayers_plus-blocktoggle .openlayers-blocktoggle-b {
  131. background-image: url('point-choro.png');
  132. -moz-border-radius: 0 3px 3px 0;
  133. -webkit-border-radius: 0 3px 3px 0;
  134. }
  135. .block-openlayers_plus-blocktoggle .activated {
  136. background-color: #eee;
  137. color: #222;
  138. }
  139. /**
  140. * Sample themeregion css. You probably want to override this *
  141. */
  142. .openlayers_plus-themeregion {
  143. /* this is tricky, the layers are 999, the first OpenLayers control is 1001 */
  144. position: absolute;
  145. /* We do this in code, too, as some themes position the region by ID, so we lose */
  146. z-index: 1000;
  147. }
  148. /*
  149. ** For sample purposes, place the selected region at the top of the map
  150. ** If you select more regions, that wont work too well.
  151. */
  152. .openlayers_plus-themeregion.olControlNoSelect {
  153. right: 0px;
  154. top: 0px;
  155. }