block-editor-styles.css 22 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681682683684685686687688689690691692693694695696697698699700701702703704705706707708709710711712713714715716717718719720721722723724725726727728729730731732733734735736737738739740741742743744745746747748749750751752753754755756757758759760761762763764765766767768769770771772773774775776777778779780781782783784785786787788789790791792793794795796797798799800801802803804805806807808809810811812813814815816817818819820821822823824825826827828829830831832833834835836837838839840841842843844845846847848849850851852853854855856857858859860861862863864865866867868869870871872873874875876877878879880881882883884885886887888889890891892893894895896897898899900901902903904905906907908909910911912913914915916917
  1. html {
  2. font-size: 93.75%;
  3. }
  4. /* Variables */
  5. /*---------- Media Query min-width Structure ----------*/
  6. /*---------- Media Query max-width Structure ----------*/
  7. /*---------- Break-point min-width Structure ----------*/
  8. /*---------- Break-point max-width Structure ----------*/
  9. /*---------- Font Size ----------*/
  10. /*---------- Line Height ----------*/
  11. /*---------- Site Basic Structure ----------*/
  12. /*---------- z-index Structure ----------*/
  13. /*
  14. * Button mixin- creates a button effect with correct
  15. * highlights/shadows, based on a base color.
  16. */
  17. .ast-highlight-wpblock-onhover .block-editor-block-list__layout .block-editor-block-list__block {
  18. transition: all 0.2s;
  19. }
  20. .ast-highlight-wpblock-onhover .block-editor-block-list__layout .block-editor-block-list__block.is-highlighted, .ast-highlight-wpblock-onhover .block-editor-block-list__layout .block-editor-block-list__block:hover {
  21. box-shadow: 0 0 0 var(--wp-admin-border-width-focus) var(--wp-admin-theme-color);
  22. }
  23. .ast-highlight-wpblock-onhover .block-editor-block-list__layout .block-editor-block-list__block.is-highlighted:after {
  24. box-shadow: none;
  25. }
  26. .edit-post-visual-editor {
  27. /* must have higher specificity than alternative color schemes inline styles */
  28. }
  29. .edit-post-visual-editor html {
  30. box-sizing: border-box;
  31. }
  32. .edit-post-visual-editor *,
  33. .edit-post-visual-editor *:before,
  34. .edit-post-visual-editor *:after {
  35. /* Inherit box-sizing to make it easier to change the property for components that leverage other behavior; see https://css-tricks.com/inheriting-box-sizing-probably-slightly-better-best-practice/ */
  36. box-sizing: inherit;
  37. }
  38. .edit-post-visual-editor body {
  39. color: #808285;
  40. background: #ffffff;
  41. /* Fallback for when there is no custom background color defined. */
  42. font-style: normal;
  43. }
  44. .edit-post-visual-editor ul, .edit-post-visual-editor ol {
  45. margin: 0 0 1.5em 3em;
  46. }
  47. .edit-post-visual-editor ul {
  48. list-style: disc;
  49. }
  50. .edit-post-visual-editor ol {
  51. list-style: decimal;
  52. }
  53. .edit-post-visual-editor li > ul,
  54. .edit-post-visual-editor li > ol {
  55. margin-bottom: 0;
  56. margin-left: 1.5em;
  57. }
  58. .edit-post-visual-editor dt {
  59. font-weight: bold;
  60. }
  61. .edit-post-visual-editor dd {
  62. margin: 0 1.5em 1.5em;
  63. }
  64. .edit-post-visual-editor b, .edit-post-visual-editor strong {
  65. font-weight: bold;
  66. }
  67. .edit-post-visual-editor dfn,
  68. .edit-post-visual-editor cite,
  69. .edit-post-visual-editor em,
  70. .edit-post-visual-editor i {
  71. font-style: italic;
  72. }
  73. .edit-post-visual-editor blockquote,
  74. .edit-post-visual-editor q {
  75. quotes: "" "";
  76. }
  77. .edit-post-visual-editor blockquote:before, .edit-post-visual-editor blockquote:after,
  78. .edit-post-visual-editor q:before,
  79. .edit-post-visual-editor q:after {
  80. content: "";
  81. }
  82. .edit-post-visual-editor blockquote {
  83. border-left: 5px solid rgba(0, 0, 0, 0.05);
  84. padding: 20px;
  85. font-size: 1.2em;
  86. font-style: italic;
  87. margin: 0 0 1.5em;
  88. position: relative;
  89. }
  90. .edit-post-visual-editor address {
  91. margin: 0 0 1.5em;
  92. }
  93. .edit-post-visual-editor abbr,
  94. .edit-post-visual-editor acronym {
  95. border-bottom: 1px dotted #666;
  96. cursor: help;
  97. }
  98. .edit-post-visual-editor pre {
  99. background: #eee;
  100. font-family: "Courier 10 Pitch", Courier, monospace;
  101. margin-bottom: 1.6em;
  102. overflow: auto;
  103. max-width: 100%;
  104. padding: 1.6em;
  105. }
  106. .edit-post-visual-editor code,
  107. .edit-post-visual-editor kbd,
  108. .edit-post-visual-editor tt,
  109. .edit-post-visual-editor var {
  110. font: 15px Monaco, Consolas, "Andale Mono", "DejaVu Sans Mono", monospace;
  111. }
  112. .edit-post-visual-editor img {
  113. height: auto;
  114. /* Make sure images are scaled correctly. */
  115. max-width: 100%;
  116. /* Adhere to container width. */
  117. }
  118. .edit-post-visual-editor hr {
  119. background-color: #ccc;
  120. border: 0;
  121. height: 1px;
  122. margin-bottom: 1.5em;
  123. }
  124. .edit-post-visual-editor .ast-button,
  125. .edit-post-visual-editor .button,
  126. .edit-post-visual-editor button,
  127. .edit-post-visual-editor input,
  128. .edit-post-visual-editor select,
  129. .edit-post-visual-editor textarea {
  130. color: #808285;
  131. font-weight: normal;
  132. font-size: 100%;
  133. /* Corrects font size not being inherited in all browsers */
  134. margin: 0;
  135. /* Addresses margins set differently in IE6/7, F3/4, S5, Chrome */
  136. vertical-align: baseline;
  137. /* Improves appearance and consistency in all browsers */
  138. }
  139. .edit-post-visual-editor button,
  140. .edit-post-visual-editor input {
  141. line-height: normal;
  142. /* Addresses FF3/4 setting line-height using !important in the UA stylesheet */
  143. }
  144. .edit-post-visual-editor big {
  145. font-size: 125%;
  146. }
  147. .edit-post-visual-editor mark,
  148. .edit-post-visual-editor ins {
  149. background: transparent;
  150. text-decoration: none;
  151. }
  152. .edit-post-visual-editor table, .edit-post-visual-editor th, .edit-post-visual-editor td {
  153. border: 1px solid rgba(0, 0, 0, 0.1);
  154. }
  155. .edit-post-visual-editor table {
  156. border-collapse: separate;
  157. border-spacing: 0;
  158. border-width: 1px 0 0 1px;
  159. margin: 0 0 1.5em;
  160. width: 100%;
  161. }
  162. .edit-post-visual-editor th {
  163. font-weight: bold;
  164. }
  165. .edit-post-visual-editor th, .edit-post-visual-editor td {
  166. padding: 8px;
  167. border-width: 0 1px 1px 0;
  168. }
  169. .edit-post-visual-editor ::selection {
  170. color: #fff;
  171. background: royalblue;
  172. }
  173. .edit-post-visual-editor body {
  174. -webkit-font-smoothing: antialiased;
  175. -moz-osx-font-smoothing: grayscale;
  176. }
  177. .edit-post-visual-editor body:not(.logged-in) {
  178. position: relative;
  179. }
  180. .edit-post-visual-editor #page {
  181. position: relative;
  182. }
  183. .edit-post-visual-editor a,
  184. .edit-post-visual-editor a:focus {
  185. text-decoration: none;
  186. }
  187. .edit-post-visual-editor a,
  188. .edit-post-visual-editor .site-header a *,
  189. .edit-post-visual-editor .site-footer a *,
  190. .edit-post-visual-editor .secondary a * {
  191. transition: all 0.2s linear;
  192. }
  193. .edit-post-visual-editor .capitalize {
  194. text-transform: uppercase;
  195. }
  196. .edit-post-visual-editor img {
  197. vertical-align: middle;
  198. }
  199. .edit-post-visual-editor .entry-content h1,
  200. .edit-post-visual-editor .entry-content h2,
  201. .edit-post-visual-editor .entry-content h3,
  202. .edit-post-visual-editor .entry-content h4,
  203. .edit-post-visual-editor .entry-content h5,
  204. .edit-post-visual-editor .entry-content h6 {
  205. margin-bottom: 20px;
  206. }
  207. .edit-post-visual-editor p {
  208. margin-bottom: 1.75em;
  209. }
  210. .edit-post-visual-editor blockquote {
  211. margin: 1.5em 1em 1.5em 3em;
  212. font-size: 1.1em;
  213. line-height: inherit;
  214. position: relative;
  215. }
  216. .edit-post-visual-editor .ast-button,
  217. .edit-post-visual-editor .button,
  218. .edit-post-visual-editor input[type="button"],
  219. .edit-post-visual-editor input[type="submit"] {
  220. border-radius: 0;
  221. padding: 18px 30px;
  222. border: 0;
  223. box-shadow: none;
  224. text-shadow: none;
  225. }
  226. .edit-post-visual-editor .ast-button:hover,
  227. .edit-post-visual-editor .button:hover,
  228. .edit-post-visual-editor input[type="button"]:hover,
  229. .edit-post-visual-editor input[type="submit"]:hover {
  230. box-shadow: none;
  231. }
  232. .edit-post-visual-editor .ast-button:active, .edit-post-visual-editor .ast-button:focus,
  233. .edit-post-visual-editor .button:active,
  234. .edit-post-visual-editor .button:focus,
  235. .edit-post-visual-editor input[type="button"]:active,
  236. .edit-post-visual-editor input[type="button"]:focus,
  237. .edit-post-visual-editor input[type="submit"]:active,
  238. .edit-post-visual-editor input[type="submit"]:focus {
  239. box-shadow: none;
  240. }
  241. .edit-post-visual-editor .site-title {
  242. font-weight: normal;
  243. }
  244. .edit-post-visual-editor .site-title,
  245. .edit-post-visual-editor .site-description {
  246. margin-bottom: 0;
  247. }
  248. .edit-post-visual-editor .site-title a,
  249. .edit-post-visual-editor .site-title:hover a,
  250. .edit-post-visual-editor .site-title:focus a,
  251. .edit-post-visual-editor .site-description a,
  252. .edit-post-visual-editor .site-description:hover a,
  253. .edit-post-visual-editor .site-description:focus a {
  254. transition: all 0.2s linear;
  255. }
  256. .edit-post-visual-editor .site-title a,
  257. .edit-post-visual-editor .site-title a:focus,
  258. .edit-post-visual-editor .site-title a:hover,
  259. .edit-post-visual-editor .site-title a:visited {
  260. color: #222;
  261. }
  262. .edit-post-visual-editor .site-description a,
  263. .edit-post-visual-editor .site-description a:focus,
  264. .edit-post-visual-editor .site-description a:hover,
  265. .edit-post-visual-editor .site-description a:visited {
  266. color: #999;
  267. }
  268. .edit-post-visual-editor .search-form .search-field {
  269. outline: none;
  270. }
  271. .edit-post-visual-editor .ast-search-menu-icon {
  272. position: relative;
  273. z-index: 3;
  274. }
  275. .edit-post-visual-editor .site .skip-link {
  276. background-color: #f1f1f1;
  277. box-shadow: 0 0 1px 1px rgba(0, 0, 0, 0.2);
  278. color: #21759b;
  279. display: block;
  280. font-family: Montserrat, "Helvetica Neue", sans-serif;
  281. font-size: 14px;
  282. font-weight: 700;
  283. left: -9999em;
  284. outline: none;
  285. padding: 15px 23px 14px;
  286. text-decoration: none;
  287. text-transform: none;
  288. top: -9999em;
  289. }
  290. .edit-post-visual-editor .site .skip-link:focus {
  291. clip: auto;
  292. height: auto;
  293. left: 6px;
  294. top: 7px;
  295. width: auto;
  296. z-index: 100000;
  297. outline: thin dotted;
  298. }
  299. .logged-in .edit-post-visual-editor .site .skip-link {
  300. box-shadow: 0 0 2px 2px rgba(0, 0, 0, 0.2);
  301. font-family: "Open Sans", sans-serif;
  302. }
  303. .edit-post-visual-editor h1, .edit-post-visual-editor h2, .edit-post-visual-editor h3, .edit-post-visual-editor h4, .edit-post-visual-editor h5, .edit-post-visual-editor h6 {
  304. clear: both;
  305. }
  306. .edit-post-visual-editor h1,
  307. .edit-post-visual-editor .entry-content h1 {
  308. color: #808285;
  309. font-size: 2em;
  310. line-height: 1.2;
  311. }
  312. .edit-post-visual-editor h2,
  313. .edit-post-visual-editor .entry-content h2 {
  314. color: #808285;
  315. font-size: 1.7em;
  316. line-height: 1.3;
  317. }
  318. .edit-post-visual-editor h3,
  319. .edit-post-visual-editor .entry-content h3 {
  320. color: #808285;
  321. font-size: 1.5em;
  322. line-height: 1.4;
  323. }
  324. .edit-post-visual-editor h4,
  325. .edit-post-visual-editor .entry-content h4 {
  326. color: #808285;
  327. line-height: 1.5;
  328. font-size: 1.3em;
  329. }
  330. .edit-post-visual-editor h5,
  331. .edit-post-visual-editor .entry-content h5 {
  332. color: #808285;
  333. line-height: 1.6;
  334. font-size: 1.2em;
  335. }
  336. .edit-post-visual-editor h6,
  337. .edit-post-visual-editor .entry-content h6 {
  338. color: #808285;
  339. line-height: 1.7;
  340. font-size: 1.1em;
  341. }
  342. .edit-post-visual-editor .wp-block-heading h1 {
  343. line-height: 1.2;
  344. }
  345. .edit-post-visual-editor .wp-block-heading h2 {
  346. line-height: 1.3;
  347. }
  348. .edit-post-visual-editor .wp-block-heading h3 {
  349. line-height: 1.4;
  350. }
  351. .edit-post-visual-editor .wp-block-heading h4 {
  352. line-height: 1.5;
  353. }
  354. .edit-post-visual-editor .wp-block-heading h5 {
  355. line-height: 1.6;
  356. }
  357. .edit-post-visual-editor .wp-block-heading h6 {
  358. line-height: 1.7;
  359. }
  360. #editor .edit-post-visual-editor.responsive-enabled {
  361. background-color: #2f2f2f;
  362. }
  363. .editor-styles-wrapper .block-editor-block-list__block h1 {
  364. line-height: 1.2;
  365. }
  366. .editor-styles-wrapper .block-editor-block-list__block h2 {
  367. line-height: 1.3;
  368. }
  369. .editor-styles-wrapper .block-editor-block-list__block h3 {
  370. line-height: 1.4;
  371. }
  372. .editor-styles-wrapper .block-editor-block-list__block h4 {
  373. line-height: 1.5;
  374. }
  375. .editor-styles-wrapper .block-editor-block-list__block h5 {
  376. line-height: 1.6;
  377. }
  378. .editor-styles-wrapper .block-editor-block-list__block h6 {
  379. line-height: 1.7;
  380. }
  381. .edit-post-visual-editor p,
  382. .block-editor-block-list__block p,
  383. .editor-default-block-appender textarea.editor-default-block-appender__content {
  384. font-size: 15px;
  385. font-size: 1rem;
  386. }
  387. .editor-post-title__block .editor-post-title__input {
  388. font-size: 30px;
  389. font-size: 2rem;
  390. font-family: -apple-system, BlinkMacSystemFont, Segoe UI, Roboto, Oxygen-Sans, Ubuntu, Cantarell, Helvetica Neue, sans-serif;
  391. font-weight: normal;
  392. }
  393. @media (min-width: 600px) {
  394. .edit-post-visual-editor .block-editor-block-list__block {
  395. padding-left: 0;
  396. padding-right: 0;
  397. }
  398. }
  399. .edit-post-visual-editor .block-editor-block-list__block .editor-block-list__block-edit {
  400. margin-left: 0;
  401. margin-right: 0;
  402. }
  403. .edit-post-visual-editor .block-editor-block-list__block > .editor-block-mover {
  404. left: -50px;
  405. top: -5px;
  406. }
  407. @media (min-width: 600px) {
  408. .edit-post-visual-editor .block-editor-block-list__block.wp-block-quote {
  409. padding: 1.2em;
  410. }
  411. }
  412. .block-editor-block-list__block[data-align=full] {
  413. max-width: none;
  414. }
  415. @media (min-width: 600px) {
  416. .block-editor-block-list__block[data-align=full] .editor-block-list__block-edit {
  417. padding-left: 0;
  418. padding-right: 0;
  419. }
  420. }
  421. .block-editor-block-list__block[data-align=wide] {
  422. max-width: 1400px;
  423. }
  424. .editor-default-block-appender__content {
  425. margin-top: 32px;
  426. }
  427. .wp-block-latest-posts.is-grid {
  428. list-style: none;
  429. }
  430. .blocks-gallery-grid {
  431. margin: 0;
  432. }
  433. .wp-block-gallery {
  434. margin: 0;
  435. }
  436. .wp-block-gallery.is-cropped .blocks-gallery-item img {
  437. height: 100%;
  438. }
  439. .edit-post-visual-editor .blocks-gallery-grid {
  440. margin: 0;
  441. }
  442. .wp-block-latest-posts {
  443. margin-left: 0;
  444. }
  445. .wp-block-latest-posts li {
  446. list-style: none;
  447. }
  448. h1,
  449. h2,
  450. h3,
  451. h4,
  452. h5,
  453. h6 {
  454. font-weight: inherit;
  455. }
  456. .mce-widget i {
  457. font-style: normal;
  458. }
  459. #elementor-editor-button {
  460. background: #0073aa;
  461. border-color: #0073aa;
  462. color: #fff;
  463. font-size: 14px;
  464. height: 46px;
  465. line-height: 44px;
  466. padding: 0 36px;
  467. display: inline-block;
  468. border-width: 1px;
  469. border-style: solid;
  470. -webkit-appearance: none;
  471. border-radius: 3px;
  472. white-space: nowrap;
  473. box-sizing: border-box;
  474. box-shadow: 0 2px 0 #006799;
  475. }
  476. #elementor-editor-button:hover, #elementor-editor-button:focus {
  477. background: #007db9;
  478. border-color: #00699b;
  479. color: #fff;
  480. }
  481. #elementor-editor-button:focus {
  482. box-shadow: 0 0 0 1px #fff, 0 0 0 3px #0073aa;
  483. }
  484. #elementor-editor-button:active {
  485. background: #006291;
  486. border-color: #006291;
  487. color: #fff;
  488. }
  489. #elementor-editor-button.active, #elementor-editor-button.active:focus, #elementor-editor-button.active:hover {
  490. background: #0073aa;
  491. color: #fff;
  492. border-color: #003f5e;
  493. box-shadow: inset 0 2px 5px -3px black;
  494. }
  495. #elementor-editor-button i {
  496. font-style: normal;
  497. color: white;
  498. }
  499. .editor-media-placeholder button,
  500. .fl-builder-layout-launch-view button {
  501. margin: 2px;
  502. }
  503. .fl-builder-layout-launch-view .is-primary.is-primary {
  504. color: white;
  505. }
  506. .ast-separate-container #wpwrap .edit-post-visual-editor {
  507. background-color: #f5f5f5;
  508. }
  509. /**
  510. * Woocommerce Gutenberg Blocks Product Grid CSS Compatibility.
  511. */
  512. .wc-block-grid .wc-block-grid__products .wc-block-grid__product {
  513. text-align: left;
  514. margin-bottom: 2.5em;
  515. }
  516. .wc-block-grid .wc-block-grid__products .wc-block-grid__product.product-category > a {
  517. display: inline-block;
  518. position: relative;
  519. }
  520. .wc-block-grid .wc-block-grid__products .wc-block-grid__product a img {
  521. width: 100%;
  522. height: auto;
  523. display: block;
  524. margin: 0 0 .8em 0;
  525. box-shadow: none;
  526. }
  527. .wc-block-grid .wc-block-grid__products .wc-block-grid__product .wc-block-grid__product-title {
  528. margin-bottom: .5em;
  529. padding: 0;
  530. font-size: 1em;
  531. line-height: 1.2;
  532. font-weight: inherit;
  533. }
  534. .wc-block-grid .wc-block-grid__products .wc-block-grid__product .star-rating {
  535. margin: 0 auto .5em 0;
  536. backface-visibility: hidden;
  537. }
  538. .wc-block-grid .wc-block-grid__products .wc-block-grid__product .woocommerce-loop-product__link {
  539. position: relative;
  540. display: block;
  541. }
  542. .wc-block-grid .wc-block-grid__products .wc-block-grid__product .woocommerce-loop-product__link:hover .ast-shop-product-out-of-stock {
  543. background-color: white;
  544. }
  545. .wc-block-grid .wc-block-grid__products .wc-block-grid__product.product-category > a:hover .woocommerce-loop-category__title {
  546. background-color: white;
  547. }
  548. .wc-block-grid .wc-block-grid__products .wc-block-grid__product .woocommerce-loop-category__title {
  549. bottom: 1.8em;
  550. font-size: 0.9em;
  551. }
  552. .wc-block-grid .wc-block-grid__products .wc-block-grid__product .woocommerce-loop-category__title .count {
  553. font-size: .7em;
  554. }
  555. .wc-block-grid .wc-block-grid__products .wc-block-grid__product .price {
  556. line-height: 1.3;
  557. margin-bottom: 0;
  558. font-weight: 700;
  559. margin-bottom: .5em;
  560. font-size: .9em;
  561. }
  562. .wc-block-grid .wc-block-grid__products .wc-block-grid__product .price del {
  563. display: initial;
  564. }
  565. .wc-block-grid .wc-block-grid__products .wc-block-grid__product .wp-block-button__link {
  566. margin-top: .5em;
  567. margin-bottom: .5em;
  568. white-space: normal;
  569. line-height: 1.3;
  570. font-size: 100%;
  571. font-weight: 700;
  572. }
  573. .wc-block-grid .wc-block-grid__products .wc-block-grid__product .wp-block-button__link.added {
  574. margin-bottom: 0;
  575. transition: margin 0s;
  576. }
  577. .wc-block-grid .wc-block-grid__products .wc-block-grid__product .woocommerce-loop-category__title {
  578. text-transform: uppercase;
  579. font-weight: bold;
  580. line-height: 1.5;
  581. }
  582. .wc-block-grid .wc-block-grid__products .wc-block-grid__product .woocommerce-loop-category__title .count {
  583. display: block;
  584. background: none;
  585. opacity: .5;
  586. font-size: .75em;
  587. }
  588. .wc-block-grid .wc-block-grid__products .wc-block-grid__product .wc-block-grid__product-onsale {
  589. min-width: 3em;
  590. min-height: 3em;
  591. line-height: 3em;
  592. padding: 0;
  593. font-size: 1em;
  594. font-weight: normal;
  595. text-transform: capitalize;
  596. position: absolute;
  597. text-align: center;
  598. border-radius: 100%;
  599. z-index: 9;
  600. top: 0;
  601. right: 15px;
  602. left: auto;
  603. margin: -0.5em -0.5em 0 0;
  604. }
  605. .edit-post-visual-editor__post-title-wrapper {
  606. position: relative;
  607. max-width: var(--wp--custom--ast-content-width-size);
  608. margin-left: auto !important;
  609. margin-right: auto !important;
  610. margin-bottom: 1.5em;
  611. }
  612. .edit-post-visual-editor__post-title-wrapper:hover h1.editor-post-title__input {
  613. box-shadow: 0 0 0 1px var(--wp-admin-theme-color);
  614. }
  615. .edit-post-visual-editor__post-title-wrapper:hover .title-visibility {
  616. opacity: 1;
  617. }
  618. .edit-post-visual-editor__post-title-wrapper.invisible {
  619. opacity: 0.5;
  620. }
  621. .edit-post-visual-editor__post-title-wrapper .title-visibility {
  622. cursor: pointer;
  623. font-size: 18px;
  624. width: 36px;
  625. height: 100%;
  626. text-align: center;
  627. color: var(--wp-admin-theme-color);
  628. vertical-align: middle;
  629. position: absolute;
  630. left: -37px;
  631. bottom: 0;
  632. opacity: 0;
  633. margin: 0 !important;
  634. padding: 0 !important;
  635. box-shadow: 0 0 0 1px var(--wp-admin-theme-color);
  636. transition: all 0.2s;
  637. }
  638. .edit-post-visual-editor__post-title-wrapper .title-visibility:hover {
  639. opacity: 1;
  640. color: var(--wp-admin-theme-color);
  641. }
  642. .edit-post-visual-editor__post-title-wrapper .title-visibility:hover:after {
  643. opacity: 1;
  644. visibility: visible;
  645. }
  646. .edit-post-visual-editor__post-title-wrapper .title-visibility:before {
  647. width: 100%;
  648. height: 100%;
  649. display: inline-flex;
  650. align-items: center;
  651. justify-content: center;
  652. }
  653. .edit-post-visual-editor__post-title-wrapper .title-visibility:after {
  654. content: attr(data-tooltip);
  655. white-space: nowrap;
  656. border-radius: 2px;
  657. pointer-events: none;
  658. color: #fff;
  659. background: #1e1e1e;
  660. opacity: 0;
  661. visibility: hidden;
  662. width: max-content;
  663. line-height: 26px;
  664. margin-left: -1px;
  665. display: flex;
  666. font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
  667. align-items: flex-start;
  668. padding: 0 6px;
  669. font-size: 12px;
  670. transition: all 0.2s;
  671. }
  672. .edit-post-visual-editor__post-title-wrapper h1.editor-post-title__input {
  673. padding: 10px 0;
  674. transition: all 0.2s;
  675. }
  676. .edit-post-visual-editor__post-title-wrapper h1.editor-post-title__input.is-selected {
  677. box-shadow: 0 0 0 1px var(--wp-admin-theme-color);
  678. }
  679. .edit-post-visual-editor__post-title-wrapper h1.editor-post-title__input.is-selected + .title-visibility {
  680. opacity: 1;
  681. color: var(--wp-admin-theme-color);
  682. }
  683. .ast-page-builder-template .edit-post-visual-editor__post-title-wrapper, .ast-stacked-title-visibility .edit-post-visual-editor__post-title-wrapper {
  684. max-width: none;
  685. padding: 0 20px;
  686. }
  687. .ast-page-builder-template .edit-post-visual-editor__post-title-wrapper .title-visibility, .ast-stacked-title-visibility .edit-post-visual-editor__post-title-wrapper .title-visibility {
  688. left: unset;
  689. top: -41px;
  690. height: 40px;
  691. }
  692. /**
  693. * Gutenberg editor improving UI/UX.
  694. */
  695. .edit-post-visual-editor ul.block-editor-block-list__block,
  696. .edit-post-visual-editor ol.block-editor-block-list__block {
  697. margin-left: 20px;
  698. }
  699. .block-editor-block-list__block.wp-block.wp-social-link {
  700. font-size: inherit;
  701. }
  702. .edit-post-visual-editor .block-editor-block-list__block.wp-social-link {
  703. padding: 0;
  704. }
  705. .wp-block ol, .wp-block ul {
  706. margin-left: 20px;
  707. margin-right: 20px;
  708. }
  709. .edit-post-visual-editor .wp-block.wp-block-shortcode {
  710. padding: 20px;
  711. }
  712. .wp-block-table td, .wp-block-table th {
  713. padding: 0.5em;
  714. border: 1px solid;
  715. word-break: normal;
  716. }
  717. .edit-post-visual-editor pre.wp-block, .edit-post-visual-editor .wp-block.wp-block-query-title {
  718. padding-left: 20px;
  719. }
  720. .block-editor-block-list__layout .block-editor-block-list__block.wp-block-button:not(:first-child) {
  721. padding-left: 0;
  722. padding-right: 0;
  723. }
  724. .block-editor-block-list__layout .wp-block-heading {
  725. margin-bottom: 20px;
  726. }
  727. .block-editor-block-list__empty-block-inserter .block-editor-inserter__toggle.components-button.has-icon {
  728. margin: 6px -2px 0 0;
  729. border-radius: 0;
  730. }
  731. .components-dropdown__content .components-popover__content {
  732. min-width: 290px;
  733. }
  734. .components-color-palette__custom-color-dropdown-content .components-popover__content {
  735. min-width: auto;
  736. }
  737. .wp-block-buttons > .wp-block.wp-block-button {
  738. padding-right: 0;
  739. }
  740. .wp-block .wp-block-categories__list {
  741. padding-left: 0;
  742. }
  743. .wp-block-latest-comments .wp-block-latest-comments {
  744. margin-left: 0;
  745. }
  746. .wp-block-quote.is-style-large cite {
  747. text-align: left;
  748. }
  749. .editor-styles-wrapper p {
  750. line-height: 1.85714285714286;
  751. }
  752. .wp-block-paragraph.has-background {
  753. padding: 1.25em 2.375em;
  754. }
  755. .ast-theme-block-color-name {
  756. mix-blend-mode: difference;
  757. }
  758. .components-color-palette__custom-color {
  759. text-align: left;
  760. padding-left: 5px;
  761. }