widgets.css 29 KB

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