diff --git a/packages/commercetools/theme/package.json b/packages/commercetools/theme/package.json index fe27b097e..65687a5de 100644 --- a/packages/commercetools/theme/package.json +++ b/packages/commercetools/theme/package.json @@ -13,7 +13,7 @@ "test": "jest" }, "dependencies": { - "@storefront-ui/vue": "^0.6.4", + "@storefront-ui/vue": "^0.7.4", "@vue-storefront/commercetools": "^0.0.3", "@vue-storefront/commercetools-api": "^0.0.3", "@vue-storefront/nuxt": "^0.0.3", diff --git a/packages/core/theme-module/theme/assets/css/reset.scss b/packages/core/theme-module/theme/assets/css/reset.scss index 659c6b47b..c09f0c9c7 100644 --- a/packages/core/theme-module/theme/assets/css/reset.scss +++ b/packages/core/theme-module/theme/assets/css/reset.scss @@ -1,9 +1,13 @@ // Reset CSS +html { + width: auto; + overflow-x: hidden; +} body { + overflow-x: hidden; color: var(--c-text); - font-size: var(--font-size-regular); - font-family: var(--body-font-family-primary); - font-weight: var(--body-font-weight-primary); + font-size: var(--font-base); + font-family: var(--font-family-primary); margin: 0; padding: 0; } @@ -15,30 +19,26 @@ a { } } h1 { - font-family: var(--body-font-family-secondary); + font-family: var(--font-family-secondary); font-size: var(--h1-font-size); - font-weight: var(--h1-font-weight); line-height: 1.6; margin: 0; } h2 { - font-family: var(--body-font-family-secondary); + font-family: var(--font-family-secondary); font-size: var(--h2-font-size); - font-weight: var(--h2-font-weight); line-height: 1.6; margin: 0; } h3 { - font-family: var(--body-font-family-secondary); + font-family: var(--font-family-secondary); font-size: var(--h3-font-size); - font-weight: var(--h3-font-weight); line-height: 1.6; margin: 0; } h4 { - font-family: var(--body-font-family-secondary); + font-family: var(--font-family-secondary); font-size: var(--h4-font-size); - font-weight: var(--h4-font-weight); line-height: 1.6; margin: 0; } diff --git a/packages/core/theme-module/theme/components/AppFooter.vue b/packages/core/theme-module/theme/components/AppFooter.vue index c4fcfd929..8b7755a57 100644 --- a/packages/core/theme-module/theme/components/AppFooter.vue +++ b/packages/core/theme-module/theme/components/AppFooter.vue @@ -7,7 +7,6 @@ :key="item" > @@ -20,7 +19,6 @@ :key="item" > @@ -33,7 +31,6 @@ :key="item" > @@ -46,15 +43,14 @@ :key="item" > - -
- + + @@ -80,29 +76,6 @@ export default { isMobile: false, desktopMin: 1024 }; - }, - computed: { - style() { - return this.isMobile ? { padding: '20px 40px' } : { padding: '6px 0' }; - } - }, - methods: { - isMobileHandler(e) { - this.isMobile = e.matches; - } - }, - mounted() { - this.isMobile = - Math.max(document.documentElement.clientWidth, window.innerWidth) < - this.desktopMin; - window - .matchMedia('(max-width: 1024px)') - .addListener(this.isMobileHandler); - }, - beforeDestroy() { - window - .matchMedia('(max-width: 1024px)') - .removeListener(this.isMobileHandler); } }; @@ -115,10 +88,17 @@ export default { @content; } } -#footer { - /* temporary */ - @include for-desktop { - padding: 0 2.5rem; + +.footer { + &__socials { + padding: var(--spacer-base) var(--spacer-xl); + + @media screen and (min-width: $desktop-min) { + padding: var(--spacer-sm) 0; + } + } + &__social-image { + margin: 0 var(--spacer-base) 0 0; } } diff --git a/packages/core/theme-module/theme/components/AppHeader.vue b/packages/core/theme-module/theme/components/AppHeader.vue index 380cb0680..6bef1370c 100644 --- a/packages/core/theme-module/theme/components/AppHeader.vue +++ b/packages/core/theme-module/theme/components/AppHeader.vue @@ -5,6 +5,7 @@ @click:account="onAccountClicked" :cartItemsQty="cartTotalItems" > +