NavigationHelpButton.css 2.0 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112
  1. .cesium-navigationHelpButton-wrapper {
  2. position: relative;
  3. display: inline-block;
  4. }
  5. .cesium-navigation-help {
  6. visibility: hidden;
  7. position: absolute;
  8. top: 38px;
  9. right: 2px;
  10. width: 250px;
  11. border-radius: 10px;
  12. transform: scale(0.01);
  13. transform-origin: 234px -10px;
  14. transition: visibility 0s 0.25s, transform 0.25s ease-in;
  15. }
  16. .cesium-navigation-help-visible {
  17. visibility: visible;
  18. transform: scale(1);
  19. transition: transform 0.25s ease-out;
  20. }
  21. .cesium-navigation-help-instructions {
  22. border: 1px solid #444;
  23. background-color: rgba(38, 38, 38, 0.75);
  24. padding-bottom: 5px;
  25. border-radius: 0 0 10px 10px;
  26. }
  27. .cesium-click-navigation-help {
  28. display: none;
  29. }
  30. .cesium-touch-navigation-help {
  31. display: none;
  32. padding-top: 5px;
  33. }
  34. .cesium-click-navigation-help-visible {
  35. display: block;
  36. }
  37. .cesium-touch-navigation-help-visible {
  38. display: block;
  39. }
  40. .cesium-navigation-help-pan {
  41. color: #66ccff;
  42. font-weight: bold;
  43. }
  44. .cesium-navigation-help-zoom {
  45. color: #65fd00;
  46. font-weight: bold;
  47. }
  48. .cesium-navigation-help-rotate {
  49. color: #ffd800;
  50. font-weight: bold;
  51. }
  52. .cesium-navigation-help-tilt {
  53. color: #d800d8;
  54. font-weight: bold;
  55. }
  56. .cesium-navigation-help-details {
  57. color: #ffffff;
  58. }
  59. .cesium-navigation-button {
  60. color: #fff;
  61. background-color: transparent;
  62. border-bottom: none;
  63. border-top: 1px solid #444;
  64. border-right: 1px solid #444;
  65. margin: 0;
  66. width: 50%;
  67. cursor: pointer;
  68. }
  69. .cesium-navigation-button-icon {
  70. vertical-align: middle;
  71. padding: 5px 1px;
  72. }
  73. .cesium-navigation-button:focus {
  74. outline: none;
  75. }
  76. .cesium-navigation-button-left {
  77. border-radius: 10px 0 0 0;
  78. border-left: 1px solid #444;
  79. }
  80. .cesium-navigation-button-right {
  81. border-radius: 0 10px 0 0;
  82. border-left: none;
  83. }
  84. .cesium-navigation-button-selected {
  85. background-color: rgba(38, 38, 38, 0.75);
  86. }
  87. .cesium-navigation-button-unselected {
  88. background-color: rgba(0, 0, 0, 0.75);
  89. }
  90. .cesium-navigation-button-unselected:hover {
  91. background-color: rgba(76, 76, 76, 0.75);
  92. }