infobox.less 1.9 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757677787980818283848586878889909192
  1. .infobox {
  2. .panel-heading{
  3. background-color: @dim-gray;
  4. .panel-title{
  5. font-weight: 700;
  6. }
  7. }
  8. .header_url {
  9. white-space: nowrap;
  10. overflow: hidden;
  11. text-overflow: ellipsis;
  12. display: block;
  13. }
  14. p{
  15. font-family: "DejaVu Serif", Georgia, Cambria, "Times New Roman", Times, serif !important;
  16. font-style: italic;
  17. }
  18. img{
  19. max-height: "250px";
  20. }
  21. .btn{
  22. background-color: @dark-blue;
  23. border: none;
  24. a{
  25. color: white;
  26. margin: 5px;
  27. }
  28. }
  29. .infobox_part {
  30. margin-bottom: 20px;
  31. word-wrap: break-word;
  32. table-layout: fixed;
  33. }
  34. .infobox_part:last-child {
  35. margin-bottom: 0;
  36. }
  37. .infobox_toggle {
  38. width: 100%;
  39. text-align: center;
  40. margin-bottom: 0px;
  41. cursor: pointer;
  42. }
  43. .infobox_toggle:hover {
  44. background: @mild-gray;
  45. }
  46. // Shrink infobox size when toggle is off
  47. .infobox_checkbox ~ .infobox_body {
  48. max-height: 300px;
  49. overflow: hidden;
  50. }
  51. .infobox_checkbox:checked ~ .infobox_body {
  52. max-height: none;
  53. }
  54. // Show toggle button as down when infobox is shrunk
  55. .infobox_checkbox ~ .infobox_toggle .infobox_label_down {
  56. display: block;
  57. }
  58. .infobox_checkbox ~ .infobox_toggle .infobox_label_up {
  59. display: none;
  60. }
  61. // Show toggle button as up when infobox is expanded
  62. .infobox_checkbox:checked ~ .infobox_toggle .infobox_label_up {
  63. display: block;
  64. }
  65. .infobox_checkbox:checked ~ .infobox_toggle .infobox_label_down {
  66. display: none;
  67. }
  68. // Hide main image when toggle is off
  69. .infobox_checkbox ~ .infobox_body img.infobox_part {
  70. display: none;
  71. }
  72. .infobox_checkbox:checked ~ .infobox_body img.infobox_part {
  73. display: block;
  74. }
  75. }