learnpath.css 14 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616
  1. #learning_path_breadcrumb_zone .breadcrumb{
  2. background-color: #FFF;
  3. color: #6B1D82;
  4. border-bottom: 1px solid #84bd00;
  5. padding: 10px 15px;
  6. }
  7. #learning_path_breadcrumb_zone .breadcrumb a{
  8. color: #6B1D82;
  9. }
  10. #learning_path_breadcrumb_zone .breadcrumb a:hover{
  11. color: #162A83
  12. }
  13. .lp-view-zone-container .scorm-header{
  14. background-color: #84bd00;
  15. border: none !important;
  16. border-radius: 0 !important;
  17. }
  18. .icon-toolbar .fa{
  19. background-color: #162A83;
  20. }
  21. #scorm-info hr{
  22. background-color: #84bd00;
  23. }
  24. #scorm-info .title{
  25. color: #162A83;
  26. margin: 10px 0 20px 0;
  27. font-size: 16px;
  28. }
  29. .scorm_item_level_1{
  30. padding: 0 2.5em 0 1.5em;
  31. }
  32. .scorm_item_level_0{
  33. padding: 0 2.5em 0 0;
  34. }
  35. .scorm_item_level_2{
  36. padding: 0 2.5em 0 3em;
  37. }
  38. .expand .fa{
  39. background-color: #96BD0D;
  40. }
  41. .icon-toolbar .fa:hover{
  42. background-color: #96BD0D;
  43. color: #FFF;
  44. }
  45. .progress-bar-warning{
  46. background-color: #96BD0D;
  47. }
  48. .scorm_item_normal.scorm_highlight a{
  49. color: #96BD0D !important;
  50. }
  51. .scorm_item_section{
  52. color: #162A83;
  53. padding-top: 10px;
  54. padding-bottom: 10px;
  55. padding-left: 5px;
  56. padding-right: 5px;
  57. display: block;
  58. width: 100%;
  59. font-size: 14px;
  60. font-weight: bold;
  61. background: #E1E1E1;
  62. }
  63. .lp-view-include-breadcrumb {
  64. background-color: #ffffff;
  65. }
  66. .title-learnpath{
  67. padding-left: 0px;
  68. padding-top: 10px;
  69. }
  70. #learning_path_right_zone .tab-pane iframe {
  71. padding-left: 0px;
  72. margin-top: 20px;
  73. }
  74. .title-learnpath h4,
  75. .title-learnpath .h5 {
  76. color: #162a83;
  77. font-weight: bold;
  78. }
  79. div.text {
  80. margin-left : 6;
  81. margin-right : 6;
  82. margin-top : 5;
  83. margin-bottom : 5;
  84. text-align : justify;
  85. }
  86. span.messagesmall {
  87. font-style : italic;
  88. color : Red;
  89. }
  90. /* newscorm/learnpath */
  91. div.lp_actions {
  92. background:#F8F8F8;
  93. border-bottom:1px solid #999999;
  94. padding:3px;
  95. }
  96. div.lp_actions img {
  97. margin-right:5px;
  98. }
  99. div.lp_small_form {
  100. background:#F8F8F8;
  101. border:1px solid #999999;
  102. padding:10px;
  103. }
  104. div.lp_small_form input {
  105. font-size:10px;
  106. }
  107. div.lp_manipulate {
  108. background:#F8F8F8;
  109. border-bottom:1px dotted #999999;
  110. margin-bottom:0px;
  111. padding:3px 0 3px 10px;
  112. }
  113. div.lp_manipulate a {
  114. padding-right:10px;
  115. }
  116. div.lp_message {
  117. background:#FEC880;
  118. border:1px solid #E28C15;
  119. font-size:12px;
  120. padding:10px;
  121. }
  122. div.lp_resource_header {
  123. cursor: pointer;
  124. background:#F0F0F0;
  125. border:1px solid #999999;
  126. font-weight:bold;
  127. padding:10px;
  128. width:350px;
  129. }
  130. div.lp_resource_header_end {
  131. background:#F0F0F0;
  132. border:1px solid #999999;
  133. font-weight:bold;
  134. padding:10px;
  135. width:350px;
  136. }
  137. div.lp_resource_elements {
  138. background:#FAFAFA;
  139. border:1px solid #999999;
  140. border-bottom:0;
  141. display:none;
  142. padding:5px 10px;
  143. width:350px;
  144. }
  145. div.lp_resource_elements_end {
  146. background:#FAFAFA;
  147. border:1px solid #999999;
  148. border-top: 0px;
  149. display:none;
  150. padding:5px 10px;
  151. width:350px;
  152. }
  153. div.lp_resource_elements div {
  154. padding:3px;
  155. }
  156. div.lp_tree {
  157. height:100%;
  158. padding:3px 10px 3px 0;
  159. overflow-x : auto;
  160. overflow-y : auto;
  161. width:190px;
  162. }
  163. hr {
  164. background:#999999;
  165. border:0;
  166. color:#999999;
  167. height:1px;
  168. margin:10px auto;
  169. width:75%;
  170. }
  171. option.bottom {
  172. border-top:1px solid #999999;
  173. margin-top:2px;
  174. padding-top:2px;
  175. }
  176. option.top {
  177. border-bottom:1px solid #999999;
  178. margin-bottom:2px;
  179. padding-bottom:2px;
  180. }
  181. p.lp_action {
  182. margin:5px 0;
  183. }
  184. p.lp_text {
  185. margin-top:0px;
  186. }
  187. p.lp_title {
  188. font-weight:bold;
  189. margin-top:5px;
  190. padding-left:7px;
  191. }
  192. table.lp_build {
  193. font-size:12px;
  194. height:400px;
  195. width:100%;
  196. }
  197. table.lp_build td {
  198. vertical-align:top;
  199. }
  200. table.lp_build td.tree {
  201. /* border-right:1px solid #999999;*/
  202. padding-right: 5px;
  203. width:205px;
  204. }
  205. table.lp_build td.workspace {
  206. padding: 0px;
  207. padding-left:5px;
  208. width:auto;
  209. }
  210. table.lp_form {
  211. font-size:12px;
  212. margin:0 10px;
  213. width:auto;
  214. }
  215. table.lp_form td {
  216. height:25px;
  217. padding:5px;
  218. vertical-align:top;
  219. width:auto;
  220. }
  221. table.lp_form td.label {
  222. padding-top:7px;
  223. text-align:right;
  224. }
  225. table.lp_form td.radio {
  226. width:300px;
  227. }
  228. table.lp_form td.exercise {
  229. width:50px;
  230. }
  231. table.lp_form th {
  232. background:#F8F8F8;
  233. border-bottom:1px solid #999999;
  234. border-top:1px solid #999999;
  235. }
  236. table.lp_overview th.exercise {
  237. width:50px;
  238. }
  239. table.lp_form td.radio input, table.lp_form td.exercise input {
  240. width:auto;
  241. }
  242. table.lp_form .small_form {
  243. background:#FFFFFF;
  244. }
  245. table.lp_form select {
  246. /* padding:0;*/
  247. }
  248. table.lp_form input.button {
  249. width:75px;
  250. }
  251. table.lp_overview {
  252. font-size:12px;
  253. width:100%;
  254. }
  255. table.lp_overview td {
  256. border-bottom:1px solid #999999;
  257. border-top:1px solid #999999;
  258. height:20px;
  259. padding:3px;
  260. vertical-align:middle;
  261. width:auto;
  262. }
  263. table.lp_overview td.title {
  264. width:200px;
  265. }
  266. table.lp_overview td.actions {
  267. text-align:center;
  268. width:100px;
  269. }
  270. table.lp_overview td.move {
  271. text-align:center;
  272. width:50px;
  273. }
  274. table.lp_overview th {
  275. background:#FFFFFF;
  276. padding-left:3px;
  277. text-align:center;
  278. }
  279. table.lp_overview tr {
  280. background:#F8F8F8;
  281. }
  282. table.lp_overview tr:hover {
  283. background:#E5EDF9;
  284. }
  285. table.lp_overview img {
  286. margin-left:3px;
  287. }
  288. #learning_path_toc{
  289. padding: 0;
  290. border:none;
  291. border-radius: 0;
  292. }
  293. #scorm-panel .panel.panel-default{
  294. border: none;
  295. }
  296. .section-list{
  297. border-bottom: none;
  298. }
  299. .scorm_item_normal {
  300. line-height: 18px;
  301. border-bottom: 1px solid #DDD;
  302. padding: 10px 5px;
  303. background-color: #F5F5F5;
  304. }
  305. .scorm_item_normal a.items-list{
  306. line-height: 18px;
  307. }
  308. .scorm_item_section .section {
  309. background: url(images/folder-item-closed.png) no-repeat 5px center;
  310. }
  311. .scorm_item_section.scorm_completed {
  312. color: #162A83;
  313. }
  314. .scorm_item_section.scorm_completed .section {
  315. background: url(images/folder-item-open.png) no-repeat 5px center;
  316. padding-right: 1.5em;
  317. }
  318. .scorm_completed .item {
  319. background: url(images/completed.png) no-repeat 0 center;
  320. }
  321. .scorm_highlight.scorm_completed .item {
  322. background: url(images/completed-active.png) no-repeat 0 center !important;
  323. }
  324. .scorm_not_attempted .item {
  325. background: url(images/not-completed.png) no-repeat 0 center;
  326. }
  327. .scorm_highlight .item {
  328. background: url(images/not-completed-active.png) no-repeat 0 center !important;
  329. color: #009AB8;
  330. }
  331. .scorm_item_normal.scorm_highlight{
  332. background-color: #772583;
  333. }
  334. .scorm_item_normal.scorm_highlight a{
  335. color: #FFFFFF !important;
  336. }
  337. .level_0{
  338. margin: 0;
  339. padding-left: 25px;
  340. }
  341. .level_1 {
  342. margin: 0 0.5em 0 20px;
  343. padding-left: 25px;
  344. }
  345. .level_2 {
  346. margin: 0 0.5em 0 40px;
  347. padding-left: 25px;
  348. }
  349. .level_3 {
  350. margin: 0 0.5em 0 60px;
  351. padding-left: 25px;
  352. }
  353. .level_4 {
  354. margin: 0 0.5em 0 70px;
  355. padding-left: 25px;
  356. }
  357. .level_5 {
  358. margin: 0 0.5em 0 90px;
  359. padding-left: 25px;
  360. }
  361. #scorm-panel .panel-default .panel-heading{
  362. padding: 0;
  363. line-height: 16px;
  364. }
  365. #scorm-panel .panel-default .panel-heading a{
  366. color: #162A83;
  367. padding-top: 20px;
  368. padding-bottom: 20px;
  369. padding-left: 30px;
  370. padding-right: 15px;
  371. display: block;
  372. width: 100%;
  373. font-size: 14px;
  374. font-weight: bold;
  375. background: url(images/arrow-right.png) no-repeat #E1E1E1 5px center;
  376. }
  377. #scorm-panel .panel-default .panel-heading.on a{
  378. background: url(images/arrow-down.png) no-repeat #E1E1E1 5px center;
  379. }
  380. .section-list li{
  381. background-color: #E1E1E1;
  382. padding: 10px 10px 10px 50px;
  383. border-bottom: 1px solid #162A83;
  384. font-size: 12px;
  385. }
  386. .section-list li.final{
  387. border-bottom: 1px solid #E1E1E1;
  388. }
  389. .section-list li{
  390. line-height: 14px;
  391. }
  392. .section-list li.scorm_item_normal.scorm_highlight{
  393. background: url(images/not-completed-active.png) no-repeat #772583 28px center;
  394. }
  395. .section-list li.scorm_completed.scorm_item_normal{
  396. background: url(images/completed.png) no-repeat #ECF0F1 28px center;
  397. }
  398. .section-list li.scorm_completed.scorm_item_normal.scorm_highlight{
  399. background: url(images/completed-active.png) no-repeat #772583 28px center;
  400. }
  401. .section-list li.scorm_not_attempted.scorm_item_normal{
  402. background: url(images/not-completed.png) no-repeat #ECF0F1 28px center;
  403. }
  404. .section-list li.scorm_item_normal.scorm_highlight.scorm_not_attempted{
  405. background: url(images/not-completed-active.png) no-repeat #772583 28px center;
  406. }
  407. .section-list li.scorm_item_normal{
  408. color: #162A83;
  409. }
  410. .section-list .sub-item{
  411. padding-right: 30px;
  412. }
  413. .scorm_type_document .items-list{
  414. display: block;
  415. background: url('images/document.png') no-repeat right center;
  416. padding-bottom: 5px;
  417. padding-top: 5px;
  418. padding-right: 25px;
  419. }
  420. .scorm_highlight .scorm_type_document .items-list{
  421. display: block;
  422. background: url('images/document-active.png') no-repeat right center;
  423. padding-bottom: 5px;
  424. padding-top: 5px;
  425. padding-right: 25px;
  426. }
  427. .scorm_type_quiz .items-list{
  428. display: block;
  429. background: url('images/pencil.png') no-repeat right center;
  430. padding-bottom: 5px;
  431. padding-top: 5px;
  432. padding-right: 25px;
  433. }
  434. .scorm_highlight .scorm_type_quiz .items-list{
  435. display: block;
  436. background: url('images/pencil-active.png') no-repeat right center;
  437. padding-bottom: 5px;
  438. padding-top: 5px;
  439. padding-right: 25px;
  440. }
  441. .section-list .sub-item.type-document{
  442. background: url(images/document.png) no-repeat center right;
  443. padding-top: 5px;
  444. padding-bottom: 5px;
  445. }
  446. .section-list .sub-item.type-quiz{
  447. background: url(images/pencil.png) no-repeat center right;
  448. padding-top: 5px;
  449. padding-bottom: 5px;
  450. }
  451. .section-list .scorm_highlight .sub-item.type-document{
  452. background: url(images/document-active.png) no-repeat center right;
  453. }
  454. .section-list .scorm_highlight .sub-item.type-quiz{
  455. background: url(images/pencil-active.png) no-repeat center right;
  456. }
  457. #scorm-panel .panel-parent .panel-default .panel-heading a{
  458. padding-left: 55px;
  459. background: url(images/arrow-right.png) no-repeat #E1E1E1 31px center;
  460. font-size: 12px;
  461. }
  462. #scorm-panel .panel-parent .panel-default .panel-heading.on a{
  463. background: url(images/arrow-down.png) no-repeat #E1E1E1 31px center;
  464. }
  465. #scorm-panel .panel-parent .section-list li{
  466. padding: 10px 10px 10px 75px;
  467. }
  468. #scorm-panel .panel-parent .section-list li.scorm_completed.scorm_item_normal{
  469. background: url(images/completed.png) no-repeat #ECF0F1 50px center;
  470. }
  471. #scorm-panel .panel-parent .section-list li.scorm_not_attempted.scorm_item_normal{
  472. background: url(images/not-completed.png) no-repeat #ECF0F1 50px center;
  473. }
  474. #scorm-panel .panel-parent .section-list li.scorm_completed.scorm_item_normal.scorm_highlight,
  475. #scorm-panel .panel-parent .section-list li.scorm_not_attempted.scorm_item_normal.scorm_highlight
  476. {
  477. background: url(images/completed-active.png) no-repeat #772583 50px center;
  478. }
  479. #scorm-panel .panel-parent{
  480. margin-bottom: -1px;
  481. }
  482. /* nuevo css */
  483. .container-fluid {
  484. padding-left: 0px;
  485. }
  486. #learning_path_right_zone .lp-view-tabs .tab-content {
  487. bottom: 5px;
  488. left: 0px;
  489. position: absolute;
  490. right: 5px;
  491. top: 84px;
  492. }
  493. #learning_path_toc .panel-collapse .list{
  494. padding: 0;
  495. margin: 0;
  496. list-style: none;
  497. }
  498. #learning_path_toc .panel-default{
  499. background-color:#f5f5f5;
  500. margin-top: 0;
  501. border-radius: 0;
  502. }
  503. .scorm-title{
  504. display: none;
  505. }
  506. #learning_path_toc .higher{
  507. border-bottom: 1px solid #84bd00;
  508. }
  509. #learning_path_toc .panel-heading h4{
  510. font-weight: bold;
  511. }
  512. #learning_path_toc .panel-heading{
  513. background: url('images/arrow-right.png') no-repeat 10px center #e1e1e1;
  514. padding-left: 30px;
  515. }
  516. #learning_path_toc .panel-parent .panel-heading{
  517. background: url('images/arrow-right.png') no-repeat 20px center #e1e1e1;
  518. padding-left: 40px;
  519. }
  520. #learning_path_toc .panel-heading.active{
  521. background: url('images/arrow-down.png') no-repeat 10px center #e1e1e1;
  522. padding-left: 30px;
  523. }
  524. #learning_path_toc .panel-parent .panel-heading.active{
  525. background: url('images/arrow-down.png') no-repeat 20px center #e1e1e1;
  526. padding-left: 40px;
  527. }
  528. .scorm-collapse .panel-collapse .list li{
  529. padding-left: 20px;
  530. }
  531. .scorm_item_normal .sub-item a:last-child{
  532. display: inline-block;
  533. width: 100%;
  534. padding-right: 20px;
  535. }
  536. .scorm_item_normal.scorm_highlight .sub-item.item-quiz a{
  537. background: url("images/pencil-active.png") no-repeat right center;
  538. }
  539. .scorm_item_normal .sub-item.item-quiz a{
  540. background: url("images/pencil.png") no-repeat right center;
  541. }
  542. .scorm_item_normal.scorm_highlight .sub-item.item-document a{
  543. background: url("images/document-active.png") no-repeat right center;
  544. }
  545. .scorm_item_normal .sub-item.item-document a{
  546. background: url("images/document.png") no-repeat right center;
  547. }
  548. .scorm_item_normal .sub-item{
  549. font-size: 12px;
  550. }
  551. .scorm_item_normal.scorm_not_attempted .sub-item{
  552. background: url("images/not-completed.png") no-repeat;
  553. padding-left: 25px;
  554. }
  555. .panel-parent .scorm_item_normal.scorm_not_attempted .sub-item{
  556. background: url("images/not-completed.png") no-repeat 20px 0;
  557. padding-left: 45px;
  558. }
  559. .scorm_item_normal.scorm_highlight .sub-item{
  560. background: url("images/not-completed-active.png") no-repeat;
  561. padding-left: 25px;
  562. }
  563. .panel-parent .scorm_item_normal.scorm_highlight .sub-item{
  564. background: url("images/not-completed-active.png") no-repeat 20px 0;
  565. padding-left: 45px;
  566. }
  567. .scorm_item_normal.scorm_completed .sub-item {
  568. background: url("images/completed.png") no-repeat;
  569. padding-left: 25px;
  570. }
  571. .panel-parent .scorm_item_normal.scorm_completed .sub-item {
  572. background: url("images/completed.png") no-repeat 20px 0;
  573. padding-left: 45px;
  574. }
  575. .scorm_item_normal.scorm_highlight.scorm_completed .sub-item {
  576. background: url("images/completed-active.png") no-repeat;
  577. padding-left: 25px;
  578. }
  579. .panel-parent .scorm_item_normal.scorm_highlight.scorm_completed .sub-item {
  580. background: url("images/completed-active.png") no-repeat 20px 0;
  581. padding-left: 45px;
  582. }
  583. .attempts .attempts-status{
  584. display: inline-block;
  585. margin: 0;
  586. padding: 10px 0;
  587. list-style: none;
  588. color: #162A83;
  589. }
  590. .attempts .details{
  591. color: #162A83;
  592. font-size: 11px;
  593. }
  594. .attempts .attempts-status li{
  595. display: inline-block;
  596. }
  597. .mejs__container{
  598. background: transparent;
  599. }
  600. /* Small devices (tablets, 768px and up) */
  601. @media (min-width: 768px) {
  602. #learning_path_right_zone .lp-view-tabs .tab-content {
  603. bottom: 10px;
  604. right: 10px;
  605. top: 100px;
  606. }
  607. #learning_path_main.lp-view-include-breadcrumb #learning_path_right_zone {
  608. top: 0;
  609. height: 97%;
  610. }
  611. }