style.css 6.0 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239
  1. /*
  2. Theme Name: BSoJ
  3. Theme URI: https://wordpress.com/theme/bsoj
  4. Author: Automattic
  5. Author URI: https://automattic.com/
  6. Description: BSoJ (Blue Screen of Joy) is a blog theme inspired by the infamous Blue Screen of Death.
  7. Requires at least: 6.1
  8. Tested up to: 6.3
  9. Requires PHP: 5.7
  10. Version: 1.0.3
  11. License: GNU General Public License v2 or later
  12. License URI: http://www.gnu.org/licenses/gpl-2.0.html
  13. Template:
  14. Text Domain: bsoj
  15. Tags: blog, one-column, wide-blocks, block-patterns, featured-images, full-site-editing, rtl-language-support, threaded-comments, translation-ready
  16. */
  17. /*
  18. * Control the hover stylings of outline block style.
  19. * Unnecessary once block styles are configurable via theme.json
  20. * https://github.com/WordPress/gutenberg/issues/42794
  21. */
  22. .wp-block-button.is-style-outline>.wp-block-button__link:not(.has-background):hover {
  23. background-color: var(--wp--preset--color--primary);
  24. color: var(--wp--preset--color--base);
  25. border-color: var(--wp--preset--color--primary);
  26. }
  27. /*
  28. * Link styles
  29. * https://github.com/WordPress/gutenberg/issues/42319
  30. */
  31. a {
  32. text-decoration-thickness: 0.5px !important;
  33. text-underline-offset: 0.15em;
  34. }
  35. /*
  36. * Form field styles
  37. * https://github.com/WordPress/gutenberg/issues/42319
  38. */
  39. ::placeholder {
  40. color: var(--wp--preset--color--base);
  41. opacity: 1; /* Firefox */
  42. }
  43. /*
  44. * Avatar Block
  45. * Fix border radius setting for the avatar block
  46. */
  47. .wp-block-avatar a,
  48. .wp-block-avatar img {
  49. border-radius: inherit;
  50. vertical-align: middle;
  51. }
  52. /*
  53. * Calendar Block
  54. * Adjust colours in the Calendar
  55. */
  56. .wp-block-calendar table:where(:not(.has-text-color)) {
  57. color: var(--wp--preset--color--contrast);
  58. }
  59. .wp-block-calendar table:where(:not(.has-text-color)) td, .wp-block-calendar table:where(:not(.has-text-color)) th {
  60. border-color: var(--wp--preset--color--contrast);
  61. }
  62. :where(.wp-block-calendar table:not(.has-background) th) {
  63. background-color: var(--wp--preset--color--contrast);
  64. color: var(--wp--preset--color--base);
  65. }
  66. /*
  67. * Latest Comments & Latest Posts Blocks
  68. * Make them inherit the block setting
  69. */
  70. .wp-block-latest-comments__comment-excerpt p,
  71. .wp-block-latest-comments__comment-date,
  72. .wp-block-latest-posts__post-author,
  73. .wp-block-latest-posts__post-date {
  74. font-size: inherit;
  75. }
  76. /*
  77. * Navigation Block
  78. * Remove the top padding for submenu items
  79. */
  80. .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-container-content .wp-block-navigation__submenu-container {
  81. padding-top: 0;
  82. }
  83. /*
  84. * Post Author Block
  85. * Make them inherit the block setting
  86. */
  87. .wp-block-post-author__byline,
  88. .wp-block-post-author__bio {
  89. font-size: inherit;
  90. }
  91. /* Round the avatar and reset the vertical alignment */
  92. .wp-block-post-author__avatar img {
  93. border-radius: 999px;
  94. vertical-align: middle;
  95. }
  96. /* Remove the default margin from author bio */
  97. .wp-block-post-author__bio {
  98. margin: var(--wp--preset--spacing--50) 0 0;
  99. }
  100. /*
  101. * Post Comments Form
  102. * Reset browser default margins for blockquote element
  103. */
  104. .wp-block-post-comments-form .comment-reply-title {
  105. font-size: var(--wp--preset--font-size--large);
  106. }
  107. /* Remove the bottom margin from the submit button in the post comments form */
  108. .wp-block-post-comments-form .form-submit {
  109. margin-bottom: 0;
  110. }
  111. /* Make the fields inherit the line height */
  112. .wp-block-post-comments-form .comment-form input:not([type=submit]):not([type=checkbox]),
  113. .wp-block-post-comments-form .comment-form textarea {
  114. line-height: inherit;
  115. }
  116. /*
  117. * Pull quote Block
  118. * Reset browser default margins for blockquote element
  119. */
  120. .wp-block-pullquote blockquote {
  121. margin: 0;
  122. }
  123. /*
  124. * Search Block
  125. * Button inside style adjustment
  126. */
  127. .wp-block-search__button-inside .wp-block-search__inside-wrapper {
  128. padding: 2px;
  129. }
  130. :where(.wp-block-search__button-inside .wp-block-search__inside-wrapper) {
  131. background-color:var(--wp--preset--color--primary);
  132. border-color: var(--wp--preset--color--primary);
  133. }
  134. :where(.wp-block-search__button-inside .wp-block-search__inside-wrapper) .wp-block-search__input {
  135. padding: 0 0 0 var(--wp--preset--spacing--40);
  136. }
  137. :where(.wp-block-search__button-inside .wp-block-search__inside-wrapper) .wp-element-button {
  138. padding-right: 12px;
  139. }
  140. :where(.wp-block-search__button-inside .wp-block-search__inside-wrapper) .wp-element-button:hover,
  141. :where(.wp-block-search__button-inside .wp-block-search__inside-wrapper) .wp-element-button:focus {
  142. background-color: var(--wp--preset--color--primary);
  143. }
  144. /*
  145. * Tag Cloud Block
  146. * Style tag cloud outline style
  147. */
  148. .wp-block-tag-cloud.is-style-outline a {
  149. border-radius: 999px;
  150. padding: var(--wp--preset--spacing--20) var(--wp--preset--spacing--40);
  151. }
  152. /*
  153. * Term Description Block
  154. * Remove the default margins
  155. */
  156. .wp-block-term-description p:first-child {
  157. margin-top: 0;
  158. }
  159. .wp-block-term-description p:last-child {
  160. margin-bottom: 0;
  161. }
  162. /*
  163. * Jetpack Contact Form Block
  164. * Match the padding to the Gutenberg default
  165. */
  166. .contact-form input[type=text],
  167. .contact-form input[type=email],
  168. .contact-form input[type=tel],
  169. .contact-form input[type=url],
  170. .contact-form textarea {
  171. padding: calc(0.667em + 2px);
  172. }
  173. /* Label is 400 in this theme */
  174. div[id^="contact-form-"] .contact-form label {
  175. font-weight: 400;
  176. }
  177. /* Match the submission result to the theme style */
  178. div[id^="contact-form-"] .contact-form-submission {
  179. border-color: var(--wp--preset--color--primary);
  180. margin: 0;
  181. padding: 0;
  182. }
  183. /* Match the color of the link to the theme style */
  184. div[id^="contact-form-"] .contact-form-submission .go-back-message .link {
  185. color: var(--wp--preset--color--primary);
  186. font-weight: inherit;
  187. }
  188. /* Match the submission result title to the theme style */
  189. div[id^="contact-form-"] h4 {
  190. font-size: var(--wp--preset--font-size--medium);
  191. font-weight: inherit;
  192. }
  193. /*
  194. * Jetpack Mailchimp Block
  195. * Match the font size and line height
  196. * Match the padding to the Gutenberg default
  197. */
  198. .wp-block-jetpack-mailchimp input:not([type="submit"]):not([type="checkbox"]) {
  199. border-width: 1px;
  200. font-size: inherit;
  201. line-height: inherit;
  202. padding: calc(0.667em + 2px);
  203. }
  204. .wp-block-jetpack-mailchimp .wp-block-jetpack-button,
  205. .wp-block-jetpack-mailchimp p {
  206. margin-top: var(--wp--preset--spacing--50);
  207. margin-bottom: 0;
  208. }