_page.scss 2.8 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149
  1. // import diff2html styles
  2. @import '~diff2html/bundles/css/diff2html.min.css';
  3. .revision-history {
  4. .revision-history-list {
  5. .revision-history-outer {
  6. // add border-top except of first element
  7. &:not(:first-of-type) {
  8. @extend .border-top;
  9. }
  10. .revision-history-main {
  11. .picture-lg {
  12. width: 32px;
  13. height: 32px;
  14. }
  15. .revision-history-meta {
  16. a:hover {
  17. cursor: pointer;
  18. }
  19. }
  20. .caret {
  21. transition: 0.4s;
  22. transform: rotate(-90deg);
  23. &.caret-opened {
  24. transform: rotate(0deg);
  25. }
  26. }
  27. }
  28. .revision-history-main-nodiff {
  29. .picture-container {
  30. min-width: 32px;
  31. text-align: center; // centering .picture
  32. }
  33. }
  34. .revision-history-diff {
  35. padding-left: 40px;
  36. color: $gray-900;
  37. table-layout: fixed;
  38. }
  39. }
  40. li {
  41. position: relative;
  42. list-style: none;
  43. }
  44. }
  45. // compacted list
  46. .revision-history-list-compact {
  47. .revision-history-outer-contiguous-nodiff {
  48. border-top: unset !important; // force unset border
  49. }
  50. }
  51. // adjust
  52. // this is for diff2html. hide page name from diff view
  53. .d2h-file-header {
  54. display: none;
  55. }
  56. .d2h-diff-tbody {
  57. background-color: white;
  58. }
  59. }
  60. /**
  61. * for table with handsontable modal button
  62. */
  63. .editable-with-handsontable {
  64. position: relative;
  65. .handsontable-modal-trigger {
  66. position: absolute;
  67. top: 11px;
  68. right: 10px;
  69. padding: 0;
  70. font-size: 16px;
  71. line-height: 1;
  72. vertical-align: bottom;
  73. background-color: transparent;
  74. border: none;
  75. opacity: 0;
  76. }
  77. .page-mobile & .handsontable-modal-trigger {
  78. opacity: 0.3;
  79. }
  80. &:hover .handsontable-modal-trigger {
  81. opacity: 1;
  82. }
  83. }
  84. /**
  85. * for drawio with drawio iframe button
  86. */
  87. .editable-with-drawio {
  88. .drawio-iframe-trigger {
  89. top: 11px;
  90. right: 40px;
  91. z-index: 14;
  92. font-size: 12px;
  93. line-height: 1;
  94. }
  95. }
  96. .card.grw-page-status-alert {
  97. $margin-bottom: $grw-navbar-bottom-height + 10px;
  98. box-shadow: 0px 2px 4px #0000004d;
  99. opacity: 0.9;
  100. @include media-breakpoint-down(sm) {
  101. margin: 0 10px $margin-bottom;
  102. .grw-card-label-container {
  103. text-align: center;
  104. }
  105. .grw-card-btn-container {
  106. text-align: center;
  107. .btn {
  108. @include button-size($btn-padding-y-lg, $btn-padding-x-lg, $btn-font-size-lg, $btn-line-height-lg, $btn-border-radius-lg);
  109. }
  110. }
  111. }
  112. @include media-breakpoint-up(md) {
  113. width: 700px;
  114. margin: 0 auto $margin-bottom;
  115. .card-body {
  116. display: flex;
  117. align-items: center;
  118. justify-content: space-between;
  119. }
  120. .grw-card-label-container,
  121. .grw-card-btn-container {
  122. margin: 0;
  123. }
  124. }
  125. }