_editor.scss 4.0 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186
  1. .wp-block-a8c-blog-posts {
  2. &.image-aligntop {
  3. .post-thumbnail {
  4. margin-bottom: #{0.5 * map-deep-get($config-global, "spacing", "vertical")};
  5. }
  6. }
  7. &.image-alignleft {
  8. .post-thumbnail {
  9. margin-right: #{map-deep-get($config-global, "spacing", "vertical")};
  10. }
  11. }
  12. &.image-alignright {
  13. .post-thumbnail {
  14. margin-left: #{map-deep-get($config-global, "spacing", "vertical")};
  15. }
  16. }
  17. &.image-alignbehind .post-has-image {
  18. .entry-wrapper {
  19. padding: #{map-deep-get($config-global, "spacing", "vertical")};
  20. }
  21. .cat-links {
  22. color: #fff;
  23. }
  24. a:hover {
  25. color: currentcolor;
  26. }
  27. }
  28. .article-section-title {
  29. font-size: (strip-unit(map-deep-get($config-global, "font", "size", "base")) + 0);
  30. margin-top: 0;
  31. margin-bottom: #{0.5 * map-deep-get($config-global, "spacing", "vertical")};
  32. }
  33. article {
  34. margin-bottom: #{2 * map-deep-get($config-global, "spacing", "vertical")};
  35. @include media(mobile) {
  36. margin-bottom: #{3 * map-deep-get($config-global, "spacing", "vertical")};
  37. }
  38. }
  39. .post-thumbnail {
  40. img {
  41. vertical-align: middle;
  42. width: auto;
  43. }
  44. }
  45. .entry-wrapper > * {
  46. /* Vertical margins logic between post details */
  47. margin-top: #{map-deep-get($config-global, "spacing", "unit")};
  48. margin-bottom: #{map-deep-get($config-global, "spacing", "unit")};
  49. &:first-child {
  50. margin-top: 0;
  51. }
  52. &:last-child {
  53. margin-bottom: 0;
  54. }
  55. }
  56. .entry-title {
  57. a {
  58. color: #{map-deep-get($config-global, "color", "primary", "default")};
  59. .has-background:not(.has-background-background-color) &,
  60. [class*="background-color"]:not(.has-background-background-color) &,
  61. [style*="background-color"] & {
  62. color: currentcolor;
  63. }
  64. &:hover {
  65. color: #{map-deep-get($config-global, "color", "primary", "hover")};
  66. text-decoration: underline;
  67. }
  68. .has-background:not(.has-background-background-color) &,
  69. [class*="background-color"]:not(.has-background-background-color) &,
  70. [style*="background-color"] & {
  71. color: currentcolor;
  72. }
  73. }
  74. }
  75. .more-link {
  76. display: block;
  77. color: inherit;
  78. margin-top: #{map-deep-get($config-global, "spacing", "unit")};
  79. &::after {
  80. content: "\02192" #{"/*rtl:\"\02190\"*/"};
  81. display: inline-block;
  82. margin-left: 0.5em;
  83. }
  84. &:hover,
  85. &:active {
  86. color: #{map-deep-get($config-global, "color", "primary", "hover")};
  87. text-decoration: none;
  88. .has-background:not(.has-background-background-color) &,
  89. [class*="background-color"]:not(.has-background-background-color) &,
  90. [style*="background-color"] & {
  91. color: currentcolor;
  92. }
  93. }
  94. }
  95. .entry-meta,
  96. .cat-links {
  97. color: #{map-deep-get($config-global, "color", "foreground", "light")};
  98. font-size: (strip-unit(map-deep-get($config-global, "font", "size", "sm")) + 0);
  99. .has-background:not(.has-background-background-color) &,
  100. [class*="background-color"]:not(.has-background-background-color) &,
  101. [style*="background-color"] & {
  102. color: currentcolor;
  103. }
  104. .byline:not(:last-child) {
  105. margin-right: #{map-deep-get($config-global, "spacing", "unit")};
  106. }
  107. .published + .updated {
  108. display: none;
  109. }
  110. a {
  111. color: currentcolor;
  112. text-decoration: underline;
  113. &:hover,
  114. &:active {
  115. color: #{map-deep-get($config-global, "color", "primary", "hover")};
  116. text-decoration: none;
  117. .has-background:not(.has-background-background-color) &,
  118. [class*="background-color"]:not(.has-background-background-color) &,
  119. [style*="background-color"] & {
  120. color: currentcolor;
  121. }
  122. }
  123. }
  124. }
  125. }
  126. @import "../../base/extends";
  127. .wp-block-a8c-blog-posts + .button {
  128. // Extend button style
  129. @extend %button-style;
  130. display: inline-block;
  131. font-size: (strip-unit(map-deep-get($config-global, "font", "size", "md")) + 0);
  132. &:hover {
  133. cursor: default;
  134. }
  135. .has-background:not(.has-background-background-color) &,
  136. [class*="background-color"]:not(.has-background-background-color) &,
  137. [style*="background-color"] & {
  138. background-color: transparent;
  139. border: 2px solid currentcolor;
  140. color: currentcolor;
  141. }
  142. }
  143. .wpnbha article p > .more-link:not([rel]) {
  144. display: none;
  145. }