BaseLayerPicker.css 3.0 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115
  1. .cesium-baseLayerPicker-selected {
  2. position: absolute;
  3. top: 0;
  4. left: 0;
  5. width: 100%;
  6. height: 100%;
  7. border: none;
  8. }
  9. .cesium-baseLayerPicker-dropDown {
  10. display: block;
  11. position: absolute;
  12. top: auto;
  13. right: 0;
  14. width: 320px; /* Includes space needed for scrollbar */
  15. max-height: 500px;
  16. margin-top: 5px;
  17. background-color: rgba(38, 38, 38, 0.75);
  18. border: 1px solid #444;
  19. padding: 6px;
  20. overflow: auto;
  21. border-radius: 10px;
  22. -moz-user-select: none;
  23. -webkit-user-select: none;
  24. user-select: none;
  25. -webkit-transform: translate(0, -20%);
  26. -moz-transform: translate(0, -20%);
  27. transform: translate(0, -20%);
  28. visibility: hidden;
  29. opacity: 0;
  30. -webkit-transition: visibility 0s 0.2s, opacity 0.2s ease-in, -webkit-transform 0.2s ease-in;
  31. -moz-transition: visibility 0s 0.2s, opacity 0.2s ease-in, -moz-transform 0.2s ease-in;
  32. transition: visibility 0s 0.2s, opacity 0.2s ease-in, transform 0.2s ease-in;
  33. }
  34. .cesium-baseLayerPicker-dropDown-visible {
  35. -webkit-transform: translate(0, 0);
  36. -moz-transform: translate(0, 0);
  37. transform: translate(0, 0);
  38. visibility: visible;
  39. opacity: 1;
  40. -webkit-transition: opacity 0.2s ease-out, -webkit-transform 0.2s ease-out;
  41. -moz-transition: opacity 0.2s ease-out, -moz-transform 0.2s ease-out;
  42. transition: opacity 0.2s ease-out, transform 0.2s ease-out;
  43. }
  44. .cesium-baseLayerPicker-sectionTitle {
  45. display: block;
  46. font-family: sans-serif;
  47. font-size: 16pt;
  48. text-align: left;
  49. color: #edffff;
  50. border-bottom: 1px solid #888;
  51. margin-bottom: 4px;
  52. }
  53. .cesium-baseLayerPicker-choices {
  54. display: block;
  55. position: relative;
  56. top: auto;
  57. right: 0;
  58. }
  59. .cesium-baseLayerPicker-item {
  60. display: inline-block;
  61. vertical-align: top;
  62. margin: 2px 5px;
  63. width: 64px;
  64. text-align: center;
  65. cursor: pointer;
  66. }
  67. .cesium-baseLayerPicker-itemLabel {
  68. display: block;
  69. font-family: sans-serif;
  70. font-size: 8pt;
  71. text-align: center;
  72. vertical-align: middle;
  73. color: #edffff;
  74. cursor: pointer;
  75. word-wrap: break-word;
  76. }
  77. .cesium-baseLayerPicker-item:hover .cesium-baseLayerPicker-itemLabel, .cesium-baseLayerPicker-item:focus .cesium-baseLayerPicker-itemLabel {
  78. text-decoration: underline;
  79. }
  80. .cesium-baseLayerPicker-itemIcon {
  81. display: inline-block;
  82. position: relative;
  83. width: inherit;
  84. height: auto;
  85. background-size: 100% 100%;
  86. border: solid 1px #444;
  87. border-radius: 9px;
  88. color: #edffff;
  89. margin: 0;
  90. padding: 0;
  91. cursor: pointer;
  92. -moz-box-sizing: border-box;
  93. box-sizing: border-box;
  94. }
  95. .cesium-baseLayerPicker-item:hover .cesium-baseLayerPicker-itemIcon {
  96. border-color: #fff;
  97. box-shadow: 0 0 8px #fff, 0 0 8px #fff;
  98. }
  99. .cesium-baseLayerPicker-selectedItem .cesium-baseLayerPicker-itemLabel {
  100. color: rgb(189, 236, 248);
  101. }
  102. .cesium-baseLayerPicker-selectedItem .cesium-baseLayerPicker-itemIcon {
  103. border: double 4px rgb(189, 236, 248);
  104. }