diff --git a/src/components/FooterMenu/FooterMenu.module.scss b/src/components/FooterMenu/FooterMenu.module.scss index 9facceb..46438f4 100644 --- a/src/components/FooterMenu/FooterMenu.module.scss +++ b/src/components/FooterMenu/FooterMenu.module.scss @@ -18,22 +18,23 @@ } &__top { - - &__title, - &__item, - &__item-title { - color: variables.$black-300; - margin-bottom: 12px; - } - &__title-wrapper { @media (max-width: 1024px) { display: flex; justify-content: space-between; } } + + &__title, + &__item, + &__item-title, + &__title-active { + color: variables.$black-300; + margin-bottom: 12px; + } - &__title { + &__title, + &__title-active { font-weight: 500; font-size: 14px; line-height: 16px; @@ -41,10 +42,6 @@ @media (max-width: 1024px) { cursor: pointer; - - &:hover { - filter: contrast(60%); - } } @media (min-width: 2500px) { @@ -53,15 +50,23 @@ } } + &__title { + @media (max-width: 1024px) { + &:hover { + filter: contrast(60%); + } + } + } + + &__title-active { + text-decoration-line: underline; + } + &__plus-sign { font-weight: 500; color: variables.$black-300; cursor: pointer; - &:hover { - filter: contrast(60%); - } - @media (min-width: 1025px) { display: none; } @@ -100,7 +105,7 @@ &__item { &:hover { - filter:contrast(60%); + text-decoration-line: underline; } } diff --git a/src/components/FooterMenu/FooterMenu.tsx b/src/components/FooterMenu/FooterMenu.tsx index 1bbb5c5..74133cd 100644 --- a/src/components/FooterMenu/FooterMenu.tsx +++ b/src/components/FooterMenu/FooterMenu.tsx @@ -16,7 +16,10 @@ const FooterMenu = () => {