style.css 3.4 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106
  1. /*
  2. Theme Name: Rainfall
  3. Theme URI: https://wordpress.com/theme/rainfall
  4. Author: Automattic
  5. Author URI: https://automattic.com
  6. Description: Rainfall is a clean, objective blogging theme strongly inspired by Swiss Design. Its minimalist functionality is balanced by a strong accent color, beautiful photography and post templates with sidebars.
  7. Requires at least: 6.0
  8. Tested up to: 6.0
  9. Requires PHP: 5.7
  10. Version: 0.0.12
  11. License: GNU General Public License v2 or later
  12. License URI: http://www.gnu.org/licenses/gpl-2.0.html
  13. Text Domain: rainfall
  14. Tags: two-columns, custom-colors, custom-menu, custom-logo, editor-style, featured-images, full-site-editing, block-patterns, rtl-language-support, theme-options, threaded-comments, translation-ready, auto-loading-homepage, blog-homepage
  15. */
  16. /**
  17. * Post title indent
  18. */
  19. .indented-post-title {
  20. margin-left: 1ch;
  21. text-indent: -1ch;
  22. }
  23. /**
  24. * Comment form elements
  25. */
  26. .wp-block-post-comments-form input:not([type=submit],[type=checkbox]),
  27. .wp-block-post-comments-form textarea,
  28. .wp-block-post-comments-form select {
  29. background-color: var(--wp--preset--color--black);
  30. color: var(--wp--preset--color--black);
  31. border: 1px solid var(--wp--preset--color--white);
  32. }
  33. /**
  34. * Navigation on dark background
  35. */
  36. .has-orange-background-color .has-black-background-color .wp-block-navigation-item a:where(:not(.wp-element-button)):active {
  37. color: var(--wp--preset--color--brown);
  38. }
  39. .has-black-background-color .wp-block-navigation-item a:where(:not(.wp-element-button)):active {
  40. color: var(--wp--preset--color--orange);
  41. }
  42. /**
  43. * Search input on dark background
  44. */
  45. .has-black-background-color .wp-block-search__input {
  46. background-color: var(--wp--preset--color--black);
  47. border: 1px solid var(--wp--preset--color--white);
  48. }
  49. /*
  50. * Button styles on dark background
  51. */
  52. .has-black-background-color .wp-block-file .wp-block-file__button,
  53. .has-black-background-color .wp-block-button__link {
  54. background-color: var(--wp--preset--color--white);
  55. color: var(--wp--preset--color--black);
  56. }
  57. .has-black-background-color .wp-block-file .wp-block-file__button:hover,
  58. .has-black-background-color .wp-block-button__link:hover,
  59. .has-black-background-color .wp-block-file .wp-block-file__button:focus,
  60. .has-black-background-color .wp-block-button__link:focus {
  61. background-color: var(--wp--preset--color--dark-grey);
  62. color: var(--wp--preset--color--white);
  63. }
  64. .has-black-background-color .wp-block-file .wp-block-file__button:active,
  65. .has-black-background-color .wp-block-button__link:active {
  66. background-color: var(--wp--preset--color--light-grey);
  67. color: var(--wp--preset--color--black);
  68. }
  69. /* Footer Navigation */
  70. footer .wp-block-navigation__container {
  71. row-gap: 1rem;
  72. }
  73. /** Navigation Current Menu Item
  74. * Needed until this is addressed: https://github.com/WordPress/gutenberg/issues/42299
  75. */
  76. .wp-block-navigation-item.current-menu-item > a {
  77. font-weight: 700;
  78. }
  79. /** Navigation Overlay
  80. * Needed until this is addressed: https://github.com/WordPress/gutenberg/issues/39142
  81. */
  82. .wp-block-navigation__responsive-container.is-menu-open ul {
  83. font-size: var(--wp--preset--font-size--x-large) !important;
  84. gap: 0 !important;
  85. }
  86. .wp-block-navigation__responsive-container.is-menu-open .has-child .wp-block-navigation__submenu-container {
  87. padding-top: 0;
  88. }
  89. .wp-block-navigation__responsive-container.has-white-color.has-black-background-color.is-menu-open a:active {
  90. color: var(--wp--preset--color--orange);
  91. }