widgets.css 26 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970717273747576777879808182838485868788899091929394959697989910010110210310410510610710810911011111211311411511611711811912012112212312412512612712812913013113213313413513613713813914014114214314414514614714814915015115215315415515615715815916016116216316416516616716816917017117217317417517617717817918018118218318418518618718818919019119219319419519619719819920020120220320420520620720820921021121221321421521621721821922022122222322422522622722822923023123223323423523623723823924024124224324424524624724824925025125225325425525625725825926026126226326426526626726826927027127227327427527627727827928028128228328428528628728828929029129229329429529629729829930030130230330430530630730830931031131231331431531631731831932032132232332432532632732832933033133233333433533633733833934034134234334434534634734834935035135235335435535635735835936036136236336436536636736836937037137237337437537637737837938038138238338438538638738838939039139239339439539639739839940040140240340440540640740840941041141241341441541641741841942042142242342442542642742842943043143243343443543643743843944044144244344444544644744844945045145245345445545645745845946046146246346446546646746846947047147247347447547647747847948048148248348448548648748848949049149249349449549649749849950050150250350450550650750850951051151251351451551651751851952052152252352452552652752852953053153253353453553653753853954054154254354454554654754854955055155255355455555655755855956056156256356456556656756856957057157257357457557657757857958058158258358458558658758858959059159259359459559659759859960060160260360460560660760860961061161261361461561661761861962062162262362462562662762862963063163263363463563663763863964064164264364464564664764864965065165265365465565665765865966066166266366466566666766866967067167267367467567667767867968068168268368468568668768868969069169269369469569669769869970070170270370470570670770870971071171271371471571671771871972072172272372472572672772872973073173273373473573673773873974074174274374474574674774874975075175275375475575675775875976076176276376476576676776876977077177277377477577677777877978078178278378478578678778878979079179279379479579679779879980080180280380480580680780880981081181281381481581681781881982082182282382482582682782882983083183283383483583683783883984084184284384484584684784884985085185285385485585685785885986086186286386486586686786886987087187287387487587687787887988088188288388488588688788888989089189289389489589689789889990090190290390490590690790890991091191291391491591691791891992092192292392492592692792892993093193293393493593693793893994094194294394494594694794894995095195295395495595695795895996096196296396496596696796896997097197297397497597697797897998098198298398498598698798898999099199299399499599699799899910001001100210031004100510061007100810091010101110121013101410151016101710181019102010211022102310241025102610271028102910301031103210331034103510361037103810391040104110421043104410451046104710481049105010511052105310541055105610571058105910601061106210631064106510661067106810691070107110721073107410751076107710781079108010811082108310841085108610871088108910901091109210931094109510961097109810991100110111021103110411051106110711081109111011111112111311141115111611171118111911201121112211231124112511261127112811291130113111321133113411351136113711381139114011411142114311441145114611471148114911501151115211531154115511561157115811591160116111621163116411651166116711681169117011711172117311741175117611771178117911801181118211831184118511861187118811891190119111921193119411951196119711981199120012011202120312041205120612071208120912101211121212131214121512161217
  1. .cesium-svgPath-svg {
  2. position: absolute;
  3. top: 0;
  4. left: 0;
  5. width: 100%;
  6. height: 100%;
  7. overflow: hidden;
  8. }
  9. .cesium-button {
  10. display: inline-block;
  11. position: relative;
  12. background: #303336;
  13. border: 1px solid #444;
  14. color: #edffff;
  15. fill: #edffff;
  16. border-radius: 4px;
  17. padding: 5px 12px;
  18. margin: 2px 3px;
  19. cursor: pointer;
  20. overflow: hidden;
  21. -moz-user-select: none;
  22. -webkit-user-select: none;
  23. -ms-user-select: none;
  24. user-select: none;
  25. }
  26. .cesium-button:focus {
  27. color: #fff;
  28. fill: #fff;
  29. border-color: #ea4;
  30. outline: 0;
  31. }
  32. .cesium-button:hover {
  33. color: #fff;
  34. fill: #fff;
  35. background: #48b;
  36. border-color: #aef;
  37. box-shadow: 0 0 8px #fff;
  38. }
  39. .cesium-button:active {
  40. color: #000;
  41. fill: #000;
  42. background: #adf;
  43. border-color: #fff;
  44. box-shadow: 0 0 8px #fff;
  45. }
  46. .cesium-button-disabled,
  47. .cesium-button-disabled:active,
  48. .cesium-button-disabled:focus,
  49. .cesium-button-disabled:hover,
  50. .cesium-button:disabled {
  51. background: #303336;
  52. border-color: #444;
  53. color: #646464;
  54. fill: #646464;
  55. box-shadow: none;
  56. cursor: default;
  57. }
  58. .cesium-button option {
  59. background-color: #000;
  60. color: #eee;
  61. }
  62. .cesium-button option:disabled {
  63. color: #777;
  64. }
  65. .cesium-button input,
  66. .cesium-button label {
  67. cursor: pointer;
  68. }
  69. .cesium-button input {
  70. vertical-align: sub;
  71. }
  72. .cesium-toolbar-button {
  73. box-sizing: border-box;
  74. width: 32px;
  75. height: 32px;
  76. border-radius: 14%;
  77. padding: 0;
  78. vertical-align: middle;
  79. z-index: 0;
  80. }
  81. .cesium-performanceDisplay-defaultContainer {
  82. position: absolute;
  83. top: 50px;
  84. right: 10px;
  85. text-align: right;
  86. }
  87. .cesium-performanceDisplay {
  88. background-color: rgba(40, 40, 40, 0.7);
  89. padding: 7px;
  90. border-radius: 5px;
  91. border: 1px solid #444;
  92. font: bold 12px sans-serif;
  93. }
  94. .cesium-performanceDisplay-fps {
  95. color: #e52;
  96. }
  97. .cesium-performanceDisplay-throttled {
  98. color: #a42;
  99. }
  100. .cesium-performanceDisplay-ms {
  101. color: #de3;
  102. }
  103. .cesium-animation-theme {
  104. visibility: hidden;
  105. display: block;
  106. position: absolute;
  107. z-index: -100;
  108. }
  109. .cesium-animation-themeNormal {
  110. color: #222;
  111. }
  112. .cesium-animation-themeHover {
  113. color: #4488b0;
  114. }
  115. .cesium-animation-themeSelect {
  116. color: #242;
  117. }
  118. .cesium-animation-themeDisabled {
  119. color: #333;
  120. }
  121. .cesium-animation-themeKnob {
  122. color: #222;
  123. }
  124. .cesium-animation-themePointer {
  125. color: #2e2;
  126. }
  127. .cesium-animation-themeSwoosh {
  128. color: #8ac;
  129. }
  130. .cesium-animation-themeSwooshHover {
  131. color: #aef;
  132. }
  133. .cesium-animation-svgText {
  134. fill: #edffff;
  135. font-family: Sans-Serif;
  136. font-size: 15px;
  137. text-anchor: middle;
  138. }
  139. .cesium-animation-blank {
  140. fill: #000;
  141. fill-opacity: 0.01;
  142. stroke: none;
  143. }
  144. .cesium-animation-rectButton {
  145. cursor: pointer;
  146. -moz-user-select: none;
  147. -webkit-user-select: none;
  148. -ms-user-select: none;
  149. user-select: none;
  150. }
  151. .cesium-animation-rectButton .cesium-animation-buttonGlow {
  152. fill: #fff;
  153. stroke: none;
  154. display: none;
  155. }
  156. .cesium-animation-rectButton:hover .cesium-animation-buttonGlow {
  157. display: block;
  158. }
  159. .cesium-animation-rectButton .cesium-animation-buttonPath {
  160. fill: #edffff;
  161. }
  162. .cesium-animation-rectButton .cesium-animation-buttonMain {
  163. stroke: #444;
  164. stroke-width: 1.2;
  165. }
  166. .cesium-animation-rectButton:hover .cesium-animation-buttonMain {
  167. stroke: #aef;
  168. }
  169. .cesium-animation-rectButton:active .cesium-animation-buttonMain {
  170. fill: #abd6ff;
  171. }
  172. .cesium-animation-buttonDisabled {
  173. -moz-user-select: none;
  174. -webkit-user-select: none;
  175. -ms-user-select: none;
  176. user-select: none;
  177. }
  178. .cesium-animation-buttonDisabled .cesium-animation-buttonMain {
  179. stroke: #555;
  180. }
  181. .cesium-animation-buttonDisabled .cesium-animation-buttonPath {
  182. fill: #818181;
  183. }
  184. .cesium-animation-buttonDisabled .cesium-animation-buttonGlow {
  185. display: none;
  186. }
  187. .cesium-animation-buttonToggled .cesium-animation-buttonGlow {
  188. display: block;
  189. fill: #2e2;
  190. }
  191. .cesium-animation-buttonToggled .cesium-animation-buttonMain {
  192. stroke: #2e2;
  193. }
  194. .cesium-animation-buttonToggled:hover .cesium-animation-buttonGlow {
  195. fill: #fff;
  196. }
  197. .cesium-animation-buttonToggled:hover .cesium-animation-buttonMain {
  198. stroke: #2e2;
  199. }
  200. .cesium-animation-shuttleRingG {
  201. cursor: pointer;
  202. }
  203. .cesium-animation-shuttleRingPointer {
  204. cursor: pointer;
  205. }
  206. .cesium-animation-shuttleRingPausePointer {
  207. cursor: pointer;
  208. }
  209. .cesium-animation-shuttleRingBack {
  210. fill: #181818;
  211. fill-opacity: 0.8;
  212. stroke: #333;
  213. stroke-width: 1.2;
  214. }
  215. .cesium-animation-shuttleRingSwoosh line {
  216. stroke: #8ac;
  217. stroke-width: 3;
  218. stroke-opacity: 0.2;
  219. stroke-linecap: round;
  220. }
  221. .cesium-animation-knobOuter {
  222. cursor: pointer;
  223. stroke: #444;
  224. stroke-width: 1.2;
  225. }
  226. .cesium-animation-knobInner {
  227. cursor: pointer;
  228. }
  229. .cesium-baseLayerPicker-selected {
  230. position: absolute;
  231. top: 0;
  232. left: 0;
  233. width: 100%;
  234. height: 100%;
  235. border: none;
  236. }
  237. .cesium-baseLayerPicker-dropDown {
  238. display: block;
  239. position: absolute;
  240. box-sizing: content-box;
  241. top: auto;
  242. right: 0;
  243. width: 320px;
  244. max-height: 500px;
  245. margin-top: 5px;
  246. background-color: rgba(38, 38, 38, 0.75);
  247. border: 1px solid #444;
  248. padding: 6px;
  249. overflow: auto;
  250. border-radius: 10px;
  251. -moz-user-select: none;
  252. -webkit-user-select: none;
  253. -ms-user-select: none;
  254. user-select: none;
  255. transform: translate(0, -20%);
  256. visibility: hidden;
  257. opacity: 0;
  258. transition: visibility 0s 0.2s, opacity 0.2s ease-in, transform 0.2s ease-in;
  259. }
  260. .cesium-baseLayerPicker-dropDown-visible {
  261. transform: translate(0, 0);
  262. visibility: visible;
  263. opacity: 1;
  264. transition: opacity 0.2s ease-out, transform 0.2s ease-out;
  265. }
  266. .cesium-baseLayerPicker-sectionTitle {
  267. display: block;
  268. font-family: sans-serif;
  269. font-size: 16pt;
  270. text-align: left;
  271. color: #edffff;
  272. margin-bottom: 4px;
  273. }
  274. .cesium-baseLayerPicker-choices {
  275. margin-bottom: 5px;
  276. }
  277. .cesium-baseLayerPicker-categoryTitle {
  278. color: #edffff;
  279. font-size: 11pt;
  280. }
  281. .cesium-baseLayerPicker-choices {
  282. display: block;
  283. border: 1px solid #888;
  284. border-radius: 5px;
  285. padding: 5px 0;
  286. }
  287. .cesium-baseLayerPicker-item {
  288. display: inline-block;
  289. vertical-align: top;
  290. margin: 2px 5px;
  291. width: 64px;
  292. text-align: center;
  293. cursor: pointer;
  294. }
  295. .cesium-baseLayerPicker-itemLabel {
  296. display: block;
  297. font-family: sans-serif;
  298. font-size: 8pt;
  299. text-align: center;
  300. vertical-align: middle;
  301. color: #edffff;
  302. cursor: pointer;
  303. word-wrap: break-word;
  304. }
  305. .cesium-baseLayerPicker-item:focus .cesium-baseLayerPicker-itemLabel,
  306. .cesium-baseLayerPicker-item:hover .cesium-baseLayerPicker-itemLabel {
  307. text-decoration: underline;
  308. }
  309. .cesium-baseLayerPicker-itemIcon {
  310. display: inline-block;
  311. position: relative;
  312. width: inherit;
  313. height: auto;
  314. background-size: 100% 100%;
  315. border: solid 1px #444;
  316. border-radius: 9px;
  317. color: #edffff;
  318. margin: 0;
  319. padding: 0;
  320. cursor: pointer;
  321. box-sizing: border-box;
  322. }
  323. .cesium-baseLayerPicker-item:hover .cesium-baseLayerPicker-itemIcon {
  324. border-color: #fff;
  325. box-shadow: 0 0 8px #fff, 0 0 8px #fff;
  326. }
  327. .cesium-baseLayerPicker-selectedItem .cesium-baseLayerPicker-itemLabel {
  328. color: #bdecf8;
  329. }
  330. .cesium-baseLayerPicker-selectedItem .cesium-baseLayerPicker-itemIcon {
  331. border: double 4px #bdecf8;
  332. }
  333. .cesium-widget {
  334. position: relative;
  335. }
  336. .cesium-widget,
  337. .cesium-widget canvas {
  338. width: 100%;
  339. height: 100%;
  340. touch-action: none;
  341. }
  342. .cesium-widget-errorPanel {
  343. position: absolute;
  344. top: 0;
  345. right: 0;
  346. bottom: 0;
  347. left: 0;
  348. text-align: center;
  349. background: rgba(0, 0, 0, 0.7);
  350. z-index: 99999;
  351. }
  352. .cesium-widget-errorPanel:before {
  353. display: inline-block;
  354. vertical-align: middle;
  355. height: 100%;
  356. content: "";
  357. }
  358. .cesium-widget-errorPanel-content {
  359. width: 75%;
  360. max-width: 500px;
  361. display: inline-block;
  362. text-align: left;
  363. vertical-align: middle;
  364. border: 1px solid #510c00;
  365. border-radius: 7px;
  366. background-color: #f0d9d5;
  367. font-size: 14px;
  368. color: #510c00;
  369. }
  370. .cesium-widget-errorPanel-content.expanded {
  371. max-width: 75%;
  372. }
  373. .cesium-widget-errorPanel-header {
  374. font-size: 18px;
  375. font-family: "Open Sans", Verdana, Geneva, sans-serif;
  376. background: #d69d93;
  377. border-bottom: 2px solid #510c00;
  378. padding-bottom: 10px;
  379. border-radius: 3px 3px 0 0;
  380. padding: 15px;
  381. }
  382. .cesium-widget-errorPanel-scroll {
  383. overflow: auto;
  384. font-family: "Open Sans", Verdana, Geneva, sans-serif;
  385. white-space: pre-wrap;
  386. padding: 0 15px;
  387. margin: 10px 0 20px 0;
  388. }
  389. .cesium-widget-errorPanel-buttonPanel {
  390. padding: 0 15px;
  391. margin: 10px 0 20px 0;
  392. text-align: right;
  393. }
  394. .cesium-widget-errorPanel-buttonPanel button {
  395. border-color: #510c00;
  396. background: #d69d93;
  397. color: #202020;
  398. margin: 0;
  399. }
  400. .cesium-widget-errorPanel-buttonPanel button:focus {
  401. border-color: #510c00;
  402. background: #f0d9d5;
  403. color: #510c00;
  404. }
  405. .cesium-widget-errorPanel-buttonPanel button:hover {
  406. border-color: #510c00;
  407. background: #f0d9d5;
  408. color: #510c00;
  409. }
  410. .cesium-widget-errorPanel-buttonPanel button:active {
  411. border-color: #510c00;
  412. background: #b17b72;
  413. color: #510c00;
  414. }
  415. .cesium-widget-errorPanel-more-details {
  416. text-decoration: underline;
  417. cursor: pointer;
  418. }
  419. .cesium-widget-errorPanel-more-details:hover {
  420. color: #2b0700;
  421. }
  422. .cesium-cesiumInspector {
  423. border-radius: 5px;
  424. transition: width ease-in-out 0.25s;
  425. background: rgba(48, 51, 54, 0.8);
  426. border: 1px solid #444;
  427. color: #edffff;
  428. display: inline-block;
  429. position: relative;
  430. padding: 4px 12px;
  431. -moz-user-select: none;
  432. -webkit-user-select: none;
  433. -ms-user-select: none;
  434. user-select: none;
  435. overflow: hidden;
  436. }
  437. .cesium-cesiumInspector-button {
  438. text-align: center;
  439. font-size: 11pt;
  440. }
  441. .cesium-cesiumInspector-visible .cesium-cesiumInspector-button {
  442. border-bottom: 1px solid #aaa;
  443. padding-bottom: 3px;
  444. }
  445. .cesium-cesiumInspector input:enabled,
  446. .cesium-cesiumInspector-button {
  447. cursor: pointer;
  448. }
  449. .cesium-cesiumInspector-visible {
  450. width: 185px;
  451. height: auto;
  452. }
  453. .cesium-cesiumInspector-hidden {
  454. width: 122px;
  455. height: 17px;
  456. }
  457. .cesium-cesiumInspector-sectionContent {
  458. max-height: 500px;
  459. }
  460. .cesium-cesiumInspector-section-collapsed
  461. .cesium-cesiumInspector-sectionContent {
  462. max-height: 0;
  463. padding: 0 !important;
  464. overflow: hidden;
  465. }
  466. .cesium-cesiumInspector-dropDown {
  467. margin: 5px 0;
  468. font-family: sans-serif;
  469. font-size: 10pt;
  470. width: 185px;
  471. }
  472. .cesium-cesiumInspector-frustumStatistics {
  473. padding-left: 10px;
  474. padding: 5px;
  475. background-color: rgba(80, 80, 80, 0.75);
  476. }
  477. .cesium-cesiumInspector-pickButton {
  478. background-color: rgba(0, 0, 0, 0.3);
  479. border: 1px solid #444;
  480. color: #edffff;
  481. border-radius: 5px;
  482. padding: 3px 7px;
  483. cursor: pointer;
  484. -moz-user-select: none;
  485. -webkit-user-select: none;
  486. -ms-user-select: none;
  487. user-select: none;
  488. margin: 0 auto;
  489. }
  490. .cesium-cesiumInspector-pickButton:focus {
  491. outline: 0;
  492. }
  493. .cesium-cesiumInspector-pickButton:active,
  494. .cesium-cesiumInspector-pickButtonHighlight {
  495. color: #000;
  496. background: #adf;
  497. border-color: #fff;
  498. box-shadow: 0 0 8px #fff;
  499. }
  500. .cesium-cesiumInspector-center {
  501. text-align: center;
  502. }
  503. .cesium-cesiumInspector-sectionHeader {
  504. font-weight: 700;
  505. font-size: 10pt;
  506. margin: 0;
  507. cursor: pointer;
  508. }
  509. .cesium-cesiumInspector-pickSection {
  510. border: 1px solid #aaa;
  511. border-radius: 5px;
  512. padding: 3px;
  513. margin-bottom: 5px;
  514. }
  515. .cesium-cesiumInspector-sectionContent {
  516. margin-bottom: 10px;
  517. transition: max-height 0.25s;
  518. }
  519. .cesium-cesiumInspector-tileText {
  520. padding-bottom: 10px;
  521. border-bottom: 1px solid #aaa;
  522. }
  523. .cesium-cesiumInspector-relativeText {
  524. padding-top: 10px;
  525. }
  526. .cesium-cesiumInspector-sectionHeader::before {
  527. margin-right: 5px;
  528. content: "-";
  529. width: 1ch;
  530. display: inline-block;
  531. }
  532. .cesium-cesiumInspector-section-collapsed
  533. .cesium-cesiumInspector-sectionHeader::before {
  534. content: "+";
  535. }
  536. ul.cesium-cesiumInspector-statistics {
  537. margin: 0;
  538. padding-top: 3px;
  539. padding-bottom: 3px;
  540. }
  541. ul.cesium-cesiumInspector-statistics + ul.cesium-cesiumInspector-statistics {
  542. border-top: 1px solid #aaa;
  543. }
  544. .cesium-cesiumInspector-slider {
  545. margin-top: 5px;
  546. }
  547. .cesium-cesiumInspector-slider input[type="number"] {
  548. text-align: left;
  549. background-color: #222;
  550. outline: 0;
  551. border: 1px solid #444;
  552. color: #edffff;
  553. width: 100px;
  554. border-radius: 3px;
  555. padding: 1px;
  556. margin-left: 10px;
  557. cursor: auto;
  558. }
  559. .cesium-cesiumInspector-slider input[type="number"]::-webkit-inner-spin-button,
  560. .cesium-cesiumInspector-slider input[type="number"]::-webkit-outer-spin-button {
  561. -webkit-appearance: none;
  562. margin: 0;
  563. }
  564. .cesium-cesiumInspector-slider input[type="range"] {
  565. margin-left: 5px;
  566. vertical-align: middle;
  567. }
  568. .cesium-cesiumInspector-hide .cesium-cesiumInspector-styleEditor {
  569. display: none;
  570. }
  571. .cesium-cesiumInspector-styleEditor {
  572. padding: 10px;
  573. border-radius: 5px;
  574. background: rgba(48, 51, 54, 0.8);
  575. border: 1px solid #444;
  576. }
  577. .cesium-cesiumInspector-styleEditor textarea {
  578. width: 100%;
  579. height: 300px;
  580. background: 0 0;
  581. color: #edffff;
  582. border: none;
  583. padding: 0;
  584. white-space: pre;
  585. overflow-wrap: normal;
  586. overflow-x: auto;
  587. }
  588. .cesium-3DTilesInspector {
  589. width: 300px;
  590. pointer-events: all;
  591. }
  592. .cesium-3DTilesInspector-statistics {
  593. font-size: 11px;
  594. }
  595. .cesium-3DTilesInspector div,
  596. .cesium-3DTilesInspector input[type="range"] {
  597. width: 100%;
  598. box-sizing: border-box;
  599. }
  600. .cesium-cesiumInspector-error {
  601. color: #ff9e9e;
  602. overflow: auto;
  603. }
  604. .cesium-3DTilesInspector .cesium-cesiumInspector-section {
  605. margin-top: 3px;
  606. }
  607. .cesium-3DTilesInspector
  608. .cesium-cesiumInspector-sectionHeader
  609. + .cesium-cesiumInspector-show {
  610. border-top: 1px solid #fff;
  611. }
  612. input.cesium-cesiumInspector-url {
  613. overflow: hidden;
  614. white-space: nowrap;
  615. overflow-x: scroll;
  616. background-color: transparent;
  617. color: #fff;
  618. outline: 0;
  619. border: none;
  620. height: 1em;
  621. width: 100%;
  622. }
  623. .cesium-cesiumInspector .field-group {
  624. display: table;
  625. }
  626. .cesium-cesiumInspector .field-group > label {
  627. display: table-cell;
  628. font-weight: 700;
  629. }
  630. .cesium-cesiumInspector .field-group > .field {
  631. display: table-cell;
  632. width: 100%;
  633. }
  634. .cesium-button.cesium-fullscreenButton {
  635. display: block;
  636. width: 100%;
  637. height: 100%;
  638. margin: 0;
  639. border-radius: 0;
  640. }
  641. .cesium-button.cesium-vrButton {
  642. display: block;
  643. width: 100%;
  644. height: 100%;
  645. margin: 0;
  646. border-radius: 0;
  647. }
  648. .cesium-viewer-geocoderContainer .cesium-geocoder-input {
  649. border: solid 1px #444;
  650. background-color: rgba(40, 40, 40, 0.7);
  651. color: #fff;
  652. display: inline-block;
  653. vertical-align: middle;
  654. width: 0;
  655. height: 32px;
  656. margin: 0;
  657. padding: 0 32px 0 0;
  658. border-radius: 0;
  659. box-sizing: border-box;
  660. transition: width ease-in-out 0.25s, background-color 0.2s ease-in-out;
  661. -webkit-appearance: none;
  662. }
  663. .cesium-viewer-geocoderContainer:hover .cesium-geocoder-input {
  664. border-color: #aef;
  665. box-shadow: 0 0 8px #fff;
  666. }
  667. .cesium-viewer-geocoderContainer .cesium-geocoder-input:focus {
  668. border-color: #ea4;
  669. background-color: rgba(15, 15, 15, 0.9);
  670. box-shadow: none;
  671. outline: 0;
  672. }
  673. .cesium-viewer-geocoderContainer .cesium-geocoder-input-wide,
  674. .cesium-viewer-geocoderContainer .cesium-geocoder-input:focus,
  675. .cesium-viewer-geocoderContainer:hover .cesium-geocoder-input {
  676. padding-left: 4px;
  677. width: 250px;
  678. }
  679. .cesium-viewer-geocoderContainer .search-results {
  680. position: absolute;
  681. background-color: #000;
  682. color: #eee;
  683. overflow-y: auto;
  684. opacity: 0.8;
  685. width: 100%;
  686. }
  687. .cesium-viewer-geocoderContainer .search-results ul {
  688. list-style-type: none;
  689. margin: 0;
  690. padding: 0;
  691. }
  692. .cesium-viewer-geocoderContainer .search-results ul li {
  693. font-size: 14px;
  694. padding: 3px 10px;
  695. }
  696. .cesium-viewer-geocoderContainer .search-results ul li:hover {
  697. cursor: pointer;
  698. }
  699. .cesium-viewer-geocoderContainer .search-results ul li.active {
  700. background: #48b;
  701. }
  702. .cesium-geocoder-searchButton {
  703. background-color: #303336;
  704. display: inline-block;
  705. position: absolute;
  706. cursor: pointer;
  707. width: 32px;
  708. top: 1px;
  709. right: 1px;
  710. height: 30px;
  711. vertical-align: middle;
  712. fill: #edffff;
  713. }
  714. .cesium-geocoder-searchButton:hover {
  715. background-color: #48b;
  716. }
  717. .cesium-infoBox {
  718. display: block;
  719. position: absolute;
  720. top: 50px;
  721. right: 0;
  722. width: 40%;
  723. max-width: 480px;
  724. background: rgba(38, 38, 38, 0.95);
  725. color: #edffff;
  726. border: 1px solid #444;
  727. border-right: none;
  728. border-top-left-radius: 7px;
  729. border-bottom-left-radius: 7px;
  730. box-shadow: 0 0 10px 1px #000;
  731. transform: translate(100%, 0);
  732. visibility: hidden;
  733. opacity: 0;
  734. transition: visibility 0s 0.2s, opacity 0.2s ease-in, transform 0.2s ease-in;
  735. }
  736. .cesium-infoBox-visible {
  737. transform: translate(0, 0);
  738. visibility: visible;
  739. opacity: 1;
  740. transition: opacity 0.2s ease-out, transform 0.2s ease-out;
  741. }
  742. .cesium-infoBox-title {
  743. display: block;
  744. height: 20px;
  745. padding: 5px 30px 5px 25px;
  746. background: #545454;
  747. border-top-left-radius: 7px;
  748. text-align: center;
  749. text-overflow: ellipsis;
  750. white-space: nowrap;
  751. overflow: hidden;
  752. box-sizing: content-box;
  753. }
  754. .cesium-infoBox-bodyless .cesium-infoBox-title {
  755. border-bottom-left-radius: 7px;
  756. }
  757. button.cesium-infoBox-camera {
  758. display: block;
  759. position: absolute;
  760. top: 4px;
  761. left: 4px;
  762. width: 22px;
  763. height: 22px;
  764. background: 0 0;
  765. border-color: transparent;
  766. border-radius: 3px;
  767. padding: 0 5px;
  768. margin: 0;
  769. }
  770. button.cesium-infoBox-close {
  771. display: block;
  772. position: absolute;
  773. top: 5px;
  774. right: 5px;
  775. height: 20px;
  776. background: 0 0;
  777. border: none;
  778. border-radius: 2px;
  779. font-weight: 700;
  780. font-size: 16px;
  781. padding: 0 5px;
  782. margin: 0;
  783. color: #edffff;
  784. }
  785. button.cesium-infoBox-close:focus {
  786. background: rgba(238, 136, 0, 0.44);
  787. outline: 0;
  788. }
  789. button.cesium-infoBox-close:hover {
  790. background: #888;
  791. color: #000;
  792. }
  793. button.cesium-infoBox-close:active {
  794. background: #a00;
  795. color: #000;
  796. }
  797. .cesium-infoBox-bodyless .cesium-infoBox-iframe {
  798. display: none;
  799. }
  800. .cesium-infoBox-iframe {
  801. border: none;
  802. width: 100%;
  803. width: calc(100% - 2px);
  804. }
  805. span.cesium-sceneModePicker-wrapper {
  806. display: inline-block;
  807. position: relative;
  808. margin: 0 3px;
  809. }
  810. .cesium-sceneModePicker-visible {
  811. visibility: visible;
  812. opacity: 1;
  813. transition: opacity 0.25s linear;
  814. }
  815. .cesium-sceneModePicker-hidden {
  816. visibility: hidden;
  817. opacity: 0;
  818. transition: visibility 0s 0.25s, opacity 0.25s linear;
  819. }
  820. .cesium-sceneModePicker-wrapper .cesium-sceneModePicker-none {
  821. display: none;
  822. }
  823. .cesium-sceneModePicker-slide-svg {
  824. transition: left 2s;
  825. top: 0;
  826. left: 0;
  827. }
  828. .cesium-sceneModePicker-wrapper .cesium-sceneModePicker-dropDown-icon {
  829. box-sizing: border-box;
  830. padding: 0;
  831. margin: 3px 0;
  832. }
  833. .cesium-sceneModePicker-wrapper .cesium-sceneModePicker-button2D,
  834. .cesium-sceneModePicker-wrapper .cesium-sceneModePicker-button3D,
  835. .cesium-sceneModePicker-wrapper .cesium-sceneModePicker-buttonColumbusView {
  836. margin: 0 0 3px 0;
  837. }
  838. .cesium-sceneModePicker-wrapper
  839. .cesium-sceneModePicker-button3D
  840. .cesium-sceneModePicker-icon2D {
  841. left: 100%;
  842. }
  843. .cesium-sceneModePicker-wrapper
  844. .cesium-sceneModePicker-button3D
  845. .cesium-sceneModePicker-iconColumbusView {
  846. left: 200%;
  847. }
  848. .cesium-sceneModePicker-wrapper
  849. .cesium-sceneModePicker-buttonColumbusView
  850. .cesium-sceneModePicker-icon3D {
  851. left: -200%;
  852. }
  853. .cesium-sceneModePicker-wrapper
  854. .cesium-sceneModePicker-buttonColumbusView
  855. .cesium-sceneModePicker-icon2D {
  856. left: -100%;
  857. }
  858. .cesium-sceneModePicker-wrapper
  859. .cesium-sceneModePicker-button2D
  860. .cesium-sceneModePicker-icon3D {
  861. left: -100%;
  862. }
  863. .cesium-sceneModePicker-wrapper
  864. .cesium-sceneModePicker-button2D
  865. .cesium-sceneModePicker-iconColumbusView {
  866. left: 100%;
  867. }
  868. .cesium-sceneModePicker-wrapper .cesium-sceneModePicker-selected {
  869. border-color: #2e2;
  870. box-shadow: 0 0 8px #fff, 0 0 8px #fff;
  871. }
  872. span.cesium-projectionPicker-wrapper {
  873. display: inline-block;
  874. position: relative;
  875. margin: 0 3px;
  876. }
  877. .cesium-projectionPicker-visible {
  878. visibility: visible;
  879. opacity: 1;
  880. transition: opacity 0.25s linear;
  881. }
  882. .cesium-projectionPicker-hidden {
  883. visibility: hidden;
  884. opacity: 0;
  885. transition: visibility 0s 0.25s, opacity 0.25s linear;
  886. }
  887. .cesium-projectionPicker-wrapper .cesium-projectionPicker-none {
  888. display: none;
  889. }
  890. .cesium-projectionPicker-wrapper .cesium-projectionPicker-dropDown-icon {
  891. box-sizing: border-box;
  892. padding: 0;
  893. margin: 3px 0;
  894. }
  895. .cesium-projectionPicker-wrapper .cesium-projectionPicker-buttonOrthographic,
  896. .cesium-projectionPicker-wrapper .cesium-projectionPicker-buttonPerspective {
  897. margin: 0 0 3px 0;
  898. }
  899. .cesium-projectionPicker-wrapper
  900. .cesium-projectionPicker-buttonPerspective
  901. .cesium-projectionPicker-iconOrthographic {
  902. left: 100%;
  903. }
  904. .cesium-projectionPicker-wrapper
  905. .cesium-projectionPicker-buttonOrthographic
  906. .cesium-projectionPicker-iconPerspective {
  907. left: -100%;
  908. }
  909. .cesium-projectionPicker-wrapper .cesium-projectionPicker-selected {
  910. border-color: #2e2;
  911. box-shadow: 0 0 8px #fff, 0 0 8px #fff;
  912. }
  913. .cesium-performance-watchdog-message-area {
  914. position: relative;
  915. background-color: #ff0;
  916. color: #000;
  917. padding: 10px;
  918. }
  919. .cesium-performance-watchdog-message {
  920. margin-right: 30px;
  921. }
  922. .cesium-performance-watchdog-message-dismiss {
  923. position: absolute;
  924. right: 0;
  925. margin: 0 10px 0 0;
  926. }
  927. .cesium-navigationHelpButton-wrapper {
  928. position: relative;
  929. display: inline-block;
  930. }
  931. .cesium-navigation-help {
  932. visibility: hidden;
  933. position: absolute;
  934. top: 38px;
  935. right: 2px;
  936. width: 250px;
  937. border-radius: 10px;
  938. transform: scale(0.01);
  939. transform-origin: 234px -10px;
  940. transition: visibility 0s 0.25s, transform 0.25s ease-in;
  941. }
  942. .cesium-navigation-help-visible {
  943. visibility: visible;
  944. transform: scale(1);
  945. transition: transform 0.25s ease-out;
  946. }
  947. .cesium-navigation-help-instructions {
  948. border: 1px solid #444;
  949. background-color: rgba(38, 38, 38, 0.75);
  950. padding-bottom: 5px;
  951. border-radius: 0 0 10px 10px;
  952. }
  953. .cesium-click-navigation-help {
  954. display: none;
  955. }
  956. .cesium-touch-navigation-help {
  957. display: none;
  958. padding-top: 5px;
  959. }
  960. .cesium-click-navigation-help-visible {
  961. display: block;
  962. }
  963. .cesium-touch-navigation-help-visible {
  964. display: block;
  965. }
  966. .cesium-navigation-help-pan {
  967. color: #6cf;
  968. font-weight: 700;
  969. }
  970. .cesium-navigation-help-zoom {
  971. color: #65fd00;
  972. font-weight: 700;
  973. }
  974. .cesium-navigation-help-rotate {
  975. color: #ffd800;
  976. font-weight: 700;
  977. }
  978. .cesium-navigation-help-tilt {
  979. color: #d800d8;
  980. font-weight: 700;
  981. }
  982. .cesium-navigation-help-details {
  983. color: #fff;
  984. }
  985. .cesium-navigation-button {
  986. color: #fff;
  987. background-color: transparent;
  988. border-bottom: none;
  989. border-top: 1px solid #444;
  990. border-right: 1px solid #444;
  991. margin: 0;
  992. width: 50%;
  993. cursor: pointer;
  994. }
  995. .cesium-navigation-button-icon {
  996. vertical-align: middle;
  997. padding: 5px 1px;
  998. }
  999. .cesium-navigation-button:focus {
  1000. outline: 0;
  1001. }
  1002. .cesium-navigation-button-left {
  1003. border-radius: 10px 0 0 0;
  1004. border-left: 1px solid #444;
  1005. }
  1006. .cesium-navigation-button-right {
  1007. border-radius: 0 10px 0 0;
  1008. border-left: none;
  1009. }
  1010. .cesium-navigation-button-selected {
  1011. background-color: rgba(38, 38, 38, 0.75);
  1012. }
  1013. .cesium-navigation-button-unselected {
  1014. background-color: rgba(0, 0, 0, 0.75);
  1015. }
  1016. .cesium-navigation-button-unselected:hover {
  1017. background-color: rgba(76, 76, 76, 0.75);
  1018. }
  1019. .cesium-selection-wrapper {
  1020. position: absolute;
  1021. width: 160px;
  1022. height: 160px;
  1023. pointer-events: none;
  1024. visibility: hidden;
  1025. opacity: 0;
  1026. transition: visibility 0s 0.2s, opacity 0.2s ease-in;
  1027. }
  1028. .cesium-selection-wrapper-visible {
  1029. visibility: visible;
  1030. opacity: 1;
  1031. transition: opacity 0.2s ease-out;
  1032. }
  1033. .cesium-selection-wrapper svg {
  1034. fill: #2e2;
  1035. stroke: #000;
  1036. stroke-width: 1.1px;
  1037. }
  1038. .cesium-timeline-main {
  1039. position: relative;
  1040. left: 0;
  1041. bottom: 0;
  1042. overflow: hidden;
  1043. border: solid 1px #888;
  1044. }
  1045. .cesium-timeline-trackContainer {
  1046. width: 100%;
  1047. overflow: auto;
  1048. border-top: solid 1px #888;
  1049. position: relative;
  1050. top: 0;
  1051. left: 0;
  1052. }
  1053. .cesium-timeline-tracks {
  1054. position: absolute;
  1055. top: 0;
  1056. left: 0;
  1057. width: 100%;
  1058. }
  1059. .cesium-timeline-needle {
  1060. position: absolute;
  1061. left: 0;
  1062. top: 1.7em;
  1063. bottom: 0;
  1064. width: 1px;
  1065. background: red;
  1066. }
  1067. .cesium-timeline-bar {
  1068. position: relative;
  1069. left: 0;
  1070. top: 0;
  1071. overflow: hidden;
  1072. cursor: pointer;
  1073. width: 100%;
  1074. height: 1.7em;
  1075. background: linear-gradient(
  1076. to bottom,
  1077. rgba(116, 117, 119, 0.8) 0,
  1078. rgba(58, 68, 82, 0.8) 11%,
  1079. rgba(46, 50, 56, 0.8) 46%,
  1080. rgba(53, 53, 53, 0.8) 81%,
  1081. rgba(53, 53, 53, 0.8) 100%
  1082. );
  1083. }
  1084. .cesium-timeline-ruler {
  1085. visibility: hidden;
  1086. white-space: nowrap;
  1087. font-size: 80%;
  1088. z-index: -200;
  1089. }
  1090. .cesium-timeline-highlight {
  1091. position: absolute;
  1092. bottom: 0;
  1093. left: 0;
  1094. background: #08f;
  1095. }
  1096. .cesium-timeline-ticLabel {
  1097. position: absolute;
  1098. top: 0;
  1099. left: 0;
  1100. white-space: nowrap;
  1101. font-size: 80%;
  1102. color: #eee;
  1103. }
  1104. .cesium-timeline-ticMain {
  1105. position: absolute;
  1106. bottom: 0;
  1107. left: 0;
  1108. width: 1px;
  1109. height: 50%;
  1110. background: #eee;
  1111. }
  1112. .cesium-timeline-ticSub {
  1113. position: absolute;
  1114. bottom: 0;
  1115. left: 0;
  1116. width: 1px;
  1117. height: 33%;
  1118. background: #aaa;
  1119. }
  1120. .cesium-timeline-ticTiny {
  1121. position: absolute;
  1122. bottom: 0;
  1123. left: 0;
  1124. width: 1px;
  1125. height: 25%;
  1126. background: #888;
  1127. }
  1128. .cesium-viewer {
  1129. font-family: sans-serif;
  1130. font-size: 16px;
  1131. overflow: hidden;
  1132. display: block;
  1133. position: relative;
  1134. top: 0;
  1135. left: 0;
  1136. width: 100%;
  1137. height: 100%;
  1138. }
  1139. .cesium-viewer-cesiumWidgetContainer {
  1140. width: 100%;
  1141. height: 100%;
  1142. }
  1143. .cesium-viewer-bottom {
  1144. display: none;
  1145. position: absolute;
  1146. bottom: 0;
  1147. left: 0;
  1148. padding-right: 5px;
  1149. }
  1150. .cesium-viewer-timelineContainer {
  1151. position: absolute;
  1152. bottom: 0;
  1153. left: 169px;
  1154. right: 29px;
  1155. height: 27px;
  1156. padding: 0;
  1157. margin: 0;
  1158. overflow: hidden;
  1159. font-size: 14px;
  1160. }
  1161. .cesium-viewer-animationContainer {
  1162. position: absolute;
  1163. bottom: 0;
  1164. left: 0;
  1165. padding: 0;
  1166. width: 169px;
  1167. height: 112px;
  1168. }
  1169. .cesium-viewer-fullscreenContainer {
  1170. position: absolute;
  1171. bottom: 0;
  1172. right: 0;
  1173. padding: 0;
  1174. width: 29px;
  1175. height: 29px;
  1176. overflow: hidden;
  1177. }
  1178. .cesium-viewer-vrContainer {
  1179. position: absolute;
  1180. bottom: 0;
  1181. right: 0;
  1182. padding: 0;
  1183. width: 29px;
  1184. height: 29px;
  1185. overflow: hidden;
  1186. }
  1187. .cesium-viewer-toolbar {
  1188. display: block;
  1189. position: absolute;
  1190. top: 5px;
  1191. right: 5px;
  1192. }
  1193. .cesium-viewer-cesiumInspectorContainer {
  1194. display: block;
  1195. position: absolute;
  1196. top: 50px;
  1197. right: 10px;
  1198. }
  1199. .cesium-viewer-geocoderContainer {
  1200. position: relative;
  1201. display: inline-block;
  1202. margin: 0 3px;
  1203. }
  1204. .cesium-viewer-cesium3DTilesInspectorContainer {
  1205. display: block;
  1206. position: absolute;
  1207. top: 50px;
  1208. right: 10px;
  1209. max-height: calc(100% - 120px);
  1210. box-sizing: border-box;
  1211. overflow-y: auto;
  1212. overflow-x: hidden;
  1213. }