diff --git a/src/components/AppBar/AppBar.scss b/src/components/AppBar/AppBar.scss
index 71f47b1..726e92f 100644
--- a/src/components/AppBar/AppBar.scss
+++ b/src/components/AppBar/AppBar.scss
@@ -13,6 +13,10 @@
.app-bar__container {
padding: to-rem(26) 0;
+
+ @include respond-to(large) {
+ padding: to-rem(20) 0;
+ }
}
.app-bar__content {
@@ -53,11 +57,13 @@
padding: to-rem(6) to-rem(12);
}
&:hover{
- color: var(--col-green-hover) ;
+ color: var(--col-total-white);
+ background: var(--col-green-hover) ;
border: 1px solid var(--col-green-hover);
}
&:active{
- color: var(--col-green-press);
+ color: var(--col-total-white);
+ background: var(--col-green-press);
border: 1px solid var(--col-green-hover);
}
}
@@ -88,6 +94,12 @@
.app-bar__logo-img{
height: to-rem(48);
width: to-rem(182);
+
+ @include respond-to(large) {
+ height: to-rem(40);
+ width: to-rem(150);
+ }
+
@include respond-to(medium) {
height: to-rem(36);
width: to-rem(36);
@@ -103,6 +115,18 @@
.app-bar__light {
background-color: var(--col-total-white);
border-bottom: 1px solid rgba(var(--col-primary-black-rgb), 0.1);
+
+ .app-bar__button {
+ border: none;
+
+ &:hover{
+ color: var(--col-green-hover) ;
+ }
+ &:active{
+ color: var(--col-green-press);
+ }
+ }
+
}
.app-bar__dark{
diff --git a/src/components/HomeHeroInstallSection/HomeHeroInstallSection.jsx b/src/components/HomeHeroInstallSection/HomeHeroInstallSection.jsx
index 34387d4..03d2df9 100644
--- a/src/components/HomeHeroInstallSection/HomeHeroInstallSection.jsx
+++ b/src/components/HomeHeroInstallSection/HomeHeroInstallSection.jsx
@@ -75,7 +75,9 @@ const HomeHeroInstallSection = () => {
{t('home-hero-section.btn-cancel')}