@mirai/core 0.4.17 → 0.4.19

package/build/components/BannerLoyalty/__tests__/__snapshots__/BannerLoyalty.skeleton.test.js.snap

@@ -3,94 +3,93 @@
 exports[`<BannerLoyalty>.skeleton inherit:className 1`] = `
 <DocumentFragment>
   <ui-view
-    class="view row mirai"
-    style="align-items: stretch;"
+    class="view mirai"
   >
     <ui-view
-      class="view"
-      style="gap: 1rem; max-width: 33%; min-width: 33%; padding: 2rem;"
+      class="view row"
+      style="justify-content: space-between; padding: 1rem;"
     >
-      <ui-text
-        class="text headline-1"
+      <ui-view
+        class="view"
+        style="gap: 0.25rem;"
       >
-        Banner Loyalty
-      </ui-text>
+        <ui-text
+          class="text headline-1"
+        >
+          Banner Loyalty
+        </ui-text>
+        <ui-text
+          class="text paragraph"
+        >
+          Choose CLUB MEMBER rate, join and enjoy Web Bonus, special benefits for members!
+        </ui-text>
+      </ui-view>
       <ui-text
         class="text paragraph"
       >
-        Choose CLUB MEMBER rate, join and enjoy Web Bonus, special benefits for members!
+        See loyalty benefits CHECK
       </ui-text>
     </ui-view>
     <ui-view
-      class="view"
-      style="gap: 2rem; justify-content: space-between; padding: 2rem;"
+      class="view row wide"
+      style="gap: 4rem; padding: 1.5rem 1rem;"
     >
       <ui-view
-        class="view row wide"
-        style="gap: 2rem;"
+        class="view row"
+        style="gap: 1rem;"
       >
         <ui-view
           class="view"
-          style="gap: 1rem;"
+          style="min-height: 2rem; min-width: 2rem;"
+        />
+        <ui-text
+          class="text action"
         >
-          <ui-view
-            class="view"
-            style="height: 2rem; width: 2rem;"
-          />
-          <ui-text
-            class="text action"
-          >
-            5$ reward on your web bookings guaranteed
-          </ui-text>
-        </ui-view>
+          5$ reward on your web bookings guaranteed
+        </ui-text>
+      </ui-view>
+      <ui-view
+        class="view row"
+        style="gap: 1rem;"
+      >
         <ui-view
           class="view"
-          style="gap: 1rem;"
+          style="min-height: 2rem; min-width: 2rem;"
+        />
+        <ui-text
+          class="text action"
         >
-          <ui-view
-            class="view"
-            style="height: 2rem; width: 2rem;"
-          />
-          <ui-text
-            class="text action"
-          >
-            5$ reward on your web bookings guaranteed
-          </ui-text>
-        </ui-view>
+          5$ reward on your web bookings guaranteed
+        </ui-text>
+      </ui-view>
+      <ui-view
+        class="view row"
+        style="gap: 1rem;"
+      >
         <ui-view
           class="view"
-          style="gap: 1rem;"
+          style="min-height: 2rem; min-width: 2rem;"
+        />
+        <ui-text
+          class="text action"
         >
-          <ui-view
-            class="view"
-            style="height: 2rem; width: 2rem;"
-          />
-          <ui-text
-            class="text action"
-          >
-            5$ reward on your web bookings guaranteed
-          </ui-text>
-        </ui-view>
+          5$ reward on your web bookings guaranteed
+        </ui-text>
+      </ui-view>
+      <ui-view
+        class="view row"
+        style="gap: 1rem;"
+      >
         <ui-view
           class="view"
-          style="gap: 1rem;"
+          style="min-height: 2rem; min-width: 2rem;"
+        />
+        <ui-text
+          class="text action"
         >
-          <ui-view
-            class="view"
-            style="height: 2rem; width: 2rem;"
-          />
-          <ui-text
-            class="text action"
-          >
-            5$ reward on your web bookings guaranteed
-          </ui-text>
-        </ui-view>
+          5$ reward on your web bookings guaranteed
+        </ui-text>
       </ui-view>
-      <ui-text
-        class="text action"
-      >
-        You will be able to login or sign up in the next step of the booking process. More information
-      </ui-text>
     </ui-view>
   </ui-view>
 </DocumentFragment>
@@ -99,94 +98,93 @@ exports[`<BannerLoyalty>.skeleton inherit:className 1`] = `
 exports[`<BannerLoyalty>.skeleton renders 1`] = `
 <DocumentFragment>
   <ui-view
-    class="view row"
-    style="align-items: stretch;"
+    class="view"
   >
     <ui-view
-      class="view"
-      style="gap: 1rem; max-width: 33%; min-width: 33%; padding: 2rem;"
+      class="view row"
+      style="justify-content: space-between; padding: 1rem;"
     >
-      <ui-text
-        class="text headline-1"
+      <ui-view
+        class="view"
+        style="gap: 0.25rem;"
       >
-        Banner Loyalty
-      </ui-text>
+        <ui-text
+          class="text headline-1"
+        >
+          Banner Loyalty
+        </ui-text>
+        <ui-text
+          class="text paragraph"
+        >
+          Choose CLUB MEMBER rate, join and enjoy Web Bonus, special benefits for members!
+        </ui-text>
+      </ui-view>
       <ui-text
         class="text paragraph"
       >
-        Choose CLUB MEMBER rate, join and enjoy Web Bonus, special benefits for members!
+        See loyalty benefits CHECK
       </ui-text>
     </ui-view>
     <ui-view
-      class="view"
-      style="gap: 2rem; justify-content: space-between; padding: 2rem;"
+      class="view row wide"
+      style="gap: 4rem; padding: 1.5rem 1rem;"
     >
       <ui-view
-        class="view row wide"
-        style="gap: 2rem;"
+        class="view row"
+        style="gap: 1rem;"
       >
         <ui-view
           class="view"
-          style="gap: 1rem;"
+          style="min-height: 2rem; min-width: 2rem;"
+        />
+        <ui-text
+          class="text action"
         >
-          <ui-view
-            class="view"
-            style="height: 2rem; width: 2rem;"
-          />
-          <ui-text
-            class="text action"
-          >
-            5$ reward on your web bookings guaranteed
-          </ui-text>
-        </ui-view>
+          5$ reward on your web bookings guaranteed
+        </ui-text>
+      </ui-view>
+      <ui-view
+        class="view row"
+        style="gap: 1rem;"
+      >
         <ui-view
           class="view"
-          style="gap: 1rem;"
+          style="min-height: 2rem; min-width: 2rem;"
+        />
+        <ui-text
+          class="text action"
         >
-          <ui-view
-            class="view"
-            style="height: 2rem; width: 2rem;"
-          />
-          <ui-text
-            class="text action"
-          >
-            5$ reward on your web bookings guaranteed
-          </ui-text>
-        </ui-view>
+          5$ reward on your web bookings guaranteed
+        </ui-text>
+      </ui-view>
+      <ui-view
+        class="view row"
+        style="gap: 1rem;"
+      >
         <ui-view
           class="view"
-          style="gap: 1rem;"
+          style="min-height: 2rem; min-width: 2rem;"
+        />
+        <ui-text
+          class="text action"
         >
-          <ui-view
-            class="view"
-            style="height: 2rem; width: 2rem;"
-          />
-          <ui-text
-            class="text action"
-          >
-            5$ reward on your web bookings guaranteed
-          </ui-text>
-        </ui-view>
+          5$ reward on your web bookings guaranteed
+        </ui-text>
+      </ui-view>
+      <ui-view
+        class="view row"
+        style="gap: 1rem;"
+      >
         <ui-view
           class="view"
-          style="gap: 1rem;"
+          style="min-height: 2rem; min-width: 2rem;"
+        />
+        <ui-text
+          class="text action"
         >
-          <ui-view
-            class="view"
-            style="height: 2rem; width: 2rem;"
-          />
-          <ui-text
-            class="text action"
-          >
-            5$ reward on your web bookings guaranteed
-          </ui-text>
-        </ui-view>
+          5$ reward on your web bookings guaranteed
+        </ui-text>
       </ui-view>
-      <ui-text
-        class="text action"
-      >
-        You will be able to login or sign up in the next step of the booking process. More information
-      </ui-text>
     </ui-view>
   </ui-view>
 </DocumentFragment>
@@ -195,95 +193,94 @@ exports[`<BannerLoyalty>.skeleton renders 1`] = `
 exports[`<BannerLoyalty>.skeleton testID 1`] = `
 <DocumentFragment>
   <ui-view
-    class="view row"
+    class="view"
     data-testid="mirai"
-    style="align-items: stretch;"
   >
     <ui-view
-      class="view"
-      style="gap: 1rem; max-width: 33%; min-width: 33%; padding: 2rem;"
+      class="view row"
+      style="justify-content: space-between; padding: 1rem;"
     >
-      <ui-text
-        class="text headline-1"
+      <ui-view
+        class="view"
+        style="gap: 0.25rem;"
       >
-        Banner Loyalty
-      </ui-text>
+        <ui-text
+          class="text headline-1"
+        >
+          Banner Loyalty
+        </ui-text>
+        <ui-text
+          class="text paragraph"
+        >
+          Choose CLUB MEMBER rate, join and enjoy Web Bonus, special benefits for members!
+        </ui-text>
+      </ui-view>
       <ui-text
         class="text paragraph"
       >
-        Choose CLUB MEMBER rate, join and enjoy Web Bonus, special benefits for members!
+        See loyalty benefits CHECK
       </ui-text>
     </ui-view>
     <ui-view
-      class="view"
-      style="gap: 2rem; justify-content: space-between; padding: 2rem;"
+      class="view row wide"
+      style="gap: 4rem; padding: 1.5rem 1rem;"
     >
       <ui-view
-        class="view row wide"
-        style="gap: 2rem;"
+        class="view row"
+        style="gap: 1rem;"
       >
         <ui-view
           class="view"
-          style="gap: 1rem;"
+          style="min-height: 2rem; min-width: 2rem;"
+        />
+        <ui-text
+          class="text action"
         >
-          <ui-view
-            class="view"
-            style="height: 2rem; width: 2rem;"
-          />
-          <ui-text
-            class="text action"
-          >
-            5$ reward on your web bookings guaranteed
-          </ui-text>
-        </ui-view>
+          5$ reward on your web bookings guaranteed
+        </ui-text>
+      </ui-view>
+      <ui-view
+        class="view row"
+        style="gap: 1rem;"
+      >
         <ui-view
           class="view"
-          style="gap: 1rem;"
+          style="min-height: 2rem; min-width: 2rem;"
+        />
+        <ui-text
+          class="text action"
         >
-          <ui-view
-            class="view"
-            style="height: 2rem; width: 2rem;"
-          />
-          <ui-text
-            class="text action"
-          >
-            5$ reward on your web bookings guaranteed
-          </ui-text>
-        </ui-view>
+          5$ reward on your web bookings guaranteed
+        </ui-text>
+      </ui-view>
+      <ui-view
+        class="view row"
+        style="gap: 1rem;"
+      >
         <ui-view
           class="view"
-          style="gap: 1rem;"
+          style="min-height: 2rem; min-width: 2rem;"
+        />
+        <ui-text
+          class="text action"
         >
-          <ui-view
-            class="view"
-            style="height: 2rem; width: 2rem;"
-          />
-          <ui-text
-            class="text action"
-          >
-            5$ reward on your web bookings guaranteed
-          </ui-text>
-        </ui-view>
+          5$ reward on your web bookings guaranteed
+        </ui-text>
+      </ui-view>
+      <ui-view
+        class="view row"
+        style="gap: 1rem;"
+      >
         <ui-view
           class="view"
-          style="gap: 1rem;"
+          style="min-height: 2rem; min-width: 2rem;"
+        />
+        <ui-text
+          class="text action"
         >
-          <ui-view
-            class="view"
-            style="height: 2rem; width: 2rem;"
-          />
-          <ui-text
-            class="text action"
-          >
-            5$ reward on your web bookings guaranteed
-          </ui-text>
-        </ui-view>
+          5$ reward on your web bookings guaranteed
+        </ui-text>
       </ui-view>
-      <ui-text
-        class="text action"
-      >
-        You will be able to login or sign up in the next step of the booking process. More information
-      </ui-text>
     </ui-view>
   </ui-view>
 </DocumentFragment>

package/build/components/BannerLoyalty/__tests__/__snapshots__/BannerLoyalty.test.js.snap

@@ -5,94 +5,93 @@ exports[`<BannerLoyalty> inherit:className 1`] = `<DocumentFragment />`;
 exports[`<BannerLoyalty> prop:skeleton 1`] = `
 <DocumentFragment>
   <ui-view
-    class="view row"
-    style="align-items: stretch;"
+    class="view"
   >
     <ui-view
-      class="view"
-      style="gap: 1rem; max-width: 33%; min-width: 33%; padding: 2rem;"
+      class="view row"
+      style="justify-content: space-between; padding: 1rem;"
     >
-      <ui-text
-        class="text headline-1"
+      <ui-view
+        class="view"
+        style="gap: 0.25rem;"
       >
-        Banner Loyalty
-      </ui-text>
+        <ui-text
+          class="text headline-1"
+        >
+          Banner Loyalty
+        </ui-text>
+        <ui-text
+          class="text paragraph"
+        >
+          Choose CLUB MEMBER rate, join and enjoy Web Bonus, special benefits for members!
+        </ui-text>
+      </ui-view>
       <ui-text
         class="text paragraph"
       >
-        Choose CLUB MEMBER rate, join and enjoy Web Bonus, special benefits for members!
+        See loyalty benefits CHECK
       </ui-text>
     </ui-view>
     <ui-view
-      class="view"
-      style="gap: 2rem; justify-content: space-between; padding: 2rem;"
+      class="view row wide"
+      style="gap: 4rem; padding: 1.5rem 1rem;"
     >
       <ui-view
-        class="view row wide"
-        style="gap: 2rem;"
+        class="view row"
+        style="gap: 1rem;"
       >
         <ui-view
           class="view"
-          style="gap: 1rem;"
+          style="min-height: 2rem; min-width: 2rem;"
+        />
+        <ui-text
+          class="text action"
         >
-          <ui-view
-            class="view"
-            style="height: 2rem; width: 2rem;"
-          />
-          <ui-text
-            class="text action"
-          >
-            5$ reward on your web bookings guaranteed
-          </ui-text>
-        </ui-view>
+          5$ reward on your web bookings guaranteed
+        </ui-text>
+      </ui-view>
+      <ui-view
+        class="view row"
+        style="gap: 1rem;"
+      >
         <ui-view
           class="view"
-          style="gap: 1rem;"
+          style="min-height: 2rem; min-width: 2rem;"
+        />
+        <ui-text
+          class="text action"
         >
-          <ui-view
-            class="view"
-            style="height: 2rem; width: 2rem;"
-          />
-          <ui-text
-            class="text action"
-          >
-            5$ reward on your web bookings guaranteed
-          </ui-text>
-        </ui-view>
+          5$ reward on your web bookings guaranteed
+        </ui-text>
+      </ui-view>
+      <ui-view
+        class="view row"
+        style="gap: 1rem;"
+      >
         <ui-view
           class="view"
-          style="gap: 1rem;"
+          style="min-height: 2rem; min-width: 2rem;"
+        />
+        <ui-text
+          class="text action"
         >
-          <ui-view
-            class="view"
-            style="height: 2rem; width: 2rem;"
-          />
-          <ui-text
-            class="text action"
-          >
-            5$ reward on your web bookings guaranteed
-          </ui-text>
-        </ui-view>
+          5$ reward on your web bookings guaranteed
+        </ui-text>
+      </ui-view>
+      <ui-view
+        class="view row"
+        style="gap: 1rem;"
+      >
         <ui-view
           class="view"
-          style="gap: 1rem;"
+          style="min-height: 2rem; min-width: 2rem;"
+        />
+        <ui-text
+          class="text action"
         >
-          <ui-view
-            class="view"
-            style="height: 2rem; width: 2rem;"
-          />
-          <ui-text
-            class="text action"
-          >
-            5$ reward on your web bookings guaranteed
-          </ui-text>
-        </ui-view>
+          5$ reward on your web bookings guaranteed
+        </ui-text>
       </ui-view>
-      <ui-text
-        class="text action"
-      >
-        You will be able to login or sign up in the next step of the booking process. More information
-      </ui-text>
     </ui-view>
   </ui-view>
 </DocumentFragment>

package/build/components/Booking/Booking.module.css

@@ -134,8 +134,8 @@ body {
   }
 }
 
-/* S & M */
-@media only screen and (max-width: 820px) {
+/* M */
+@media only screen and (min-width: 481px) and (max-width: 1179px) {
   /* -- <Menu> -------------------------------------------------------------- */
   .menu {
     border-top: solid 1px var(--mirai-ui-content-border);
@@ -149,7 +149,7 @@ body {
 }
 
 /* L */
-@media only screen and (min-width: 821px) {
+@media only screen and (min-width: 1180px) {
   .content > .side {
     max-width: calc(var(--mirai-ui-breakpoint-S) - var(--mirai-ui-space-M) * 4);
     position: sticky;