diff --git a/assets/css/_device.scss b/assets/css/_device.scss index d4d0d79..6753b80 100644 --- a/assets/css/_device.scss +++ b/assets/css/_device.scss @@ -3,7 +3,7 @@ $breakpoint-mobile: 840px; $breakpoint-tablet: 1200px; @mixin mobile { - @media(max-width: #{$breakpoint-mobile}) { + @media (min-width: 0px) and (max-width: #{$breakpoint-mobile}) { @content; } } diff --git a/components/footer.vue b/components/footer.vue index fed09d6..37535fe 100644 --- a/components/footer.vue +++ b/components/footer.vue @@ -111,10 +111,7 @@ footer { padding-left: 64px; width: 1200px; margin: auto auto 32px auto; - .copyrights { - margin-left: auto; - margin-right: 64px; - } + .sns { display: flex; img { @@ -126,6 +123,17 @@ footer { margin-right: 32px; } } + .copyrights { + margin-left: auto; + padding-right: 64px; + + font-style: normal; + font-weight: normal; + font-size: 16px; + line-height: 24px; + text-align: center; + letter-spacing: -0.02em; + } } } diff --git a/nuxt.config.ts b/nuxt.config.ts index 45a5dea..616e26a 100644 --- a/nuxt.config.ts +++ b/nuxt.config.ts @@ -2,6 +2,9 @@ import type { NuxtConfig } from "@nuxt/types"; const config: NuxtConfig = { target: "static", + head:{ + meta:[{charset: 'utf-8'}, {name: 'viewport', content: 'width=device-width, initial-scale=1'}] + }, modules: ["@nuxt/content"], components: true, content: { @@ -13,7 +16,7 @@ const config: NuxtConfig = { }, }, buildModules: ["@nuxt/typescript-build"], - plugins: ["~/plugins/composition-api", "~/plugins/vue-mq"], + plugins: ["~/plugins/composition-api"], css:["~/assets/css/reset.css", "~/assets/css/webfont.css", "~/assets/css/_device.scss"], // image:{ // facebook: "~/assets/img/facebook.png", diff --git a/pages/index.vue b/pages/index.vue index 666f25a..d6c610d 100644 --- a/pages/index.vue +++ b/pages/index.vue @@ -32,26 +32,7 @@ export default defineComponent({ color: #ffffff; display: flex; margin: auto; - .quick-link { - display: flex; - flex-direction: row; - align-content: center; - padding-top: 40px; - font-style: normal; - font-weight: bold; - font-size: 16px; - line-height: 24px; - letter-spacing: -0.02em; - - cursor: pointer; - - img { - width: 16px; - height: 16px; - margin: auto 0 auto 8px; - } - } @include mobile { .slogan { width: 327px; @@ -71,6 +52,26 @@ export default defineComponent({ line-height: 24px; letter-spacing: -0.02em; } + .quick-link { + display: flex; + flex-direction: row; + align-content: center; + padding-top: 40px; + + font-style: normal; + font-weight: bold; + font-size: 16px; + line-height: 24px; + letter-spacing: -0.02em; + + cursor: pointer; + + img { + width: 16px; + height: 16px; + margin: auto 0 auto 8px; + } + } } } @include tablet { @@ -92,6 +93,26 @@ export default defineComponent({ line-height: 24px; letter-spacing: -0.02em; } + .quick-link { + display: flex; + flex-direction: row; + align-content: center; + padding-top: 40px; + + font-style: normal; + font-weight: bold; + font-size: 16px; + line-height: 24px; + letter-spacing: -0.02em; + + cursor: pointer; + + img { + width: 16px; + height: 16px; + margin: auto 0 auto 8px; + } + } } } @include desktop { @@ -114,6 +135,26 @@ export default defineComponent({ line-height: 36px; letter-spacing: -0.02em; } + .quick-link { + display: flex; + flex-direction: row; + align-content: center; + padding-top: 86px; + + font-style: normal; + font-weight: bold; + font-size: 24px; + line-height: 24px; + letter-spacing: -0.02em; + + cursor: pointer; + + img { + width: 24px; + height: 24px; + margin: auto 0 auto 8px; + } + } } } }