buttons.css

Same filename in other branches
  1. 9 core/profiles/demo_umami/themes/umami/css/components/forms/buttons.css
  2. 9 core/themes/seven/css/components/buttons.css
  3. 9 core/themes/bartik/css/components/buttons.css
  4. 8.9.x core/profiles/demo_umami/themes/umami/css/components/forms/buttons.css
  5. 8.9.x core/themes/seven/css/components/buttons.css
  6. 8.9.x core/themes/bartik/css/components/buttons.css
  7. 11.x core/profiles/demo_umami/themes/umami/css/components/forms/buttons.css

This file is used to style form buttons generically, with overrides per form

File

core/profiles/demo_umami/themes/umami/css/components/forms/buttons.css

View source
  1. /**
  2. * @file
  3. * This file is used to style form buttons generically, with overrides per form
  4. */
  5. .button {
  6. display: inline-block;
  7. min-width: inherit;
  8. max-width: inherit;
  9. margin: 0;
  10. padding: 0.7rem 1.3rem;
  11. cursor: pointer;
  12. transition: background-color 0.5s ease;
  13. text-align: center;
  14. text-decoration: none;
  15. color: #fff;
  16. border: 2px solid #008068;
  17. border-radius: 3px;
  18. background-color: #008068;
  19. font-family: "Scope One", Georgia, serif;
  20. font-size: 1.2rem;
  21. }
  22. .button:hover,
  23. .button:active,
  24. .button:focus {
  25. transition: background-color 0.5s ease;
  26. text-decoration: none;
  27. color: #000;
  28. background-color: #e6eee0;
  29. }
  30. .button--primary {
  31. border-color: #d93760;
  32. background-color: #d93760;
  33. }
  34. .button--primary:hover,
  35. .button--primary:active,
  36. .button--primary:focus {
  37. outline-color: #fff;
  38. outline-offset: 2px;
  39. background-color: #fcece7;
  40. }
  41. .button[disabled]:hover,
  42. .button[disabled]:active,
  43. .button[disabled]:focus,
  44. .button[disabled] {
  45. cursor: default;
  46. color: #464646;
  47. background: #767775;
  48. }
  49. .form-actions {
  50. display: flex;
  51. flex-wrap: wrap;
  52. margin: -0.5rem;
  53. padding: 0.75rem 0;
  54. }
  55. @media screen and (min-width: 77em) {
  56. .form-actions {
  57. margin: 1rem -0.5rem;
  58. padding: 0;
  59. }
  60. }
  61. .form-actions > .button,
  62. .form-actions > .form-wrapper {
  63. margin: 0.5rem;
  64. line-height: normal;
  65. }

Buggy or inaccurate documentation? Please file an issue. Need support? Need help programming? Connect with the Drupal community.