quote.less 2.1 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970717273747576777879808182838485868788899091929394959697
  1. blockquote.quote-large-text-centered {
  2. text-align: center;
  3. font-size: var(
  4. --font-size-07
  5. ) !important; //override .website-redesign blockquote
  6. font-weight: 600 !important; //override .website-redesign blockquote
  7. line-height: var(
  8. --line-height-06
  9. ) !important; //override .website-redesign blockquote
  10. // customize open/close quote placement.
  11. // Otherwise, close is after footer and before is above quote
  12. &:before,
  13. &:after {
  14. content: none;
  15. }
  16. .quote {
  17. margin-bottom: var(--spacing-08);
  18. &:before {
  19. content: open-quote;
  20. }
  21. &:after {
  22. content: close-quote;
  23. }
  24. }
  25. .quote-img {
  26. img {
  27. border-radius: 50%;
  28. height: 64px;
  29. max-width: 64px;
  30. }
  31. }
  32. footer {
  33. color: inherit;
  34. font-size: var(--font-size-body-base);
  35. font-weight: 400;
  36. line-height: var(--line-height-03);
  37. padding: var(--spacing-04) 0 0 0;
  38. &:before {
  39. content: none; //override type.less
  40. }
  41. .quote-link {
  42. text-align: center;
  43. margin-top: var(--spacing-05);
  44. }
  45. }
  46. @media (max-width: @screen-sm-max) {
  47. font-size: var(--font-size-04) !important;
  48. line-height: var(--line-height-04) !important;
  49. footer {
  50. font-size: var(--font-size-02) !important;
  51. line-height: var(--line-height-02) !important;
  52. }
  53. }
  54. }
  55. blockquote.quote-left-green-border {
  56. border-left: 2px solid var(--green-60) !important;
  57. text-align: left;
  58. font-size: var(--font-size-07) !important;
  59. line-height: var(--line-height-06) !important;
  60. color: var(--neutral-90);
  61. padding: var(--spacing-04) 0 var(--spacing-04) var(--spacing-06) !important;
  62. // customize open/close quote placement.
  63. // Otherwise, close is after footer and before is above quote
  64. &:before,
  65. &:after {
  66. content: none;
  67. }
  68. .quote {
  69. &:before {
  70. content: open-quote;
  71. }
  72. &:after {
  73. content: close-quote;
  74. }
  75. }
  76. footer {
  77. .heading-xs();
  78. color: var(--neutral-70);
  79. font-weight: 400;
  80. margin: var(--spacing-09) 0 0 0;
  81. padding: 0;
  82. }
  83. .quote-link {
  84. margin-top: var(--spacing-05);
  85. }
  86. }