fix: storybook error

vuejs-jp · Jul 11, 2024 · 9d57ade · 9d57ade
1 parent 450337e
commit 9d57ade
Show file tree

Hide file tree

Showing 5 changed files with 18 additions and 9 deletions.
diff --git a/apps/web/app/components/StorePageSection.vue b/apps/web/app/components/StorePageSection.vue
@@ -144,8 +144,7 @@ section {
     inset: 0;
     width: 100%;
     height: 20%;
-    background-image: url('/main-visual.png');
-    background-size: 100% auto;
+    background: url(/common/bg_pageheading_pc.jpg) no-repeat right center/cover;
     z-index: -10;
     background-position: 50% 0;
     opacity: 0.4;
@@ -258,6 +257,7 @@ section {
   section {
     &::before {
       height: 10%;
+      background-image: url(/common/bg_pageheading_sp.jpg);
     }
   }
 

diff --git a/apps/web/app/pages/jobboard.vue b/apps/web/app/pages/jobboard.vue
@@ -24,13 +24,12 @@ useHead({
 <template>
   <VFPageHeading>{{ $t('jobboard.title') }}</VFPageHeading>
   <div class="jobboard">
-    <ul class='jobboard-body'>
+    <ul class="jobboard-body">
       <li v-for="i in 7">
-        <nuxt-link to="hoge" target="_blank"><img src='https://placehold.jp/f0f0f0/ffffff/920x520.png?text=%20' alt=''></nuxt-link>
+        <nuxt-link to="hoge" target="_blank"><img src="https://placehold.jp/f0f0f0/ffffff/920x520.png?text=%20" alt="" /></nuxt-link>
       </li>
     </ul>
   </div>
-
 </template>
 
 <style scoped>

diff --git a/packages/ui/assets/common/bg_pageheading_pc.jpg b/packages/ui/assets/common/bg_pageheading_pc.jpg
diff --git a/packages/ui/assets/common/bg_pageheading_sp.jpg b/packages/ui/assets/common/bg_pageheading_sp.jpg
diff --git a/packages/ui/components/common/PageHeading.vue b/packages/ui/components/common/PageHeading.vue
@@ -15,15 +15,19 @@ const { color } = useColor()
 </template>
 
 <style scoped>
-@import url('/assets/media.css');
-
 .page-heading {
   margin-top: 80px;
   padding: 150px 0;
   background: url(/common/bg_pageheading_pc.jpg) no-repeat right center/cover;
   font-size: 3.75rem;
 
-  @media (--tablet) {
+  /*
+  メディアクエリの読み込みができなかったため、一旦コメントアウト
+  @import url('~/assets/media.css');
+  @custom-media --tablet (width <= 768px);
+  @custom-media --mobile (width <= 480px);
+  */
+  @media (width <= 768px) {
     padding: 60px 0;
     font-size: 2.1875rem;
     background-image: url(/common/bg_pageheading_sp.jpg);
@@ -36,7 +40,13 @@ const { color } = useColor()
     padding: 0 1.5%;
     display: block;
 
-    @media (--tablet) {
+    /*
+    メディアクエリの読み込みができなかったため、一旦コメントアウト
+    @import url('~/assets/media.css');
+    @custom-media --tablet (width <= 768px);
+    @custom-media --mobile (width <= 480px);
+    */
+    @media (width <= 768px) {
       max-width: 100%;
       padding: 0 6%;
     }