ivprog-visual-1.0.css 22 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681682683684685686687688689690691692693694695696697698699700701702703704705706707708709710711712713714715716717718719720721722723724725726727728729730731732733734735736737738739740741742743744745746747748749750751752753754755756757758759760761762763764765766767768769770771772773774775776777778779780781782783784785786787788789790791792793794795796797798799800801802803804805806807808809810811812813814815816817818819820821822823824825826827828829830831832833834835836837838839840841842843844845846847848849850851852853854855856857858859860861862863864865866867868869870871872873874875876877878879880881882883884885886887888889890891892893894895896897898899900901902903904905906907908909910911912913914915916917918919920921922923924925926927928929930931932933934935936937938939940941942943944945946947948949950951952953954955956957958959960961962963964965966967968969970971972973974975976977978979980981982983984985986987988989990991992993994995996997998999100010011002100310041005100610071008100910101011101210131014101510161017101810191020102110221023102410251026102710281029103010311032103310341035103610371038103910401041104210431044104510461047104810491050105110521053105410551056105710581059106010611062106310641065106610671068106910701071107210731074107510761077107810791080108110821083108410851086108710881089109010911092109310941095109610971098109911001101110211031104110511061107110811091110111111121113111411151116111711181119112011211122112311241125112611271128112911301131113211331134113511361137113811391140114111421143114411451146114711481149115011511152115311541155115611571158115911601161116211631164
  1. html {
  2. height: 100%;
  3. }
  4. body {
  5. height: 100%;
  6. }
  7. .ui.raised.container.segment.div_to_body {
  8. height: 92%;
  9. padding: 10px;
  10. padding-left: 6px;
  11. padding-right: 6px;
  12. background-color: #1279c6;
  13. }
  14. .ivprog_visual_panel {
  15. height: 96%;
  16. overflow: auto;
  17. overflow-x: auto;
  18. }
  19. .ivprog_textual_panel {
  20. height: 95%;
  21. overflow: auto;
  22. overflow-x: auto;
  23. }
  24. .ivprog_textual_code {
  25. width: 100%;
  26. min-height: 500px;
  27. resize: none;
  28. background-color: white;
  29. }
  30. .main_title h2 {
  31. margin: 0;
  32. color: white;
  33. }
  34. .main_title span {
  35. font-size: 80%;
  36. font-style: italic;
  37. }
  38. .ivprog_format_info {
  39. cursor: pointer;
  40. margin-left: 10px;
  41. }
  42. .ivprog_visual_panel {
  43. border: 2px solid #A0A0A0;
  44. background-color: red;
  45. }
  46. .ui.container.main_title {
  47. float: left;
  48. width: 200px;
  49. }
  50. .ui.container.content_margin {
  51. margin-top: 10px;
  52. }
  53. .content_margin .content_sub_margin {
  54. display: inline;
  55. margin-left: 34%;
  56. margin-top: 50px;
  57. }
  58. .ui.icon.menu.center.aligned.container {
  59. width: 438px;
  60. margin-top: -10px;
  61. }
  62. .ghost {
  63. opacity: .5;
  64. background: #C8EBFB;
  65. }
  66. /* editor visual: **/
  67. .function_signature_div,
  68. .function_close_div {
  69. font-weight: bold;
  70. color: black;
  71. }
  72. .ui.selection.data_types_dropdown.visible.dropdown>.text:not(.default),
  73. .ui.selection.parameter_data_types_dropdown.visible.dropdown>.text:not(.default) {
  74. font-weight: bold;
  75. }
  76. .ui.selection.data_types_dropdown.dropdown,
  77. .ui.selection.parameter_data_types_dropdown.dropdown {
  78. padding-bottom: 0;
  79. }
  80. .ui.fluid.dropdown.data_types_dropdown {
  81. display: inline;
  82. width: 150px;
  83. border: none;
  84. background: none;
  85. }
  86. .ui.fluid.dropdown.parameter_data_types_dropdown {
  87. display: inline;
  88. border: none;
  89. background: none;
  90. }
  91. .ui.fluid.dropdown.data_types_dropdown.selection .dropdown.icon,
  92. .ui.fluid.dropdown.parameter_data_types_dropdown.selection .dropdown.icon {
  93. font-size: 1em;
  94. }
  95. .function_close_div {
  96. margin-left: 20px;
  97. }
  98. .command_div {
  99. margin-left: 16px;
  100. }
  101. .function_draggable_div {
  102. width: 16px;
  103. float: left;
  104. }
  105. .function_draggable_div img {
  106. margin-bottom: -4px;
  107. margin-left: -2px;
  108. }
  109. .input_name_function{
  110. min-width: 50px;
  111. }
  112. .text_attr_receives {
  113. margin-left: 20px;
  114. margin-right: 20px;
  115. }
  116. .menu_operations {
  117. margin-left: 10px;
  118. margin-right: 10px;
  119. }
  120. .case_div {
  121. border: 1px solid gray;
  122. margin-left: 30px;
  123. padding-left: 5px;
  124. margin-top: 5px;
  125. }
  126. .function_name_div, .function_return_div, .function_name_parameter, .created_div_valor_var, .function_return, .var_value_menu_div, .variable_rendered, .variable_rendered div, .var_attributed,
  127. .expression_operand_1, .expression_operand_2, .operator, .div_comment_text, .value_rendered, .parameters_function_called, .parameters_function_called div, .expression_elements,
  128. .expression_element, .var_rendered, .menu_add_item, .component_element, .component_element, .conditional_expression, .variable_attribution, .attribution_expression, .var_value_expression,
  129. .incrementation_field, .incrementation_variable, .first_operand, .operator, .second_operand, .variable_to_switch, .variable_case, .button_remove_case, .editing_name_var, .parameter_div_edit,
  130. .all_elements_write, .container_var_element_control, .inline_add_command, .restart_expression, .div_parent_handler, .div_drag_writer, .single_element_expression, .ghost_parenthesis, .pass_button {
  131. display: inline;
  132. }
  133. .conditional_comands_block {
  134. min-height: 10px;
  135. }
  136. .div_comment_text {
  137. min-width: 100px;
  138. font-style: italic;
  139. }
  140. .enable_edit_name_function, .add_parameter, .remove_parameter, .add_parameter_button, .remove_variable {
  141. cursor: pointer;
  142. }
  143. [contenteditable="true"]:active,
  144. [contenteditable="true"]:focus,
  145. [contenteditable="true"]:hover {
  146. border: 1px dashed #000;
  147. background: white;
  148. }
  149. .ui.segment.ivprog_visual_panel {
  150. padding: 3px;
  151. margin-top: -5px;
  152. background: white;
  153. }
  154. .ui.segment.function_div {
  155. padding: 5px;
  156. margin: 0;
  157. margin-bottom: 5px;
  158. background-color: #bddbff;
  159. }
  160. .ui.button.add_function_button,
  161. .ui.button.add_variable_button,
  162. .ui.button.add_command_button {
  163. padding: 8px;
  164. margin: 0;
  165. }
  166. .glyphicon-move {
  167. cursor: move;
  168. cursor: -webkit-grabbing;
  169. }
  170. .glyphicon.glyphicon-move {
  171. float: left;
  172. }
  173. .remove_function_button, .minimize_function_button, .add_var_top_button, .add_command_top_button {
  174. float: right;
  175. }
  176. .ui.icon.button.remove_function_button,
  177. .ui.icon.button.minimize_function_button {
  178. background: none;
  179. padding: 0;
  180. margin-top: 12px;
  181. }
  182. .ui.segment.variables_list_div,
  183. .ui.segment.commands_list_div {
  184. padding: 5px;
  185. margin: 0;
  186. margin-left: 30px;
  187. width: calc(100% - 30px);
  188. background-color: #f9f9f9;
  189. min-height: 30px;
  190. }
  191. .ui.segment.variables_list_div {
  192. margin-top: 5px;
  193. }
  194. .ui.labeled.icon.button.add_variable_button,
  195. .ui.labeled.icon.button.add_command_button {
  196. }
  197. .program_signature {
  198. font-weight: bold;
  199. margin: -3px 0 10px -5px;
  200. }
  201. .program_final {
  202. font-weight: bold;
  203. margin: 5px 0 0 -5px;
  204. }
  205. .parameters_list {
  206. display: inline;
  207. }
  208. .parameter_type {
  209. margin-left: 10px;
  210. margin-right: 15px;
  211. }
  212. .function_return .dropdown .icon, .parameter_type .dropdown .icon {
  213. margin-left: 6px;
  214. }
  215. .tabela_var {
  216. display: inline;
  217. }
  218. .buttons_manage_columns i, .tr_manage_lines i {
  219. cursor: pointer;
  220. display: inline;
  221. }
  222. div.buttons_manage_columns {
  223. display: inline;
  224. }
  225. .tr_manage_lines {
  226. text-align: center;
  227. }
  228. .div_valor_var {
  229. display: inline;
  230. }
  231. .ui.comment span {
  232. font-style: italic;
  233. }
  234. .ui.comment, .ui.reader, .ui.writer, .ui.attribution, .ui.iftrue, .ui.repeatNtimes, .ui.whiletrue, .ui.dowhiletrue, .ui.switch, .ui.functioncall,
  235. .ui.return {
  236. padding: 5px;
  237. margin: 5px;
  238. background: #f7f2c9;
  239. border: 2px solid #4d4be3;
  240. border-radius: 0.25em;
  241. box-shadow: 1px 1px;
  242. }
  243. .ui.repeatNtimes .separator_character {
  244. margin-right: 10px;
  245. margin-left: 15px;
  246. }
  247. .ui.repeatNtimes, .ui.whiletrue {
  248. min-height: 50px;
  249. }
  250. .ui.dowhiletrue .ui.block_commands {
  251. min-height: 10px;
  252. }
  253. .add_var_top_button {
  254. padding-right: 50px;
  255. }
  256. .function_signature_div {
  257. min-height: 40px;
  258. padding-top: 8px;
  259. }
  260. .move_function {
  261. margin-top: 9px;
  262. }
  263. .div_start_minimize_v {
  264. float: right;
  265. width: 22px;
  266. height: 10px;
  267. }
  268. .global_var {
  269. margin-bottom: 7px;
  270. }
  271. .list_globals, .global_const {
  272. display: inline;
  273. }
  274. .created_element {
  275. position: absolute;
  276. width: 50%;
  277. z-index: 99999999;
  278. opacity: .8;
  279. cursor: move;
  280. }
  281. .width-dynamic {
  282. min-width: 100px;
  283. }
  284. .ui.icon.plus.square.outline.icon_add_item_to_writer {
  285. margin-right: 10px;
  286. margin-left: 10px;
  287. cursor: pointer;
  288. }
  289. .button_remove_command, .button_refresh_attribution {
  290. float: right;
  291. cursor: pointer;
  292. }
  293. .expression_drag {
  294. cursor: col-resize;
  295. border: 2px gray solid;
  296. display: inline;
  297. width: 5px;
  298. }
  299. .ui.icon.red.exclamation.triangle.error_icon {
  300. float: left;
  301. margin-left: -1.6em;
  302. z-index: 10;
  303. position: absolute;
  304. font-size: 1.5em;
  305. }
  306. .height_100 {
  307. height: 100%;
  308. }
  309. .default_visual_title {
  310. display: none;
  311. }
  312. .expandingArea textarea {
  313. min-height: 30px;
  314. resize: none;
  315. padding: 5px;
  316. }
  317. .ui table .btn_actions {
  318. text-align: center;
  319. }
  320. .button_remove_case {
  321. cursor: pointer;
  322. padding: 3px;
  323. }
  324. .accordion {
  325. margin: auto;
  326. }
  327. .global_container:hover,
  328. .variable_container:hover {
  329. border: 2px solid gray;
  330. padding-left: 8px;
  331. padding-right: 8px;
  332. padding-top: 5px;
  333. padding-bottom: 4px;
  334. }
  335. .ui.label.function_name_parameter:hover {
  336. border: 2px solid gray;
  337. padding: 5px 6px 5px 6px;
  338. }
  339. .ui.label.function_name_parameter {
  340. padding: 7px 8px 7px 8px;
  341. }
  342. .global_container:hover, .variable_container:hover {
  343. margin-bottom: 4px !important;
  344. }
  345. .global_container .global_type, .editing_name_var, .global_container .span_value_variable,
  346. .variable_container .variable_type, .variable_container .span_value_variable,
  347. .ui.dropdown.function_return, div.function_name_div_updated,
  348. .ui.dropdown.parameter_type, .parameter_div_edit {
  349. background: #cecece;
  350. border-radius: 5px;
  351. padding: 4px;
  352. margin-left: 5px;
  353. margin-right: 5px;
  354. }
  355. .parameter_div_edit {
  356. padding-bottom: 2px;
  357. padding-top: 2px;
  358. }
  359. .ui.dropdown.parameter_type {
  360. }
  361. div.function_name_div_updated {
  362. padding-top: 5px;
  363. padding-bottom: 5px;
  364. margin-right: 10px;
  365. }
  366. .function_name_div_updated .name_function_updated {
  367. padding-left: 10px;
  368. padding-right: 10px;
  369. }
  370. .variable_container .variable_type {
  371. padding: 5px;
  372. margin-left: 0;
  373. margin-right: 3px;
  374. }
  375. .global_container .global_type:hover, .global_container .span_value_variable:hover,
  376. .variable_container .variable_type:hover, .variable_container .span_value_variable:hover,
  377. .ui.dropdown.function_return:hover, div.function_name_div_updated:hover,
  378. .ui.dropdown.parameter_type:hover, .parameter_div_edit:hover {
  379. background: #848484;
  380. color: #fff;
  381. z-index: 999999;
  382. }
  383. .editing_name_var {
  384. min-width: 40px;
  385. padding-top: 3px;
  386. padding-bottom: 3px;
  387. }
  388. .global_container .global_type:active,
  389. .variable_container .variable_type:active,
  390. .ui.dropdown.function_return:active,
  391. div.function_name_div_updated:active,
  392. .ui.dropdown.parameter_type:active {
  393. background: #636363;
  394. color: #fff;
  395. }
  396. .global_container i {
  397. cursor: pointer;
  398. }
  399. .global_container .ui.icon.plus.square.outline, .global_container .ui.icon.minus.square.outline {
  400. font-size: 120%;
  401. }
  402. .character_equals {
  403. font-size: 150%;
  404. display: inline;
  405. margin-left: 3px;
  406. margin-right: -2px;
  407. }
  408. .yellow.icon.times.remove_global,
  409. .yellow.icon.times.remove_variable,
  410. .yellow.icon.times.remove_parameter {
  411. float: right;
  412. margin-right: -1px;
  413. margin-left: 8px;
  414. opacity: 0;
  415. }
  416. .global_container:hover > .yellow.icon.times.remove_global, .variable_container:hover > .yellow.icon.times.remove_variable,
  417. .function_name_parameter:hover > .yellow.icon.times.remove_parameter {
  418. opacity: 1;
  419. }
  420. .tr_manage_lines {
  421. padding-top: 10px;
  422. }
  423. .ui.icon.button.add-globalVar-button.add_global_button {
  424. padding: 7px;
  425. margin-bottom: 4px;
  426. padding-bottom: 9px;
  427. }
  428. .all_functions {
  429. margin-top: -5px;
  430. }
  431. .only_in_frame {
  432. position: absolute;
  433. z-index: 9999;
  434. width: 90px;
  435. top: 5px;
  436. left: 5px;
  437. opacity: .6;
  438. }
  439. .only_in_frame:hover {
  440. opacity: 1;
  441. }
  442. .only_in_frame:hover span {
  443. display: block;
  444. }
  445. .only_in_frame span {
  446. display: none;
  447. margin-top: -5px;
  448. }
  449. .ui.container.main_title {
  450. width: 85px;
  451. }
  452. .ui.label.global_container {
  453. margin-bottom: 3px;
  454. }
  455. .ui.label.variable_container {
  456. margin-bottom: 3px;
  457. }
  458. .created_div_valor_var {
  459. display: inline-block;
  460. }
  461. .ui.dropdown.function_return {
  462. padding-left: 15px;
  463. padding-right: 15px;
  464. margin-left: 10px;
  465. margin-right: 10px;
  466. }
  467. .parethesis_function {
  468. font-size: 120%;
  469. }
  470. .var_value_menu_div,
  471. .attribution .var_attributed,
  472. .component_element,
  473. .conditional_expression .expression_element,
  474. .menu_start_rendered,
  475. .attribution_expression .variable_attribution,
  476. .render_style_param,
  477. .attribution_expression .div_expression_st:not(:empty),
  478. .incrementation_field .incrementation_variable,
  479. .incrementation_field .first_operand:not(:empty),
  480. .incrementation_field .operator:not(:empty),
  481. .incrementation_field .second_operand:not(:empty),
  482. .single_element_expression, .ghost_parenthesis,
  483. .ui.repeatNtimes .conditional_expression {
  484. background: #e8e8e8;
  485. border-radius: 5px;
  486. min-width: 40px;
  487. padding: 2px;
  488. padding-left: 5px;
  489. padding-right: 5px;
  490. border: 1px solid gray;
  491. box-shadow: 0 3px 3px 0 rgba(0, 0, 0, 0.2), 0 3px 3px 0 rgba(0, 0, 0, 0.19);
  492. color: black;
  493. }
  494. .menu_start_rendered {
  495. padding-left: 12px;
  496. }
  497. .menu_start_rendered i {
  498. width: 1.5em;
  499. margin-right: -1em;
  500. }
  501. .row_container:hover, .column_container:hover {
  502. background: #cecece;
  503. }
  504. .column_container, .row_container {
  505. border-radius: 4px;
  506. border: 1px solid gray;
  507. padding: 1px 2px 1px 2px;
  508. background: #e8e8e8;
  509. box-shadow: 0 3px 3px 0 rgba(0, 0, 0, 0.2), 0 3px 3px 0 rgba(0, 0, 0, 0.19);
  510. }
  511. .var_value_menu_div div i {
  512. color: black;
  513. }
  514. .span_command_spec {
  515. color: black;
  516. font-weight: bold;
  517. font-size: 110%;
  518. }
  519. .ui.comment.command_container .var_value_menu_div {
  520. display: inline-block;
  521. width: 93%;
  522. }
  523. .ui.comment.command_container .var_value_menu_div .variable_rendered,
  524. .ui.comment.command_container .var_value_menu_div .value_rendered {
  525. width: 100%;
  526. cursor: text;
  527. font-style: italic;
  528. }
  529. .ui.comment.command_container .var_value_menu_div {
  530. cursor: text;
  531. }
  532. .ui.comment.command_container .var_value_menu_div {
  533. background: none;
  534. border-radius: 0;
  535. border: 0px solid gray;
  536. box-shadow: none;
  537. padding: 0px;
  538. font-size: 110%;
  539. }
  540. .ui.comment.command_container .var_name,
  541. .ui.comment.command_container .value_rendered {
  542. color: rgba(0,0,0,.6);
  543. }
  544. .ui.comment.command_container .var_value_menu_div input {
  545. width: 100%;
  546. display: inline-block;
  547. font-style: italic;
  548. }
  549. .ui.dropdown.menu_start_rendered .text i {
  550. padding-right: 8px;
  551. }
  552. * {
  553. font-family: 'Roboto', sans-serif;
  554. }
  555. .add_global_button i {
  556. font-size: 130%;
  557. }
  558. .global_var .circle.add_global_button, .global_var i.back,
  559. .ui.add_var_context .icon.plus.circle, .ui.add_var_context .icon.circle.back,
  560. .ui.rail .icon.plus.circle, .ui.rail .icon.circle.back {
  561. position: absolute;
  562. }
  563. .global_var .circle.add_global_button,
  564. .ui.add_var_context .icon.plus.circle,
  565. .ui.rail .icon.plus.circle {
  566. color: #bf80d4!important;
  567. cursor: pointer;
  568. font-style: 120%;
  569. }
  570. .global_var i.back,
  571. .ui.add_var_context .icon.circle.back,
  572. .ui.rail .icon.circle.back {
  573. color: white !important;
  574. }
  575. .ui.add_var_context{
  576. margin-left: -4px;
  577. }
  578. .ui.rail {
  579. color: #ab0054 !important;
  580. }
  581. .ui.add_var_context .icon.superscript {
  582. font-size: 110%;
  583. }
  584. .ui.add_var_context .ui.icon.button.purple {
  585. padding: 8px;
  586. }
  587. .global_container .global_const, .global_container .global_type,
  588. .variable_container .variable_type {
  589. font-size: 114%;
  590. }
  591. .global_container .editing_name_var,
  592. .variable_container .editing_name_var {
  593. font-size: 108%;
  594. }
  595. .global_container .global_const i {
  596. font-size: 120%;
  597. }
  598. .global_container .span_value_variable,
  599. .variable_container .span_value_variable {
  600. font-size: 110%;
  601. white-space: pre;
  602. }
  603. .global_container .global_type, .global_container .editing_name_var, .global_container .span_value_variable,
  604. .variable_container .variable_type, .variable_container .span_value_variable, .variable_container .editing_name_var,
  605. .ui.dropdown.parameter_type, .parameter_div_edit {
  606. background: black;
  607. border-radius: 5px;
  608. padding: 4px;
  609. margin-left: 5px;
  610. margin-right: 5px;
  611. }
  612. .global_container .global_type:hover, .global_container .editing_name_var:hover, .global_container .span_value_variable:hover,
  613. .variable_container .variable_type:hover, .variable_container .span_value_variable:hover, .variable_container .editing_name_var:hover,
  614. .ui.dropdown.parameter_type:hover, .parameter_div_edit:hover {
  615. background-color: #545353;
  616. }
  617. .yellow.icon.times.remove_global,
  618. .yellow.icon.times.remove_variable {
  619. color: yellow;
  620. font-size: 125%;
  621. }
  622. .ui.rail .icon.plus.circle {
  623. color: #ec9962 !important;
  624. }
  625. .ui.rail .icon.plus.circle,
  626. .ui.rail .icon.circle.back,
  627. .ui.add_var_context .icon.plus.circle,
  628. .ui.add_var_context .icon.circle.back,
  629. .global_var .icon.plus.circle,
  630. .global_var .icon.circle.back {
  631. left: 1.8em !important;
  632. margin-top: 1.5em !important;
  633. }
  634. .ui.rail .icon.plus.circle,
  635. .ui.rail .icon.circle.back {
  636. left: 1.3em !important;
  637. }
  638. .ui.icon.button.dropdown.menu_commands {
  639. color: white;
  640. margin-left: -4px;
  641. padding: 8px;
  642. margin-top: 0.3em;
  643. }
  644. .ui.dropdown.variable_type {
  645. padding: 5px;
  646. }
  647. .global_var .global_container .ellipsis,
  648. .variable_container .ui.icon.ellipsis.vertical.inverted,
  649. .ui.label.function_name_parameter.pink .ui.icon.ellipsis.vertical.inverted {
  650. position: relative;
  651. margin-left: -3px;
  652. margin-right: 4px;
  653. opacity: 0;
  654. cursor: move;
  655. font-size: 120%;
  656. }
  657. .global_container:hover > .ellipsis,
  658. .variable_container:hover > .ui.icon.ellipsis.vertical.inverted {
  659. opacity: 1;
  660. }
  661. .glyphicon.glyphicon-move.move_function i {
  662. font-size: 130%;
  663. }
  664. .span_name_parameter.label_enable_name_parameter {
  665. font-size: 94%;
  666. font-weight: 700;
  667. }
  668. .ui.dropdown.parameter_type {
  669. font-size: 96%;
  670. }
  671. .ui.label.function_name_parameter .ellipsis {
  672. font-size: 96% !important;
  673. margin-left: .05em !important;
  674. }
  675. .ui.label.function_name_parameter:hover > .ellipsis {
  676. opacity: 1 !important;
  677. }
  678. .command_drag {
  679. cursor: move;
  680. }
  681. .command_container.over_command_drag {
  682. border: 3px dotted blue !important;
  683. padding: 0.315em !important;
  684. }
  685. .commands_list_div.over_command_drag {
  686. border: 3px dotted blue !important;
  687. padding: 0.2em !important;
  688. }
  689. .ui.segment:first-child {
  690. margin-top: 1em !important;
  691. }
  692. div.ui.checkbox.transition.visible {
  693. margin-bottom: 1em;
  694. }
  695. .var_menu_select_content_error {
  696. background: #ff0000;
  697. color: white !important;
  698. border: 2px solid #3125ee;
  699. }
  700. .ui.iftrue, .ui.repeatNtimes, .ui.whiletrue, .ui.dowhiletrue, .ui.switch {
  701. background: #787fe721;
  702. }
  703. .ui.popup.invalid-identifier {
  704. background: #ff3232;
  705. color: white;
  706. font-weight: bold;
  707. border: 1px solid black;
  708. }
  709. .ui.popup.invalid-identifier:before {
  710. background: #ff3232;
  711. border-right: 1px solid black;
  712. border-bottom: 1px solid black;
  713. }
  714. .ui.popup.invalid-identifier i.ui.icon.inverted.exclamation.triangle.yellow {
  715. margin-left: -.5em;
  716. margin-right: .4em;
  717. }
  718. .ui.repeatNtimes.command_container .ui.block_commands,
  719. .ui.whiletrue.command_container .ui.block_commands {
  720. margin-top: .8em;
  721. }
  722. .ui.restart_expression {
  723. margin-left: .4em;
  724. cursor: pointer;
  725. color: brown;
  726. }
  727. .div_parent_handler {
  728. padding-top: 5px;
  729. padding-bottom: 6px;
  730. background: #7a7acf;
  731. border-radius: 4px;
  732. }
  733. .div_parent_handler i.times {
  734. margin-left: .3em;
  735. cursor: pointer;
  736. }
  737. .div_parent_handler i.ellipsis {
  738. cursor: move;
  739. }
  740. .div_parent_handler i.handler {
  741. opacity: 0;
  742. }
  743. .div_parent_handler:hover i.handler {
  744. opacity: 1;
  745. }
  746. .ui.block_commands {
  747. min-height: 20px !important;
  748. padding-top: 5px !important;
  749. }
  750. .ghost_div {
  751. height: 20px;
  752. background-color: #ffffff;
  753. margin: 5px;
  754. border: 2px dotted #000000;
  755. box-shadow: 1px 1px;
  756. height: 28px;
  757. border: 2px solid green;
  758. }
  759. .ghost_element, .ghost_parenthesis {
  760. opacity: 0;
  761. }
  762. .expression_elements:hover .ghost_element, .expression_elements:hover .ghost_parenthesis {
  763. }
  764. .ghost_element:hover, .ghost_parenthesis:hover {
  765. opacity: 1.0 !important;
  766. }
  767. .usepointer, .ghost_element, .ghost_parenthesis, .add_parentheses {
  768. cursor: pointer !important;
  769. }
  770. .add_parentheses {
  771. margin-left: 20px;
  772. }
  773. .temp_class {
  774. opacity: 0;
  775. }
  776. .parentheses_ghost {
  777. display: inline;
  778. background-color: #2ecc40;
  779. padding: 1px 4px;
  780. font-size: 120%;
  781. padding-bottom: 2px;
  782. font-weight: bold;
  783. margin: 0px 4px;
  784. border-radius: 4px;
  785. box-shadow: 4px black;
  786. box-shadow: 1px 1px;
  787. border: 1px solid gray;
  788. }
  789. .single_element_expression {
  790. }
  791. .floating_parenthesis {
  792. padding: 3px 2px;
  793. border: 1px solid gray;
  794. background-color: #e8e8e8;
  795. width: 30px;
  796. text-align: center;
  797. border-radius: 5px;
  798. font-weight: bold;
  799. box-shadow: 2px 2px grey;
  800. }
  801. .remove_element_expression {
  802. display: inline;
  803. position: absolute;
  804. top: -15px;
  805. right: -5px;
  806. }
  807. .mouse_distance {
  808. }
  809. .mouse_distance_hidden {
  810. display: none !important;
  811. }
  812. .mouse_distance_except {
  813. display: inline !important;
  814. }
  815. .higher_element {
  816. display: inline;
  817. min-width: 10px !important;
  818. min-height: 10px;
  819. position: absolute;
  820. margin-left: -10px;
  821. margin-top: -5px;
  822. padding-left: 5px;
  823. }
  824. .ghost_element {
  825. border: 2px solid green !important;
  826. box-shadow: #8f8f8f 2px 2px !important;
  827. background: #d8ffd8 !important;
  828. }
  829. .ui.button.green.add_expression {
  830. padding: 2px;
  831. padding-top: 5px;
  832. padding-bottom: 5px;
  833. margin-left: 5px;
  834. padding-left: 10px;
  835. }
  836. .ui.button.green.add_expression i {
  837. font-size: 110%;
  838. }
  839. .simple_add {
  840. display: inline;
  841. }
  842. .lixeira {
  843. position: absolute;
  844. top: 300px;
  845. left: 200px;
  846. height: 100px;
  847. background-image: url('../img/trash-icon.png');
  848. width: 125px !important;
  849. background-position: 0;
  850. background-repeat: no-repeat;
  851. display: none;
  852. }
  853. .lixeira .trash {
  854. font-size: 3em;
  855. }
  856. .color_test {
  857. background-color: green;
  858. }
  859. .parentheses_fixed {
  860. background-color: #617063 !important;
  861. color: white !important;
  862. }
  863. .parentheses_in_expression {
  864. cursor: pointer;
  865. }
  866. .ivprog-error-varname {
  867. font-style: italic;
  868. margin-left: 1px;
  869. margin-right: 1px;
  870. }
  871. .disabled {
  872. pointer-events: none;
  873. }
  874. .dimmer_content_message {
  875. color: white;
  876. display: none;
  877. }
  878. .circular.inverted.teal.question.icon {
  879. font-size: 12px;
  880. margin-left: 10px;
  881. }
  882. .table_buttons {
  883. width: 100%;
  884. margin-top: 10px;
  885. }
  886. .table_buttons .right_align {
  887. text-align: right;
  888. }
  889. .text_area_output, .text_area_input {
  890. width: 80%;
  891. }
  892. .tabular .item {
  893. font-size: 1.1em;
  894. }
  895. .tabular.menu {
  896. margin-top: 1em !important;
  897. }
  898. .ui.bottom.attached.tab.segment, .tabular.menu {
  899. margin-left: 1em !important;
  900. margin-right: 1em !important;
  901. }
  902. .ui.blue.table thead tr:first-child > th {
  903. position: sticky !important;
  904. top: 0;
  905. z-index: 2;
  906. }
  907. .ui.bottom.attached.tab.segment.tab_algorithm {
  908. height: 90%;
  909. }
  910. .ui.segment.settings_topic h3 {
  911. margin-bottom: 20px;
  912. }
  913. .settings_topic .content_segment_settings {
  914. margin-left: 40px;
  915. }
  916. .ui.repeatNtimes .span_command_spec {
  917. margin-right: 10px;
  918. }
  919. .ui.repeatNtimes .ui.attribution_expression {
  920. margin-right: -10px;
  921. }
  922. .ui.repeatNtimes .ui.var_value_expression.div_expression_st {
  923. margin-left: -10px;
  924. }
  925. .pass_button {
  926. margin-left: 10px;
  927. }
  928. .pass_button button {
  929. padding-bottom: 2px;
  930. }
  931. /* Write newline button*/
  932. .ivprog_newline_btn {
  933. position: absolute;
  934. height: 32px;
  935. cursor: pointer;
  936. }
  937. .ui.icon.button.minimize_block_button {
  938. background: none;
  939. float: right;
  940. padding-top: .25rem;
  941. margin-right: .3rem;
  942. }
  943. div.ui.dropdown.menu_commands.pause {
  944. }
  945. .context_menu {
  946. display: inline;
  947. margin-left: 1rem;
  948. }
  949. .data_block_if span.textual_expression,
  950. .ui.dowhiletrue span.textual_expression,
  951. .ui.whiletrue span.textual_expression,
  952. .attribution span.textual_expression,
  953. .writer span.textual_expression,
  954. .return span.textual_expression {
  955. color: #2325a6;
  956. font-weight: bold;
  957. font-size: 1.2rem;
  958. }
  959. i.button_alternate_expression {
  960. cursor: pointer;
  961. font-size: 1.1rem;
  962. margin-left: 0.3rem;
  963. color: black;
  964. }
  965. .attribution i.button_alternate_expression {
  966. margin-left: .8rem;
  967. }
  968. .repeatN_text_par_1, .repeatN_text_par_2,
  969. .repeatN_text_par_3, .repeatN_text_par_4 {
  970. margin-left: .2rem;
  971. font-weight: bold;
  972. font-size: 1.2rem;
  973. margin-right: .3rem;
  974. color: #2325a6;
  975. }
  976. .repeatN_text_par_1 {
  977. margin-left: -1.2rem;
  978. }
  979. .writer .button_alternate_expression {
  980. margin-left: 2.5rem;
  981. }
  982. .ui.dropdown.menu_commands.pause button {
  983. border: none;
  984. background: #f2711c;
  985. color: white;
  986. border-radius: .2rem;
  987. padding: .1rem;
  988. padding-left: 0.1rem;
  989. font-size: .9rem;
  990. padding-left: .25rem;
  991. cursor: pointer;
  992. margin-top: .15rem;
  993. }
  994. .button_write_expression {
  995. cursor: pointer;
  996. margin-left: 1rem !important;
  997. }
  998. .input-expression-field {
  999. width: 50%;
  1000. }
  1001. .expression-edit-confirm {
  1002. color: #32a852;
  1003. font-size: 1.2rem !important;
  1004. cursor: pointer;
  1005. margin-left: 1rem !important;
  1006. margin-right: 1rem !important;
  1007. }
  1008. .expression-edit-cancel {
  1009. cursor: pointer;
  1010. }