_form.scss 2.6 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144
  1. // import crowi variable
  2. @import 'utilities';
  3. .crowi.main-container .main .content-main.on-edit { // {{{ Edit Form of Page
  4. padding: 0;
  5. position: fixed;
  6. z-index: 1050;
  7. background: #fff;
  8. top: 0;
  9. left: 0;
  10. height: 100%;
  11. width: 100%;
  12. .nav {
  13. margin-top: 8px;
  14. height: 40px;
  15. .dropdown-menu {
  16. z-index: 1060;
  17. }
  18. }
  19. .tab-content {
  20. top: 48px;
  21. bottom: 58px;
  22. position: absolute;
  23. z-index: 1051;
  24. left: 0;
  25. right: 0;
  26. margin-top: 4px;
  27. .alert-info.alert-moved,
  28. .alert-info.alert-unlinked {
  29. display: none;
  30. }
  31. // layout (height: 100%)
  32. .edit-form {
  33. height: 100%;
  34. > form {
  35. height: 100%;
  36. > #page-editor {
  37. height: 100%;
  38. .row, .col-md-6, .col-sm-12,
  39. .react-codemirror2, .CodeMirror, .CodeMirror-scroll,
  40. .page-editor-preview-body
  41. {
  42. height: 100%;
  43. }
  44. }
  45. }
  46. }
  47. }
  48. .page-form-setting {
  49. .extended-setting {
  50. label {
  51. margin-bottom: 0;
  52. }
  53. }
  54. }
  55. .page-editor-editor-container {
  56. padding-right: 0;
  57. border-right: 1px solid #ccc;
  58. // override CodeMirror styles
  59. .CodeMirror {
  60. pre {
  61. font-family: $font-family-monospace-not-strictly;
  62. }
  63. .cm-matchhighlight {
  64. background-color: cyan;
  65. }
  66. .CodeMirror-selection-highlight-scrollbar {
  67. background-color: darkcyan;
  68. }
  69. }
  70. }
  71. .page-editor-preview-container {
  72. }
  73. .page-editor-preview-body {
  74. padding-top: 18px;
  75. padding-right: 15px;
  76. overflow-y: scroll;
  77. }
  78. .form-group.form-submit-group {
  79. position: fixed;
  80. z-index: 1054;
  81. bottom: 0;
  82. width: 100%;
  83. left: 0;
  84. padding: 8px;
  85. min-height: 50px;
  86. background: rgba(255,255,255,.8);
  87. border-top: solid 1px #ccc;
  88. margin-bottom: 0;
  89. }
  90. } // }}}
  91. .crowi.main-container .main .page-list.content-main { // {{{ Edit Form of Page List
  92. .close-button {
  93. display: none;
  94. }
  95. }
  96. .crowi.main-container .main .page-list.content-main.on-edit { // {{{ Edit Form of Page List
  97. .close-button {
  98. display: block;
  99. }
  100. .page-list-container {
  101. display: none;
  102. }
  103. .portal-form-header {
  104. height: 16px;
  105. padding: 8px;
  106. border-bottom: solid 1px #ccc;
  107. }
  108. } // }}}
  109. @media (max-width: $screen-sm-max) { // {{{ less than tablet size
  110. .content-main.on-edit {
  111. .form-group.form-submit-group {
  112. select.form-control {
  113. display: inline-block;
  114. max-width: 50%;
  115. }
  116. }
  117. }
  118. } // }}}
  119. @media (max-width: $screen-xs-max) { // {{{ less than smartphone size
  120. #edit-form-submit {
  121. float: right;
  122. }
  123. } // }}}