diff --git a/src/components/paragraph-text/paragraph-text.scss b/src/components/paragraph-text/paragraph-text.scss index 4578320a476fe1263ab1fb796cd09afd27dcb6bc..5dd7d367a135cf7213df9d9335903a7327d2a80a 100644 --- a/src/components/paragraph-text/paragraph-text.scss +++ b/src/components/paragraph-text/paragraph-text.scss @@ -7,8 +7,8 @@ // General styles for text paragraph .hy-paragraph-text { - @include font-size(14px, 20px); // Paragraph Small size - color: var(--grayscale-dark); + @include font-size(15px, 22px); // Paragraph Small size + color: var(--grayscale-dark-text); font-family: var(--main-font-family); letter-spacing: 0; width: 100%; @@ -20,11 +20,13 @@ width: 91.46%; // 11 col } @include breakpoint($xlarge) { + @include font-size(17px, 26px); // Paragraph Large size width: 82.89%; // 10 col } &__large { @include breakpoint($extrawide) { + @include font-size(17px, 26px); // Paragraph Large size width: 82.89%; // 10 col } @include breakpoint($xlarge) { diff --git a/src/global/_colors.scss b/src/global/_colors.scss index e3fd88fe8091d9bc7c36d3bad7150ae176c9fd0c..f221b8613df870dadf4331a2542aa269a700263f 100644 --- a/src/global/_colors.scss +++ b/src/global/_colors.scss @@ -15,6 +15,7 @@ --grayscale-background-arrow: #dfdfdf; --grayscale-medium-dark: #979797; --grayscale-dark: #555555; + --grayscale-dark-text: #222222; --grayscale-black: #000000; --additional-red-light: #e5053a; --additional-red-dark: #a31621;