gutenberg.css 4.9 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226
  1. .field--gutenberg #edit-body-0-format {
  2. display: none;
  3. }
  4. .gutenberg-header-settings .form-actions {
  5. margin: 0;
  6. padding: 0;
  7. }
  8. .components-panel__header.edit-post-sidebar-header .components-icon-button {
  9. display: none;
  10. }
  11. .gutenberg__editor .edit-post-layout .edit-post-sidebar .edit-post-sidebar__panel-tabs ul {
  12. width: 100%;
  13. }
  14. @media screen and (min-width: 782px) {
  15. .gutenberg__editor .edit-post-layout.is-sidebar-opened .edit-post-sidebar {
  16. min-width: 350px;
  17. }
  18. }
  19. .components-panel__header.edit-post-sidebar__panel-tabs li {
  20. flex: 1;
  21. }
  22. .edit-post-sidebar button.edit-post-sidebar__panel-tab {
  23. width: 100%;
  24. }
  25. .gutenberg__editor #edit-status-wrapper {
  26. margin: 1rem 0;
  27. }
  28. .gutenberg__editor #edit-status-wrapper .form-item {
  29. padding: 0;
  30. }
  31. .gutenberg__editor #edit-status-wrapper .form-item label.option {
  32. position: relative;
  33. top: 2px;
  34. margin-left: 2px;
  35. font-weight: bolder;
  36. }
  37. .edit-post-sidebar .entity-meta .entity-meta__header {
  38. padding: 10px 10px;
  39. }
  40. .edit-post-sidebar .entity-meta {
  41. margin-bottom: 0;
  42. }
  43. .gutenberg__editor .components-icon-button:not(:disabled):not([aria-disabled=true]):not(.is-default):hover {
  44. box-shadow: unset;
  45. }
  46. @media screen and (min-width: 782px) {
  47. .edit-post-text-editor__body {
  48. max-width: 90%;
  49. margin-left: auto;
  50. margin-right: auto;
  51. }
  52. }
  53. .components-icon-button.has-text svg {
  54. margin-right: 0;
  55. }
  56. .gutenberg__editor .edit-post-text-editor__toolbar {
  57. display: flex;
  58. align-items: center;
  59. }
  60. .gutenberg__editor .edit-post-text-editor {
  61. padding-top: 22px;
  62. }
  63. .edit-post-layout__metaboxes:not(:empty) {
  64. margin-bottom: 38px;
  65. }
  66. .gutenberg__editor .edit-post-layout .edit-post-sidebar .form-type-radio,
  67. .gutenberg__editor .edit-post-layout .edit-post-sidebar .form-type-checkbox {
  68. padding-left: 0 !important;
  69. }
  70. .gutenberg__editor .edit-post-layout .edit-post-sidebar .form-type-radio .form-radio {
  71. margin-left: 0;
  72. margin-right: 0;
  73. width: 20px;
  74. height: 20px;
  75. }
  76. @media screen and (min-width: 782px) {
  77. body .gutenberg__editor .edit-post-layout .edit-post-header {
  78. top: 60px !important;
  79. }
  80. body.toolbar-horizontal.toolbar-tray-open .edit-post-layout__content {
  81. top: 130px !important;
  82. }
  83. body.toolbar-horizontal.toolbar-tray-open .edit-post-layout.is-mode-text .edit-post-layout__content {
  84. top: 180px !important;
  85. }
  86. body.toolbar-horizontal.toolbar-tray-open .edit-post-header {
  87. top: 102px !important;
  88. }
  89. .gutenberg__editor .edit-post-layout .edit-post-sidebar {
  90. top: 116px !important;
  91. }
  92. body.toolbar-horizontal.toolbar-tray-open .edit-post-sidebar {
  93. top: 158px !important;
  94. }
  95. }
  96. /* Gutenberg 8 */
  97. .interface-interface-skeleton,
  98. .toolbar-vertical.toolbar-tray-open .interface-interface-skeleton {
  99. top: 60px;
  100. }
  101. .toolbar-horizontal.toolbar-tray-open .interface-interface-skeleton {
  102. top: 102px;
  103. }
  104. .edit-post-layout__metaboxes {
  105. background-color: #ffffff;
  106. }
  107. .interface-interface-skeleton .edit-post-layout__metaboxes:not(:empty) {
  108. margin-bottom: 0;
  109. }
  110. .edit-post-layout__metaboxes:not(:empty) .edit-post-meta-boxes-area {
  111. max-width: 810px;
  112. margin: auto;
  113. }
  114. .interface-interface-skeleton .interface-complementary-area .form-type-checkbox .form-checkbox {
  115. margin-left: 0;
  116. width: 20px;
  117. height: 20px;
  118. }
  119. .interface-interface-skeleton .interface-complementary-area .form-item.form-type-checkbox {
  120. display: flex;
  121. }
  122. .interface-interface-skeleton .interface-complementary-area .form-item label.option {
  123. margin-bottom: 0;
  124. }
  125. .edit-post-manage-blocks-modal__checklist,
  126. .edit-post-keyboard-shortcut-help-modal__shortcut-list {
  127. margin-left: 0;
  128. padding-left: 0;
  129. }
  130. .edit-post-manage-blocks-modal__checklist-item {
  131. list-style: none;
  132. padding-left: 0;
  133. }
  134. .edit-post-manage-blocks-modal__checklist-item .components-checkbox-control__label {
  135. margin-bottom: 0;
  136. margin-right: 0;
  137. }
  138. .components-checkbox-control__checked {
  139. display: none;
  140. }
  141. .gutenberg input[type=checkbox]:focus,
  142. input.components-checkbox-control__input:focus {
  143. border: 2px solid #ccc;
  144. }
  145. @media (min-width: 768px) {
  146. .components-modal__frame {
  147. min-width: 500px;
  148. }
  149. }
  150. .gutenberg input[type=checkbox]:checked:focus,
  151. .components-modal__frame input[type=checkbox]:checked:focus {
  152. background-color: #0678be;
  153. box-shadow: inset 0 0 0 3px #fff;
  154. border: 2px solid #11a0d2;
  155. }
  156. .components-checkbox-control__input-container {
  157. width: 24px;
  158. height: 24px;
  159. }
  160. .components-modal__frame input[type=checkbox][aria-checked=mixed] {
  161. box-shadow: inset 0 0 0 3px #fff;
  162. background-color: #7cbc48;
  163. border-color: #7cbc48;
  164. }
  165. .components-modal__frame input[type=checkbox][aria-checked=mixed]:before {
  166. content: unset;
  167. }
  168. .edit-post-manage-blocks-modal__search .components-base-control__label {
  169. white-space: nowrap;
  170. margin-bottom: 0;
  171. }
  172. .edit-post-manage-blocks-modal__category-title .components-checkbox-control__label {
  173. margin-bottom: 0;
  174. }
  175. .components-base-control .components-base-control__field {
  176. display: flex;
  177. align-items: center;
  178. }