kityminder.editor.css 31 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757677787980818283848586878889909192939495969798991001011021031041051061071081091101111121131141151161171181191201211221231241251261271281291301311321331341351361371381391401411421431441451461471481491501511521531541551561571581591601611621631641651661671681691701711721731741751761771781791801811821831841851861871881891901911921931941951961971981992002012022032042052062072082092102112122132142152162172182192202212222232242252262272282292302312322332342352362372382392402412422432442452462472482492502512522532542552562572582592602612622632642652662672682692702712722732742752762772782792802812822832842852862872882892902912922932942952962972982993003013023033043053063073083093103113123133143153163173183193203213223233243253263273283293303313323333343353363373383393403413423433443453463473483493503513523533543553563573583593603613623633643653663673683693703713723733743753763773783793803813823833843853863873883893903913923933943953963973983994004014024034044054064074084094104114124134144154164174184194204214224234244254264274284294304314324334344354364374384394404414424434444454464474484494504514524534544554564574584594604614624634644654664674684694704714724734744754764774784794804814824834844854864874884894904914924934944954964974984995005015025035045055065075085095105115125135145155165175185195205215225235245255265275285295305315325335345355365375385395405415425435445455465475485495505515525535545555565575585595605615625635645655665675685695705715725735745755765775785795805815825835845855865875885895905915925935945955965975985996006016026036046056066076086096106116126136146156166176186196206216226236246256266276286296306316326336346356366376386396406416426436446456466476486496506516526536546556566576586596606616626636646656666676686696706716726736746756766776786796806816826836846856866876886896906916926936946956966976986997007017027037047057067077087097107117127137147157167177187197207217227237247257267277287297307317327337347357367377387397407417427437447457467477487497507517527537547557567577587597607617627637647657667677687697707717727737747757767777787797807817827837847857867877887897907917927937947957967977987998008018028038048058068078088098108118128138148158168178188198208218228238248258268278288298308318328338348358368378388398408418428438448458468478488498508518528538548558568578588598608618628638648658668678688698708718728738748758768778788798808818828838848858868878888898908918928938948958968978988999009019029039049059069079089099109119129139149159169179189199209219229239249259269279289299309319329339349359369379389399409419429439449459469479489499509519529539549559569579589599609619629639649659669679689699709719729739749759769779789799809819829839849859869879889899909919929939949959969979989991000100110021003100410051006100710081009101010111012101310141015101610171018101910201021102210231024102510261027102810291030103110321033103410351036103710381039104010411042104310441045104610471048104910501051105210531054105510561057105810591060106110621063106410651066106710681069107010711072107310741075107610771078107910801081108210831084108510861087108810891090109110921093109410951096109710981099110011011102110311041105110611071108110911101111111211131114111511161117111811191120112111221123112411251126112711281129113011311132113311341135113611371138113911401141114211431144114511461147114811491150115111521153115411551156115711581159116011611162116311641165116611671168116911701171117211731174117511761177117811791180118111821183118411851186118711881189119011911192119311941195119611971198119912001201120212031204120512061207120812091210121112121213121412151216121712181219122012211222122312241225122612271228122912301231123212331234123512361237123812391240124112421243124412451246124712481249125012511252125312541255125612571258125912601261126212631264126512661267126812691270127112721273127412751276127712781279128012811282128312841285128612871288128912901291129212931294129512961297129812991300130113021303130413051306130713081309131013111312131313141315131613171318131913201321132213231324132513261327132813291330133113321333133413351336133713381339134013411342134313441345134613471348134913501351135213531354135513561357135813591360136113621363136413651366136713681369137013711372137313741375137613771378137913801381138213831384138513861387138813891390139113921393139413951396139713981399140014011402140314041405140614071408140914101411141214131414141514161417141814191420142114221423142414251426142714281429143014311432143314341435143614371438143914401441144214431444144514461447144814491450145114521453145414551456145714581459146014611462146314641465146614671468146914701471147214731474147514761477147814791480148114821483148414851486148714881489149014911492149314941495149614971498149915001501150215031504150515061507150815091510151115121513151415151516151715181519152015211522152315241525152615271528
  1. .km-editor {
  2. overflow: hidden;
  3. z-index: 2;
  4. }
  5. .km-editor > .mask {
  6. display: block;
  7. position: absolute;
  8. left: 0;
  9. right: 0;
  10. top: 0;
  11. bottom: 0;
  12. background-color: transparent;
  13. }
  14. .km-editor > .receiver {
  15. position: absolute;
  16. background: white;
  17. outline: none;
  18. box-shadow: 0 0 20px rgba(0, 0, 0, 0.5);
  19. left: 0;
  20. top: 0;
  21. padding: 3px 5px;
  22. margin-left: -3px;
  23. margin-top: -5px;
  24. max-width: 300px;
  25. width: auto;
  26. font-size: 14px;
  27. line-height: 1.4em;
  28. min-height: 1.4em;
  29. box-sizing: border-box;
  30. overflow: hidden;
  31. word-break: break-all;
  32. word-wrap: break-word;
  33. border: none;
  34. -webkit-user-select: text;
  35. pointer-events: none;
  36. opacity: 0;
  37. z-index: -1000;
  38. }
  39. .km-editor > .receiver.debug {
  40. opacity: 1;
  41. outline: 1px solid green;
  42. background: none;
  43. z-index: 0;
  44. }
  45. .km-editor > .receiver.input {
  46. pointer-events: all;
  47. opacity: 1;
  48. z-index: 999;
  49. background: white;
  50. outline: none;
  51. }
  52. div.minder-editor-container {
  53. position: absolute;
  54. top: 40px;
  55. bottom: 0;
  56. left: 0;
  57. right: 0;
  58. font-family: Arial, "Hiragino Sans GB", "Microsoft YaHei", "WenQuanYi Micro Hei", sans-serif;
  59. }
  60. .minder-editor {
  61. position: absolute;
  62. top: 92px;
  63. left: 0;
  64. right: 0;
  65. bottom: 0;
  66. }
  67. .minder-viewer {
  68. position: absolute;
  69. top: 0;
  70. left: 0;
  71. right: 0;
  72. bottom: 0;
  73. }
  74. .control-panel {
  75. position: absolute;
  76. top: 0;
  77. right: 0;
  78. width: 250px;
  79. bottom: 0;
  80. border-left: 1px solid #CCC;
  81. }
  82. .minder-divider {
  83. position: absolute;
  84. top: 0;
  85. right: 250px;
  86. bottom: 0;
  87. width: 2px;
  88. background-color: #fbfbfb;
  89. cursor: ew-resize;
  90. }
  91. .panel-body {
  92. padding: 10px;
  93. }
  94. .upload-image {
  95. width: 0.1px;
  96. height: 0.1px;
  97. opacity: 0;
  98. overflow: hidden;
  99. position: absolute;
  100. z-index: -1;
  101. }
  102. .top-tab .nav-tabs {
  103. background-color: #e1e1e1;
  104. border: 0;
  105. height: 32px;
  106. }
  107. .top-tab .nav-tabs li {
  108. margin: 0;
  109. }
  110. .top-tab .nav-tabs li a {
  111. margin: 0;
  112. border: 0;
  113. padding: 6px 15px;
  114. border-radius: 0;
  115. vertical-align: middle;
  116. }
  117. .top-tab .nav-tabs li a:hover,
  118. .top-tab .nav-tabs li a:focus {
  119. background: inherit;
  120. border: 0;
  121. }
  122. .top-tab .nav-tabs li.active a {
  123. border: 0;
  124. background-color: #fff;
  125. }
  126. .top-tab .nav-tabs li.active a:hover,
  127. .top-tab .nav-tabs li.active a:focus {
  128. border: 0;
  129. }
  130. .top-tab .tab-content {
  131. height: 60px;
  132. background-color: #fff;
  133. border-bottom: 1px solid #dbdbdb;
  134. }
  135. .top-tab .tab-pane {
  136. font-size: 0;
  137. }
  138. .km-btn-group {
  139. display: inline-block;
  140. margin: 5px 0;
  141. padding: 0 5px;
  142. vertical-align: middle;
  143. border-right: 1px dashed #eee;
  144. }
  145. .km-btn-item {
  146. display: inline-block;
  147. margin: 0 3px;
  148. font-size: 0;
  149. cursor: default;
  150. }
  151. .km-btn-item[disabled] {
  152. opacity: 0.5;
  153. }
  154. .km-btn-item[disabled]:hover,
  155. .km-btn-item[disabled]:active {
  156. background-color: #fff;
  157. }
  158. .km-btn-item .km-btn-icon {
  159. display: inline-block;
  160. background: url(images/icons.png) no-repeat;
  161. background-position: 0 20px;
  162. width: 20px;
  163. height: 20px;
  164. padding: 2px;
  165. margin: 1px;
  166. vertical-align: middle;
  167. }
  168. .km-btn-item .km-btn-caption {
  169. display: inline-block;
  170. font-size: 12px;
  171. vertical-align: middle;
  172. }
  173. .km-btn-item:hover {
  174. background-color: #eff3fa;
  175. }
  176. .km-btn-item:active {
  177. background-color: #c4d0ee;
  178. }
  179. .do-group {
  180. width: 38px;
  181. }
  182. .undo .km-btn-icon {
  183. background-position: 0 -1240px;
  184. }
  185. .redo .km-btn-icon {
  186. background-position: 0 -1220px;
  187. }
  188. .append-group {
  189. width: 212px;
  190. }
  191. .append-child-node .km-btn-icon {
  192. background-position: 0 0;
  193. }
  194. .append-sibling-node .km-btn-icon {
  195. background-position: 0 -20px;
  196. }
  197. .append-parent-node .km-btn-icon {
  198. background-position: 0 -40px;
  199. }
  200. .arrange-group {
  201. width: 64px;
  202. }
  203. .arrange-up .km-btn-icon {
  204. background-position: 0 -280px;
  205. }
  206. .arrange-down .km-btn-icon {
  207. background-position: 0 -300px;
  208. }
  209. .operation-group {
  210. width: 64px;
  211. }
  212. .edit-node .km-btn-icon {
  213. background-position: 0 -60px;
  214. }
  215. .remove-node .km-btn-icon {
  216. background-position: 0 -80px;
  217. }
  218. .btn-group-vertical {
  219. vertical-align: middle;
  220. margin: 5px;
  221. }
  222. .btn-group-vertical .hyperlink,
  223. .btn-group-vertical .hyperlink-caption {
  224. width: 40px;
  225. margin: 0;
  226. padding: 0;
  227. border: none!important;
  228. border-radius: 0!important;
  229. }
  230. .btn-group-vertical .hyperlink:hover,
  231. .btn-group-vertical .hyperlink-caption:hover {
  232. background-color: #eff3fa;
  233. }
  234. .btn-group-vertical .hyperlink:active,
  235. .btn-group-vertical .hyperlink-caption:active {
  236. background-color: #c4d0ee;
  237. }
  238. .btn-group-vertical .hyperlink.active,
  239. .btn-group-vertical .hyperlink-caption.active {
  240. box-shadow: none;
  241. background-color: #eff3fa;
  242. }
  243. .btn-group-vertical .hyperlink {
  244. height: 25px;
  245. background: url(images/icons.png) no-repeat center -100px;
  246. }
  247. .btn-group-vertical .hyperlink-caption {
  248. height: 20px;
  249. }
  250. .btn-group-vertical .hyperlink-caption .caption {
  251. font-size: 12px;
  252. }
  253. .open > .dropdown-toggle.btn-default {
  254. background-color: #eff3fa;
  255. }
  256. .btn-group-vertical .image-btn,
  257. .btn-group-vertical .image-btn-caption {
  258. width: 40px;
  259. margin: 0;
  260. padding: 0;
  261. border: none!important;
  262. border-radius: 0!important;
  263. }
  264. .btn-group-vertical .image-btn:hover,
  265. .btn-group-vertical .image-btn-caption:hover {
  266. background-color: #eff3fa;
  267. }
  268. .btn-group-vertical .image-btn:active,
  269. .btn-group-vertical .image-btn-caption:active {
  270. background-color: #c4d0ee;
  271. }
  272. .btn-group-vertical .image-btn.active,
  273. .btn-group-vertical .image-btn-caption.active {
  274. box-shadow: none;
  275. background-color: #eff3fa;
  276. }
  277. .btn-group-vertical .image-btn {
  278. height: 25px;
  279. background: url(images/icons.png) no-repeat center -125px;
  280. }
  281. .btn-group-vertical .image-btn-caption {
  282. height: 20px;
  283. }
  284. .btn-group-vertical .image-btn-caption .caption {
  285. font-size: 12px;
  286. }
  287. .image-preview {
  288. display: block;
  289. max-width: 50%;
  290. }
  291. .modal-body .tab-pane {
  292. font-size: inherit;
  293. padding-top: 15px;
  294. }
  295. .search-result {
  296. margin-top: 15px;
  297. height: 370px;
  298. overflow: hidden;
  299. }
  300. .search-result ul {
  301. margin: 0;
  302. padding: 0;
  303. list-style: none;
  304. clear: both;
  305. height: 100%;
  306. overflow-x: hidden;
  307. overflow-y: auto;
  308. }
  309. .search-result ul li {
  310. list-style: none;
  311. float: left;
  312. display: block;
  313. width: 130px;
  314. height: 130px;
  315. line-height: 130px;
  316. margin: 6px;
  317. padding: 0;
  318. font-size: 12px;
  319. position: relative;
  320. vertical-align: top;
  321. text-align: center;
  322. overflow: hidden;
  323. cursor: pointer;
  324. border: 2px solid #fcfcfc;
  325. }
  326. .search-result ul li.selected {
  327. border: 2px solid #fc8383;
  328. }
  329. .search-result ul li img {
  330. max-width: 126px;
  331. max-height: 130px;
  332. vertical-align: middle;
  333. }
  334. .search-result ul li span {
  335. display: block;
  336. position: absolute;
  337. bottom: 0;
  338. height: 20px;
  339. background: rgba(0, 0, 0, 0.5);
  340. left: 0;
  341. right: 0;
  342. color: white;
  343. line-height: 20px;
  344. overflow: hidden;
  345. text-overflow: ellipsis;
  346. word-break: break-all;
  347. white-space: nowrap;
  348. opacity: 0;
  349. -webkit-transform: translate(0, 20px);
  350. -ms-transform: translate(0, 20px);
  351. transform: translate(0, 20px);
  352. -webkit-transition: all .2s ease;
  353. transition: all .2s ease;
  354. }
  355. .search-result ul li:hover span {
  356. opacity: 1;
  357. -webkit-transform: translate(0, 0);
  358. -ms-transform: translate(0, 0);
  359. transform: translate(0, 0);
  360. }
  361. @media (min-width: 768px) {
  362. .form-inline .form-control {
  363. width: 422px;
  364. }
  365. }
  366. .btn-group-vertical {
  367. vertical-align: top;
  368. margin: 5px;
  369. }
  370. .btn-group-vertical.note-btn-group {
  371. border-right: 1px dashed #eee;
  372. padding-right: 5px;
  373. }
  374. .btn-group-vertical .note-btn,
  375. .btn-group-vertical .note-btn-caption {
  376. width: 40px;
  377. margin: 0;
  378. padding: 0;
  379. border: none!important;
  380. border-radius: 0!important;
  381. }
  382. .btn-group-vertical .note-btn:hover,
  383. .btn-group-vertical .note-btn-caption:hover {
  384. background-color: #eff3fa;
  385. }
  386. .btn-group-vertical .note-btn:active,
  387. .btn-group-vertical .note-btn-caption:active {
  388. background-color: #c4d0ee;
  389. }
  390. .btn-group-vertical .note-btn.active,
  391. .btn-group-vertical .note-btn-caption.active {
  392. box-shadow: none;
  393. background-color: #eff3fa;
  394. }
  395. .btn-group-vertical .note-btn {
  396. height: 25px;
  397. background: url(images/icons.png) no-repeat center -1150px;
  398. }
  399. .btn-group-vertical .note-btn-caption {
  400. height: 20px;
  401. }
  402. .btn-group-vertical .note-btn-caption .caption {
  403. font-size: 12px;
  404. }
  405. .open > .dropdown-toggle.btn-default {
  406. background-color: #eff3fa;
  407. }
  408. .gfm-render {
  409. font-size: 12px;
  410. -webkit-user-select: text;
  411. color: #333;
  412. line-height: 1.8em;
  413. }
  414. .gfm-render blockquote,
  415. .gfm-render ul,
  416. .gfm-render table,
  417. .gfm-render p,
  418. .gfm-render pre,
  419. .gfm-render hr {
  420. margin: 1em 0;
  421. cursor: text;
  422. }
  423. .gfm-render blockquote:first-child:last-child,
  424. .gfm-render ul:first-child:last-child,
  425. .gfm-render table:first-child:last-child,
  426. .gfm-render p:first-child:last-child,
  427. .gfm-render pre:first-child:last-child,
  428. .gfm-render hr:first-child:last-child {
  429. margin: 0;
  430. }
  431. .gfm-render img {
  432. max-width: 100%;
  433. }
  434. .gfm-render a {
  435. color: blue;
  436. }
  437. .gfm-render a:hover {
  438. color: red;
  439. }
  440. .gfm-render blockquote {
  441. display: block;
  442. border-left: 4px solid #E4AD91;
  443. color: #da8e68;
  444. padding-left: 10px;
  445. font-style: italic;
  446. margin-left: 2em;
  447. }
  448. .gfm-render ul,
  449. .gfm-render ol {
  450. padding-left: 3em;
  451. }
  452. .gfm-render table {
  453. width: 100%;
  454. border-collapse: collapse;
  455. margin: 1em 0;
  456. }
  457. .gfm-render table th,
  458. .gfm-render table td {
  459. border: 1px solid #666;
  460. padding: 2px 4px;
  461. }
  462. .gfm-render table th {
  463. background: rgba(45, 141, 234, 0.2);
  464. }
  465. .gfm-render table tr:nth-child(even) td {
  466. background: rgba(45, 141, 234, 0.03);
  467. }
  468. .gfm-render em {
  469. color: red;
  470. }
  471. .gfm-render del {
  472. color: #999;
  473. }
  474. .gfm-render pre {
  475. background: rgba(45, 141, 234, 0.1);
  476. padding: 5px;
  477. border-radius: 5px;
  478. word-break: break-all;
  479. word-wrap: break-word;
  480. }
  481. .gfm-render code {
  482. background: rgba(45, 141, 234, 0.1);
  483. /* display: inline-block; */
  484. padding: 0 5px;
  485. border-radius: 3px;
  486. }
  487. .gfm-render pre code {
  488. background: none;
  489. }
  490. .gfm-render hr {
  491. border: none;
  492. border-top: 1px solid #CCC;
  493. }
  494. .gfm-render .highlight {
  495. background: yellow;
  496. color: red;
  497. }
  498. .km-note {
  499. width: 300px;
  500. border-left: 1px solid #babfcd;
  501. padding: 5px 10px;
  502. background: white;
  503. position: absolute;
  504. top: 92px;
  505. right: 0;
  506. bottom: 0;
  507. left: auto;
  508. z-index: 3;
  509. }
  510. .km-note.panel {
  511. margin: 0;
  512. padding: 0;
  513. }
  514. .km-note.panel .panel-heading h3 {
  515. display: inline-block;
  516. }
  517. .km-note.panel .panel-heading .close-note-editor {
  518. width: 15px;
  519. height: 15px;
  520. display: inline-block;
  521. float: right;
  522. }
  523. .km-note.panel .panel-heading .close-note-editor:hover {
  524. cursor: pointer;
  525. }
  526. .km-note.panel .panel-body {
  527. padding: 0;
  528. }
  529. .km-note .CodeMirror {
  530. position: absolute;
  531. top: 41px;
  532. bottom: 0;
  533. height: auto;
  534. cursor: text;
  535. font-size: 14px;
  536. line-height: 1.3em;
  537. font-family: consolas;
  538. }
  539. .km-note-tips {
  540. color: #ccc;
  541. padding: 3px 8px;
  542. }
  543. #previewer-content {
  544. position: absolute;
  545. background: #FFD;
  546. padding: 5px 15px;
  547. border-radius: 5px;
  548. max-width: 400px;
  549. max-height: 200px;
  550. overflow: auto;
  551. z-index: 10;
  552. box-shadow: 0 0 15px rgba(0, 0, 0, 0.5);
  553. word-break: break-all;
  554. font-size: 12px;
  555. -webkit-user-select: text;
  556. color: #333;
  557. line-height: 1.8em;
  558. }
  559. #previewer-content blockquote,
  560. #previewer-content ul,
  561. #previewer-content table,
  562. #previewer-content p,
  563. #previewer-content pre,
  564. #previewer-content hr {
  565. margin: 1em 0;
  566. cursor: text;
  567. }
  568. #previewer-content blockquote:first-child:last-child,
  569. #previewer-content ul:first-child:last-child,
  570. #previewer-content table:first-child:last-child,
  571. #previewer-content p:first-child:last-child,
  572. #previewer-content pre:first-child:last-child,
  573. #previewer-content hr:first-child:last-child {
  574. margin: 0;
  575. }
  576. #previewer-content img {
  577. max-width: 100%;
  578. }
  579. #previewer-content a {
  580. color: blue;
  581. }
  582. #previewer-content a:hover {
  583. color: red;
  584. }
  585. #previewer-content blockquote {
  586. display: block;
  587. border-left: 4px solid #E4AD91;
  588. color: #da8e68;
  589. padding-left: 10px;
  590. font-style: italic;
  591. margin-left: 2em;
  592. }
  593. #previewer-content ul,
  594. #previewer-content ol {
  595. padding-left: 3em;
  596. }
  597. #previewer-content table {
  598. width: 100%;
  599. border-collapse: collapse;
  600. margin: 1em 0;
  601. }
  602. #previewer-content table th,
  603. #previewer-content table td {
  604. border: 1px solid #666;
  605. padding: 2px 4px;
  606. }
  607. #previewer-content table th {
  608. background: rgba(45, 141, 234, 0.2);
  609. }
  610. #previewer-content table tr:nth-child(even) td {
  611. background: rgba(45, 141, 234, 0.03);
  612. }
  613. #previewer-content em {
  614. color: red;
  615. }
  616. #previewer-content del {
  617. color: #999;
  618. }
  619. #previewer-content pre {
  620. background: rgba(45, 141, 234, 0.1);
  621. padding: 5px;
  622. border-radius: 5px;
  623. word-break: break-all;
  624. word-wrap: break-word;
  625. }
  626. #previewer-content code {
  627. background: rgba(45, 141, 234, 0.1);
  628. /* display: inline-block; */
  629. padding: 0 5px;
  630. border-radius: 3px;
  631. }
  632. #previewer-content pre code {
  633. background: none;
  634. }
  635. #previewer-content hr {
  636. border: none;
  637. border-top: 1px solid #CCC;
  638. }
  639. #previewer-content .highlight {
  640. background: yellow;
  641. color: red;
  642. }
  643. #previewer-content.ng-hide {
  644. display: block!important;
  645. left: -99999px !important;
  646. top: -99999px !important;
  647. }
  648. .panel-body {
  649. padding: 10px;
  650. }
  651. .tab-content .km-priority {
  652. vertical-align: middle;
  653. font-size: inherit;
  654. display: inline-block;
  655. width: 140px;
  656. margin: 5px;
  657. border-right: 1px dashed #eee;
  658. }
  659. .tab-content .km-priority .km-priority-item {
  660. margin: 0 1px;
  661. padding: 1px;
  662. }
  663. .tab-content .km-priority .km-priority-item .km-priority-icon {
  664. background: url(images/iconpriority.png) repeat-y;
  665. background-color: transparent;
  666. }
  667. .tab-content .km-priority .km-priority-item .km-priority-icon.priority-0 {
  668. background-position: 0 20px;
  669. }
  670. .tab-content .km-priority .km-priority-item .km-priority-icon.priority-1 {
  671. background-position: 0 0px;
  672. }
  673. .tab-content .km-priority .km-priority-item .km-priority-icon.priority-2 {
  674. background-position: 0 -20px;
  675. }
  676. .tab-content .km-priority .km-priority-item .km-priority-icon.priority-3 {
  677. background-position: 0 -40px;
  678. }
  679. .tab-content .km-priority .km-priority-item .km-priority-icon.priority-4 {
  680. background-position: 0 -60px;
  681. }
  682. .tab-content .km-priority .km-priority-item .km-priority-icon.priority-5 {
  683. background-position: 0 -80px;
  684. }
  685. .tab-content .km-priority .km-priority-item .km-priority-icon.priority-6 {
  686. background-position: 0 -100px;
  687. }
  688. .tab-content .km-priority .km-priority-item .km-priority-icon.priority-7 {
  689. background-position: 0 -120px;
  690. }
  691. .tab-content .km-priority .km-priority-item .km-priority-icon.priority-8 {
  692. background-position: 0 -140px;
  693. }
  694. .tab-content .km-priority .km-priority-item .km-priority-icon.priority-9 {
  695. background-position: 0 -160px;
  696. }
  697. .tab-content .km-progress {
  698. vertical-align: middle;
  699. font-size: inherit;
  700. display: inline-block;
  701. width: 140px;
  702. margin: 5px;
  703. border-right: 1px dashed #eee;
  704. }
  705. .tab-content .km-progress .km-progress-item {
  706. margin: 0 1px;
  707. padding: 1px;
  708. }
  709. .tab-content .km-progress .km-progress-item .km-progress-icon {
  710. background: url(images/iconprogress.png) repeat-y;
  711. background-color: transparent;
  712. }
  713. .tab-content .km-progress .km-progress-item .km-progress-icon.progress-0 {
  714. background-position: 0 20px;
  715. }
  716. .tab-content .km-progress .km-progress-item .km-progress-icon.progress-1 {
  717. background-position: 0 0px;
  718. }
  719. .tab-content .km-progress .km-progress-item .km-progress-icon.progress-2 {
  720. background-position: 0 -20px;
  721. }
  722. .tab-content .km-progress .km-progress-item .km-progress-icon.progress-3 {
  723. background-position: 0 -40px;
  724. }
  725. .tab-content .km-progress .km-progress-item .km-progress-icon.progress-4 {
  726. background-position: 0 -60px;
  727. }
  728. .tab-content .km-progress .km-progress-item .km-progress-icon.progress-5 {
  729. background-position: 0 -80px;
  730. }
  731. .tab-content .km-progress .km-progress-item .km-progress-icon.progress-6 {
  732. background-position: 0 -100px;
  733. }
  734. .tab-content .km-progress .km-progress-item .km-progress-icon.progress-7 {
  735. background-position: 0 -120px;
  736. }
  737. .tab-content .km-progress .km-progress-item .km-progress-icon.progress-8 {
  738. background-position: 0 -140px;
  739. }
  740. .tab-content .km-progress .km-progress-item .km-progress-icon.progress-9 {
  741. background-position: 0 -160px;
  742. }
  743. .resource-editor {
  744. vertical-align: middle;
  745. display: inline-block;
  746. margin: 5px;
  747. }
  748. .resource-editor .input-group,
  749. .resource-editor .km-resource {
  750. font-size: 12px;
  751. }
  752. .resource-editor .input-group {
  753. height: 20px;
  754. width: 168px;
  755. }
  756. .resource-editor .resource-dropdown {
  757. position: relative;
  758. width: 168px;
  759. border: 1px solid #ccc;
  760. margin-top: -1px;
  761. border-bottom-right-radius: 4px;
  762. border-bottom-left-radius: 4px;
  763. }
  764. .resource-editor .resource-dropdown .km-resource {
  765. position: absolute;
  766. width: 154px;
  767. margin-bottom: 3px;
  768. padding: 0;
  769. list-style-type: none;
  770. overflow: scroll;
  771. max-height: 500px;
  772. }
  773. .resource-editor .resource-dropdown .km-resource.open {
  774. z-index: 3;
  775. background-color: #fff;
  776. }
  777. .resource-editor .resource-dropdown .km-resource li {
  778. display: inline-block;
  779. padding: 1px 2px;
  780. border-radius: 4px;
  781. margin: 2px 3px;
  782. }
  783. .resource-editor .resource-dropdown .km-resource li[disabled] {
  784. opacity: 0.5;
  785. }
  786. .resource-editor .resource-dropdown .resource-caret {
  787. display: block;
  788. float: right;
  789. vertical-align: middle;
  790. width: 12px;
  791. height: 24px;
  792. padding: 8px 1px;
  793. }
  794. .resource-editor .resource-dropdown .resource-caret:hover {
  795. background-color: #eff3fa;
  796. }
  797. .resource-editor .resource-dropdown .resource-caret:active {
  798. background-color: #c4d0ee;
  799. }
  800. .resource-editor input.form-control,
  801. .resource-editor .btn {
  802. font-size: 12px;
  803. }
  804. .resource-editor input.form-control {
  805. padding: 2px 4px;
  806. height: 24px;
  807. border-bottom-left-radius: 0;
  808. }
  809. .resource-editor .input-group-btn {
  810. line-height: 24px;
  811. }
  812. .resource-editor .input-group-btn .btn {
  813. padding: 2px 4px;
  814. height: 24px;
  815. border-bottom-right-radius: 0;
  816. }
  817. .temp-panel {
  818. margin: 5px 5px 5px 10px;
  819. border-right: 1px dashed #eee;
  820. display: inline-block;
  821. vertical-align: middle;
  822. }
  823. .temp-list {
  824. min-width: 124px;
  825. }
  826. .temp-item-wrap {
  827. width: 50px;
  828. height: 40px;
  829. padding: 0 2px;
  830. margin: 5px;
  831. display: inline-block;
  832. }
  833. .temp-item {
  834. display: inline-block;
  835. width: 50px;
  836. height: 40px;
  837. background-image: url(images/template.png);
  838. background-repeat: no-repeat;
  839. }
  840. .temp-item.default {
  841. background-position: 0 0;
  842. }
  843. .temp-item.structure {
  844. background-position: -50px 0;
  845. }
  846. .temp-item.filetree {
  847. background-position: -100px 0;
  848. }
  849. .temp-item.right {
  850. background-position: -150px 0;
  851. }
  852. .temp-item.fish-bone {
  853. background-position: -200px 0;
  854. }
  855. .temp-item.tianpan {
  856. background-position: -250px 0;
  857. }
  858. .current-temp-item {
  859. width: 74px;
  860. padding: 0 0 0 5px;
  861. border: 1px solid #fff;
  862. }
  863. .current-temp-item:hover {
  864. background-color: #eff3fa;
  865. }
  866. .current-temp-item[disabled] {
  867. opacity: 0.5;
  868. }
  869. .current-temp-item .caret {
  870. margin-left: 5px;
  871. }
  872. .temp-item-selected {
  873. background-color: #87a9da;
  874. }
  875. .theme-panel {
  876. height: 42px;
  877. margin: 5px;
  878. padding: 0 5px 0 0;
  879. border-right: 1px dashed #eee;
  880. display: inline-block;
  881. vertical-align: middle;
  882. }
  883. .theme-list {
  884. min-width: 162px;
  885. }
  886. div a.theme-item {
  887. display: inline-block;
  888. width: 70px;
  889. height: 30px;
  890. text-align: center;
  891. line-height: 30px;
  892. padding: 0 5px;
  893. font-size: 12px;
  894. cursor: pointer;
  895. text-decoration: none;
  896. color: #000;
  897. }
  898. .theme-item-selected {
  899. width: 100px;
  900. padding: 6px 7px;
  901. border: 1px solid #fff;
  902. }
  903. .theme-item-selected:hover {
  904. background-color: #eff3fa;
  905. }
  906. .theme-item-selected .caret {
  907. margin-left: 5px;
  908. }
  909. .theme-item-selected[disabled] {
  910. opacity: 0.5;
  911. }
  912. .theme-item-wrap {
  913. display: inline-block;
  914. width: 80px;
  915. height: 40px;
  916. padding: 5px;
  917. }
  918. .theme-item-wrap:hover {
  919. background-color: #eff3fa;
  920. }
  921. .readjust-layout {
  922. display: inline-block;
  923. vertical-align: middle;
  924. padding: 0 10px 0 5px;
  925. border-right: 1px dashed #eee;
  926. }
  927. .btn-icon {
  928. width: 25px;
  929. height: 25px;
  930. margin-left: 12px;
  931. display: block;
  932. }
  933. .btn-label {
  934. font-size: 12px;
  935. }
  936. .btn-wrap {
  937. width: 50px;
  938. height: 42px;
  939. cursor: pointer;
  940. display: inline-block;
  941. text-decoration: none;
  942. }
  943. .btn-wrap[disabled] span {
  944. opacity: 0.5;
  945. }
  946. .btn-wrap[disabled] {
  947. cursor: default;
  948. }
  949. .btn-wrap[disabled]:hover {
  950. background-color: transparent;
  951. }
  952. .btn-wrap[disabled]:active {
  953. background-color: transparent;
  954. }
  955. .btn-wrap:link {
  956. text-decoration: none;
  957. }
  958. .btn-wrap:visited {
  959. text-decoration: none;
  960. }
  961. .btn-wrap:hover {
  962. background-color: #eff3fa;
  963. text-decoration: none;
  964. }
  965. .btn-wrap:active {
  966. background-color: #c4d0ee;
  967. }
  968. .reset-layout-icon {
  969. background: url(images/icons.png) no-repeat;
  970. background-position: 0 -150px;
  971. }
  972. .style-operator {
  973. display: inline-block;
  974. vertical-align: middle;
  975. padding: 0 5px;
  976. border-right: 1px dashed #eee;
  977. }
  978. .style-operator .clear-style {
  979. vertical-align: middle;
  980. }
  981. .clear-style-icon {
  982. background: url(images/icons.png) no-repeat;
  983. background-position: 0 -175px;
  984. }
  985. .s-btn-group-vertical {
  986. display: inline-block;
  987. vertical-align: middle;
  988. }
  989. .s-btn-icon {
  990. width: 20px;
  991. height: 20px;
  992. margin-right: 3px;
  993. display: inline-block;
  994. vertical-align: middle;
  995. }
  996. .s-btn-label {
  997. font-size: 12px;
  998. vertical-align: middle;
  999. display: inline-block;
  1000. }
  1001. .s-btn-wrap {
  1002. padding: 0 5px 0 3px;
  1003. display: inline-block;
  1004. text-decoration: none;
  1005. font-size: 0;
  1006. }
  1007. .s-btn-wrap[disabled] span {
  1008. opacity: 0.5;
  1009. }
  1010. .s-btn-wrap[disabled] {
  1011. cursor: default;
  1012. }
  1013. .s-btn-wrap[disabled]:hover {
  1014. background-color: transparent;
  1015. }
  1016. .s-btn-wrap[disabled]:active {
  1017. background-color: transparent;
  1018. }
  1019. .s-btn-wrap:hover {
  1020. background-color: #eff3fa;
  1021. text-decoration: none;
  1022. }
  1023. .s-btn-wrap:active {
  1024. background-color: #c4d0ee;
  1025. }
  1026. .copy-style-icon {
  1027. background: url(images/icons.png) no-repeat;
  1028. background-position: 0 -200px;
  1029. }
  1030. .paste-style-wrap {
  1031. display: block;
  1032. }
  1033. .paste-style-icon {
  1034. background: url(images/icons.png) no-repeat;
  1035. background-position: 0 -220px;
  1036. }
  1037. .font-operator {
  1038. width: 170px;
  1039. display: inline-block;
  1040. vertical-align: middle;
  1041. font-size: 12px;
  1042. padding: 0 5px;
  1043. }
  1044. .font-operator .font-size-list {
  1045. display: inline-block;
  1046. border: 1px solid #eee;
  1047. padding: 2px 4px;
  1048. }
  1049. .font-operator .font-family-list {
  1050. display: inline-block;
  1051. border: 1px solid #eee;
  1052. padding: 2px 4px;
  1053. }
  1054. .current-font-item a {
  1055. text-decoration: none;
  1056. display: inline-block;
  1057. }
  1058. .current-font-family {
  1059. width: 75px;
  1060. height: 18px;
  1061. overflow: hidden;
  1062. vertical-align: bottom;
  1063. }
  1064. .current-font-size {
  1065. width: 32px;
  1066. height: 18px;
  1067. overflow: hidden;
  1068. vertical-align: bottom;
  1069. }
  1070. .current-font-item[disabled] {
  1071. opacity: 0.5;
  1072. }
  1073. .font-item {
  1074. line-height: 1em;
  1075. text-align: left;
  1076. }
  1077. .font-item-selected {
  1078. background-color: #87a9da;
  1079. }
  1080. .font-bold,
  1081. .font-italics {
  1082. display: inline-block;
  1083. background: url(images/icons.png) no-repeat;
  1084. cursor: pointer;
  1085. margin: 0 3px;
  1086. }
  1087. .font-bold:hover,
  1088. .font-italics:hover {
  1089. background-color: #eff3fa;
  1090. }
  1091. .font-bold:active,
  1092. .font-italics:active {
  1093. background-color: #c4d0ee;
  1094. }
  1095. .font-bold[disabled],
  1096. .font-italics[disabled] {
  1097. opacity: 0.5;
  1098. }
  1099. .font-bold {
  1100. background-position: 0 -240px;
  1101. }
  1102. .font-italics {
  1103. background-position: 0 -260px;
  1104. }
  1105. .font-bold-selected,
  1106. .font-italics-selected {
  1107. background-color: #87a9da;
  1108. }
  1109. .font-color-wrap {
  1110. display: inline-block;
  1111. width: 30px;
  1112. height: 22px;
  1113. margin: 3px 3px 0 0;
  1114. border: 1px #efefef solid;
  1115. vertical-align: middle;
  1116. font-size: 0;
  1117. -webkit-user-select: none;
  1118. -moz-user-select: none;
  1119. -ms-user-select: none;
  1120. user-select: none;
  1121. }
  1122. .font-color-wrap[disabled] {
  1123. opacity: 0.5;
  1124. }
  1125. .font-color-wrap .quick-font-color {
  1126. display: inline-block;
  1127. width: 20px;
  1128. height: 16px;
  1129. font-size: 14px;
  1130. line-height: 16px;
  1131. vertical-align: top;
  1132. text-align: center;
  1133. cursor: default;
  1134. color: #000;
  1135. }
  1136. .font-color-wrap .quick-font-color:hover {
  1137. background-color: #eff3fa;
  1138. }
  1139. .font-color-wrap .quick-font-color:active {
  1140. background-color: #c4d0ee;
  1141. }
  1142. .font-color-wrap .quick-font-color[disabled] {
  1143. opacity: 0.5;
  1144. }
  1145. .font-color-wrap .font-color-preview {
  1146. display: inline-block;
  1147. width: 12px;
  1148. height: 2px;
  1149. margin: 0 4px 0;
  1150. background-color: #000;
  1151. }
  1152. .font-color-wrap .font-color-preview[disabled] {
  1153. opacity: 0.5;
  1154. }
  1155. .font-color {
  1156. display: inline-block;
  1157. width: 8px;
  1158. height: 16px;
  1159. }
  1160. .font-color:hover {
  1161. background-color: #eff3fa;
  1162. }
  1163. .font-color:active {
  1164. background-color: #c4d0ee;
  1165. }
  1166. .font-color[disabled] {
  1167. opacity: 0.5;
  1168. }
  1169. .font-color .caret {
  1170. margin-left: -2px;
  1171. margin-top: 7px;
  1172. }
  1173. .bg-color-wrap {
  1174. display: inline-block;
  1175. width: 30px;
  1176. height: 22px;
  1177. margin: 3px 3px 0 0;
  1178. border: 1px #efefef solid;
  1179. vertical-align: middle;
  1180. font-size: 0;
  1181. -webkit-user-select: none;
  1182. -moz-user-select: none;
  1183. -ms-user-select: none;
  1184. user-select: none;
  1185. }
  1186. .bg-color-wrap[disabled] {
  1187. opacity: 0.5;
  1188. }
  1189. .bg-color-wrap .quick-bg-color {
  1190. display: inline-block;
  1191. width: 20px;
  1192. height: 16px;
  1193. font-size: 14px;
  1194. line-height: 16px;
  1195. vertical-align: top;
  1196. text-align: center;
  1197. cursor: default;
  1198. color: #000;
  1199. background: url(images/icons.png) no-repeat center -1260px;
  1200. }
  1201. .bg-color-wrap .quick-bg-color:hover {
  1202. background-color: #eff3fa;
  1203. }
  1204. .bg-color-wrap .quick-bg-color:active {
  1205. background-color: #c4d0ee;
  1206. }
  1207. .bg-color-wrap .quick-bg-color[disabled] {
  1208. opacity: 0.5;
  1209. }
  1210. .bg-color-wrap .bg-color-preview {
  1211. display: inline-block;
  1212. width: 12px;
  1213. height: 2px;
  1214. margin: 0 4px 0;
  1215. background-color: #fff;
  1216. }
  1217. .bg-color-wrap .bg-color-preview[disabled] {
  1218. opacity: 0.5;
  1219. }
  1220. .bg-color {
  1221. display: inline-block;
  1222. width: 8px;
  1223. height: 16px;
  1224. }
  1225. .bg-color:hover {
  1226. background-color: #eff3fa;
  1227. }
  1228. .bg-color:active {
  1229. background-color: #c4d0ee;
  1230. }
  1231. .bg-color[disabled] {
  1232. opacity: 0.5;
  1233. }
  1234. .bg-color .caret {
  1235. margin-left: -2px;
  1236. margin-top: 7px;
  1237. }
  1238. .btn-group-vertical {
  1239. vertical-align: middle;
  1240. margin: 5px;
  1241. }
  1242. .btn-group-vertical .expand,
  1243. .btn-group-vertical .expand-caption {
  1244. width: 40px;
  1245. margin: 0;
  1246. padding: 0;
  1247. border: none!important;
  1248. border-radius: 0!important;
  1249. }
  1250. .btn-group-vertical .expand:hover,
  1251. .btn-group-vertical .expand-caption:hover {
  1252. background-color: #eff3fa;
  1253. }
  1254. .btn-group-vertical .expand:active,
  1255. .btn-group-vertical .expand-caption:active {
  1256. background-color: #c4d0ee;
  1257. }
  1258. .btn-group-vertical .expand.active,
  1259. .btn-group-vertical .expand-caption.active {
  1260. box-shadow: none;
  1261. background-color: #eff3fa;
  1262. }
  1263. .btn-group-vertical .expand {
  1264. height: 25px;
  1265. background: url(images/icons.png) no-repeat 0 -995px;
  1266. background-position-x: 50%;
  1267. }
  1268. .btn-group-vertical .expand-caption {
  1269. height: 20px;
  1270. }
  1271. .btn-group-vertical .expand-caption .caption {
  1272. font-size: 12px;
  1273. }
  1274. .btn-group-vertical {
  1275. vertical-align: middle;
  1276. margin: 5px;
  1277. }
  1278. .btn-group-vertical .select,
  1279. .btn-group-vertical .select-caption {
  1280. width: 40px;
  1281. margin: 0;
  1282. padding: 0;
  1283. border: none!important;
  1284. border-radius: 0!important;
  1285. }
  1286. .btn-group-vertical .select:hover,
  1287. .btn-group-vertical .select-caption:hover {
  1288. background-color: #eff3fa;
  1289. }
  1290. .btn-group-vertical .select:active,
  1291. .btn-group-vertical .select-caption:active {
  1292. background-color: #c4d0ee;
  1293. }
  1294. .btn-group-vertical .select.active,
  1295. .btn-group-vertical .select-caption.active {
  1296. box-shadow: none;
  1297. background-color: #eff3fa;
  1298. }
  1299. .btn-group-vertical .select {
  1300. height: 25px;
  1301. background: url(images/icons.png) no-repeat 7px -1175px;
  1302. }
  1303. .btn-group-vertical .select-caption {
  1304. height: 20px;
  1305. }
  1306. .btn-group-vertical .select-caption .caption {
  1307. font-size: 12px;
  1308. }
  1309. .btn-group-vertical {
  1310. vertical-align: middle;
  1311. margin: 5px;
  1312. }
  1313. .btn-group-vertical .search,
  1314. .btn-group-vertical .search-caption {
  1315. width: 40px;
  1316. margin: 0;
  1317. padding: 0;
  1318. border: none!important;
  1319. border-radius: 0!important;
  1320. }
  1321. .btn-group-vertical .search:hover,
  1322. .btn-group-vertical .search-caption:hover {
  1323. background-color: #eff3fa;
  1324. }
  1325. .btn-group-vertical .search:active,
  1326. .btn-group-vertical .search-caption:active {
  1327. background-color: #c4d0ee;
  1328. }
  1329. .btn-group-vertical .search.active,
  1330. .btn-group-vertical .search-caption.active {
  1331. box-shadow: none;
  1332. background-color: #eff3fa;
  1333. }
  1334. .btn-group-vertical .search {
  1335. height: 25px;
  1336. background: url(images/icons.png) no-repeat 0 -345px;
  1337. background-position-x: 50%;
  1338. }
  1339. .btn-group-vertical .search-caption {
  1340. height: 20px;
  1341. }
  1342. .btn-group-vertical .search-caption .caption {
  1343. font-size: 12px;
  1344. }
  1345. .search-box {
  1346. float: right;
  1347. background-color: #fff;
  1348. border: 1px solid #dbdbdb;
  1349. position: relative;
  1350. top: 0;
  1351. z-index: 3;
  1352. width: 360px;
  1353. height: 40px;
  1354. padding: 3px 6px;
  1355. opacity: 1;
  1356. }
  1357. .search-box .search-input-wrap,
  1358. .search-box .prev-and-next-btn {
  1359. float: left;
  1360. }
  1361. .search-box .close-search {
  1362. float: right;
  1363. height: 16px;
  1364. width: 16px;
  1365. padding: 1px;
  1366. border-radius: 100%;
  1367. margin-top: 6px;
  1368. margin-right: 10px;
  1369. }
  1370. .search-box .close-search .glyphicon {
  1371. top: -1px;
  1372. }
  1373. .search-box .close-search:hover {
  1374. background-color: #efefef;
  1375. }
  1376. .search-box .close-search:active {
  1377. background-color: #999;
  1378. }
  1379. .search-box .search-input-wrap {
  1380. width: 240px;
  1381. }
  1382. .search-box .prev-and-next-btn {
  1383. margin-left: 5px;
  1384. }
  1385. .search-box .prev-and-next-btn .btn:focus {
  1386. outline: none;
  1387. }
  1388. .search-box .search-addon {
  1389. background-color: #fff;
  1390. }
  1391. .tool-group {
  1392. padding: 0;
  1393. }
  1394. .tool-group[disabled] {
  1395. opacity: 0.5;
  1396. }
  1397. .tool-group .tool-group-item {
  1398. display: inline-block;
  1399. border-radius: 4px;
  1400. }
  1401. .tool-group .tool-group-item .tool-group-icon {
  1402. width: 20px;
  1403. height: 20px;
  1404. padding: 2px;
  1405. margin: 1px;
  1406. }
  1407. .tool-group .tool-group-item:hover {
  1408. background-color: #eff3fa;
  1409. }
  1410. .tool-group .tool-group-item:active {
  1411. background-color: #c4d0ee;
  1412. }
  1413. .tool-group .tool-group-item.active {
  1414. background-color: #c4d0ee;
  1415. }
  1416. .nav-bar {
  1417. position: absolute;
  1418. width: 35px;
  1419. height: 240px;
  1420. padding: 5px 0;
  1421. left: 10px;
  1422. bottom: 10px;
  1423. background: #fc8383;
  1424. color: #fff;
  1425. border-radius: 4px;
  1426. z-index: 10;
  1427. box-shadow: 3px 3px 10px rgba(0, 0, 0, 0.2);
  1428. transition: -webkit-transform 0.7s 0.1s ease;
  1429. transition: transform .7s 0.1s ease;
  1430. }
  1431. .nav-bar .nav-btn {
  1432. width: 35px;
  1433. height: 24px;
  1434. line-height: 24px;
  1435. text-align: center;
  1436. }
  1437. .nav-bar .nav-btn .icon {
  1438. background: url(images/icons.png);
  1439. width: 20px;
  1440. height: 20px;
  1441. margin: 2px auto;
  1442. display: block;
  1443. }
  1444. .nav-bar .nav-btn.active {
  1445. background-color: #5A6378;
  1446. }
  1447. .nav-bar .zoom-in .icon {
  1448. background-position: 0 -730px;
  1449. }
  1450. .nav-bar .zoom-out .icon {
  1451. background-position: 0 -750px;
  1452. }
  1453. .nav-bar .hand .icon {
  1454. background-position: 0 -770px;
  1455. width: 25px;
  1456. height: 25px;
  1457. margin: 0 auto;
  1458. }
  1459. .nav-bar .camera .icon {
  1460. background-position: 0 -870px;
  1461. width: 25px;
  1462. height: 25px;
  1463. margin: 0 auto;
  1464. }
  1465. .nav-bar .nav-trigger .icon {
  1466. background-position: 0 -845px;
  1467. width: 25px;
  1468. height: 25px;
  1469. margin: 0 auto;
  1470. }
  1471. .nav-bar .zoom-pan {
  1472. width: 2px;
  1473. height: 70px;
  1474. box-shadow: 0 1px #E50000;
  1475. position: relative;
  1476. background: white;
  1477. margin: 3px auto;
  1478. overflow: visible;
  1479. }
  1480. .nav-bar .zoom-pan .origin {
  1481. position: absolute;
  1482. width: 20px;
  1483. height: 8px;
  1484. left: -9px;
  1485. margin-top: -4px;
  1486. background: transparent;
  1487. }
  1488. .nav-bar .zoom-pan .origin:after {
  1489. content: ' ';
  1490. display: block;
  1491. width: 6px;
  1492. height: 2px;
  1493. background: white;
  1494. left: 7px;
  1495. top: 3px;
  1496. position: absolute;
  1497. }
  1498. .nav-bar .zoom-pan .indicator {
  1499. position: absolute;
  1500. width: 8px;
  1501. height: 8px;
  1502. left: -3px;
  1503. background: white;
  1504. border-radius: 100%;
  1505. margin-top: -4px;
  1506. }
  1507. .nav-previewer {
  1508. background: #fff;
  1509. width: 140px;
  1510. height: 120px;
  1511. position: absolute;
  1512. left: 45px;
  1513. bottom: 30px;
  1514. box-shadow: 0 0 8px rgba(0, 0, 0, 0.2);
  1515. border-radius: 0 2px 2px 0;
  1516. padding: 1px;
  1517. z-index: 9;
  1518. cursor: crosshair;
  1519. transition: -webkit-transform 0.7s 0.1s ease;
  1520. transition: transform .7s 0.1s ease;
  1521. }
  1522. .nav-previewer.grab {
  1523. cursor: move;
  1524. cursor: -webkit-grabbing;
  1525. cursor: -moz-grabbing;
  1526. cursor: grabbing;
  1527. }
  1528. /*# sourceMappingURL=kityminder.editor.css.map */