change name for bg-image and bg-image-wrapper

packages/app/src/components/Layout/RawLayout.tsx

@@ -53,8 +53,8 @@ export const RawLayout = ({ children, title, className }: Props): JSX.Element =>
       </Head>
       <ThemeProvider theme={growiTheme}>
         <div className={classNames.join(' ')} data-color-scheme={colorScheme}>
-          {backgroundImageSrc != null && <div className="bg-image-wrapper">
-            <Image className='bg-image' alt='background-image' src={backgroundImageSrc} layout='fill' quality="100" />
+          {backgroundImageSrc != null && <div className="grw-bg-image-wrapper">
+            <Image className='grw-bg-image' alt='background-image' src={backgroundImageSrc} layout='fill' quality="100" />
           </div>}
           {children}
         </div>

packages/app/src/components/Theme/ThemeAntarctic.module.scss

@@ -34,13 +34,13 @@
 }
 
 .theme :global {
-  .bg-image-wrapper {
+  .grw-bg-image-wrapper {
     position: fixed;
     width: 100%;
     height: 100%;
   }
 
-  .bg-image {
+  .grw-bg-image {
     object-fit: cover;
   }
 }

packages/app/src/components/Theme/ThemeChristmas.module.scss

@@ -36,13 +36,13 @@ $color-link-wiki-hover: lighten($color-link-wiki, 15%);
 }
 
 .theme :global {
-  .bg-image-wrapper {
+  .grw-bg-image-wrapper {
     position: fixed;
     width: 100%;
     height: 100%;
   }
 
-  .bg-image {
+  .grw-bg-image {
     object-fit: cover;
   }
 }

packages/app/src/components/Theme/ThemeHalloween.module.scss

@@ -28,7 +28,7 @@ $light: lighten($secondary, 10%);
 }
 
 .theme :global {
-  .bg-image-wrapper {
+  .grw-bg-image-wrapper {
     position: fixed;
     width: 100%;
     height: 100%;

packages/app/src/components/Theme/ThemeHufflepuff.module.scss

@@ -19,13 +19,13 @@
 // }
 
 .theme :global {
-  .bg-image-wrapper {
+  .grw-bg-image-wrapper {
     position: fixed;
     width: 100%;
     height: 100%;
   }
 
-  .bg-image {
+  .grw-bg-image {
     object-fit: cover;
     object-position: bottom;
   }

packages/app/src/components/Theme/ThemeIsland.module.scss

@@ -7,7 +7,7 @@ $color-primary: #97cbc3;
 $color-themelight: rgba(183, 226, 219, 1);
 
 .theme :global {
-  .bg-image-wrapper {
+  .grw-bg-image-wrapper {
     position: fixed;
     width: 100%;
     height: 100%;

packages/app/src/components/Theme/ThemeSpring.module.scss

@@ -26,13 +26,13 @@ $accentcolor: #e08dbc;
 }
 
 .theme :global {
-  .bg-image-wrapper {
+  .grw-bg-image-wrapper {
     position: fixed;
     width: 100%;
     height: 100%;
   }
 
-  .bg-image {
+  .grw-bg-image {
     object-fit: cover;
     object-position: bottom;
   }

packages/app/src/components/Theme/ThemeWood.module.scss

@@ -35,13 +35,13 @@ $themecolor: #b9b177;
 $themelight: #f5f3ee;
 
 .theme :global {
-  .bg-image-wrapper {
+  .grw-bg-image-wrapper {
     position: fixed;
     width: 100%;
     height: 100%;
   }
 
-  .bg-image {
+  .grw-bg-image {
     object-fit: cover;
     object-position: center center;
   }