pen-backend.css 4.8 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218
  1. body.no-js #pen_post_meta {
  2. margin: 1em 0 0;
  3. }
  4. #pen_post_meta,
  5. #pen_post_meta .pen_post_meta_options,
  6. #pen_post_meta .pen_post_meta_container,
  7. #pen_meta_box_footer {
  8. -webkit-box-sizing: border-box;
  9. -moz-box-sizing: border-box;
  10. box-sizing: border-box;
  11. float: left;
  12. width: 100%;
  13. }
  14. body.no-js #pen_meta_box #pen_meta_tools {
  15. display: none;
  16. }
  17. #pen_meta_box #pen_meta_tools {
  18. margin: 0 0 1em;
  19. }
  20. #pen_meta_box #pen_meta_tools,
  21. #pen_meta_box #pen_meta_tools .pen_meta_tool.pen_expanded {
  22. -webkit-box-sizing: border-box;
  23. -moz-box-sizing: border-box;
  24. box-sizing: border-box;
  25. float: left;
  26. width: 100%;
  27. }
  28. #pen_meta_box #pen_meta_tools .pen_meta_tool_close:before,
  29. #pen_meta_box #pen_meta_tools #pen_meta_tool_overview:before {
  30. content: "\f158";
  31. font-family: "dashicons";
  32. font-weight: normal;
  33. vertical-align: bottom;
  34. }
  35. #pen_meta_box #pen_meta_tools > .button,
  36. #pen_meta_box #pen_meta_tools #pen_meta_tool_overview:before {
  37. margin: 0 0.25em 0 0;
  38. }
  39. #pen_meta_box #pen_meta_tools #pen_meta_tool_overview:before {
  40. content: "\f504";
  41. }
  42. #pen_meta_box #pen_meta_tools > .button {
  43. float: left;
  44. }
  45. #pen_meta_box #pen_meta_tools .pen_meta_tool.pen_expanded {
  46. background: #f7f7f7;
  47. border: 1px solid #ddd;
  48. border-radius: 5px;
  49. box-shadow: 1px 1px 2px rgba(0,0,0,0.2);
  50. display: block;
  51. margin: 1em 0 0;
  52. padding: 1em;
  53. position: relative;
  54. }
  55. #pen_meta_box #pen_meta_tools .pen_meta_tool .pen_meta_tool_close {
  56. position: absolute;
  57. right: 1em;
  58. top: 1em;
  59. }
  60. #pen_meta_box #pen_meta_tools table {
  61. background: rgba(255,255,255,0.75);
  62. border: 1px solid #ccc;
  63. border-collapse: collapse;
  64. box-shadow: 1px 1px 2px rgba(0,0,0,0.3);
  65. margin: 1em 0;
  66. min-width: 400px;
  67. text-transform: capitalize;
  68. }
  69. #pen_meta_box #pen_meta_tools table tr {
  70. cursor: pointer;
  71. }
  72. #pen_meta_box #pen_meta_tools table th,
  73. #pen_meta_box #pen_meta_tools table td {
  74. border: 1px solid #fff;
  75. }
  76. #pen_meta_box #pen_meta_tools table th {
  77. background: #ddd;
  78. padding: 1em;
  79. text-align: left;
  80. }
  81. #pen_meta_box #pen_meta_tools table td {
  82. padding: 0.5em 1em;
  83. }
  84. #pen_meta_box #pen_meta_tools table tr.pen_active td {
  85. background: #eaeaea;
  86. }
  87. #pen_post_meta .postbox {
  88. margin: 0 0 5px;
  89. }
  90. #pen_post_meta .postbox:last-child {
  91. margin: 0;
  92. }
  93. #pen_post_meta .pen_post_meta_container {
  94. padding: 1em;
  95. }
  96. #pen_post_meta h3 {
  97. background: #e0e0e0;
  98. background: -ms-linear-gradient(325deg, #f0f0f0 0%, #e0e0e0 100%);
  99. background: linear-gradient(125deg, #f0f0f0 0%, #e0e0e0 100%);
  100. margin: 0;
  101. padding: 0.5em 1em;
  102. position: relative;
  103. }
  104. body.js #pen_post_meta h3 {
  105. cursor: pointer;
  106. }
  107. #pen_post_meta h3 .handlediv {
  108. position: absolute;
  109. right: 0;
  110. top: 0;
  111. }
  112. #pen_post_meta fieldset {
  113. border-top: 1px solid #ddd;
  114. margin: 0 0 0.5em;
  115. padding: 0 0 0.5em;
  116. }
  117. #pen_post_meta fieldset:last-child {
  118. margin: 0;
  119. }
  120. #pen_post_meta fieldset legend {
  121. background: #eee;
  122. border: 1px solid #ddd;
  123. border-radius: 3px;
  124. font-weight: bold;
  125. margin: 0;
  126. padding: 0.5em 1em 0.5em 1.5em;
  127. position: relative;
  128. }
  129. #pen_post_meta fieldset legend:before {
  130. color: #aaa;
  131. content: "\f139";
  132. font-family: "dashicons";
  133. font-size: 1.5em;
  134. left: 0;
  135. position: absolute;
  136. top: 50%;
  137. transform: translateY(-50%);
  138. }
  139. #pen_post_meta label {
  140. font-weight: bold;
  141. line-height: 1;
  142. white-space: nowrap;
  143. }
  144. #pen_post_meta label + select {
  145. margin: 5px 0 0;
  146. }
  147. #pen_post_meta .pen_wrap {
  148. background: rgba(255,255,255,0.75);
  149. border: 1px solid #fff;
  150. border-radius: 5px;
  151. -webkit-box-sizing: border-box;
  152. -moz-box-sizing: border-box;
  153. box-sizing: border-box;
  154. float: left;
  155. margin: 5px 2% 0 0;
  156. padding: 7px 10px;
  157. transition: background-color .1s, border-color .1s, color .1s;
  158. width: 18%;
  159. }
  160. #pen_post_meta .pen_sidebars .pen_wrap {
  161. width: 31.33%;
  162. }
  163. #side-sortables #pen_post_meta .pen_wrap,
  164. #side-sortables #pen_post_meta .pen_sidebars .pen_wrap {
  165. margin-left: 0;
  166. margin-right: 0;
  167. width: 100%;
  168. }
  169. #pen_post_meta .pen_wrap.pen_post_meta_enable {
  170. background: #dcf3df;
  171. border: 1px solid #89d291;
  172. color: #005d0c;
  173. }
  174. #pen_post_meta .pen_wrap.pen_post_meta_disable {
  175. background: #ffe3e3;
  176. border: 1px solid #e4aaaa;
  177. color: #c30000;
  178. }
  179. #pen_meta_box .pen_only {
  180. background: #7f7f7f;
  181. border-radius: 100px;
  182. box-shadow: 1px 1px 3px rgba(0,0,0,0.75) inset;
  183. color: #fff;
  184. cursor: help;
  185. display: inline-block;
  186. font-size: 0.857em;
  187. font-weight: bold;
  188. margin: 0 5px 0 0;
  189. padding-left: 5px;
  190. padding-right: 5px;
  191. text-shadow: 1px 1px 3px rgba(0,0,0,0.5);
  192. }
  193. #pen_meta_box_footer {
  194. border-top: 1px solid #ccc;
  195. margin: 1em 0 0;
  196. padding: 1em 0 0;
  197. text-align: right;
  198. }
  199. #pen_meta_box_footer label {
  200. vertical-align: baseline;
  201. }
  202. #pen_meta_box_footer .pen_left {
  203. float: left;
  204. }
  205. #pen_meta_box_footer .pen_right {
  206. float: right;
  207. }
  208. #pen_meta_box_footer .pen_order:after {
  209. content: "\f344";
  210. font-family: "dashicons";
  211. margin: 0 0 0 1em;
  212. vertical-align: bottom;
  213. }
  214. @media only screen and (max-width:1024px) {
  215. #pen_post_meta .pen_sidebars .pen_wrap {
  216. width: 100%;
  217. }
  218. }