Update inapp.json

minhyeok4dev · Jun 22, 2024 · 3f9253d · 3f9253d
1 parent fdd3108
commit 3f9253d
Showing 1 changed file with 1 addition and 1 deletion.
diff --git a/inapp.json b/inapp.json
@@ -2,7 +2,7 @@
   "data": [
     {
       "id": "inapp1",
-      "htmlString": "<!DOCTYPE html><html lang=\"en\"> <meta charset=\"UTF-8\" /><meta content=\"width=device-width,initial-scale=1\" name=\"viewport\" /><title>Bottom Sheet</title ><style> * { box-sizing: border-box; } body { padding-top: var(--safe-area-inset-top); padding-right: var(--safe-area-inset-right); padding-bottom: calc(var(--safe-area-inset-bottom) + 20px); padding-left: var(--safe-area-inset-left); font-family: -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, Oxygen-Sans, Ubuntu, Cantarell, \"Helvetica Neue\", sans-serif; }, html { width: 100%; height: 100%; background-color: #fff0; margin: 0; padding: 0; -moz-tap-highlight-color: #fff0; -webkit-tap-highlight-color: #fff0; text-size-adjust: none; overscroll-behavior: none; overflow: hidden; } .background { width: 100%; height: 100%; background-color: rgb(0 0 0 / 0.5); position: fixed; top: 0; left: 0; } .bottom_sheet { width: 100%; height: 50%; position: fixed; bottom: 0; left: 0; animation: slideUp 0.3s ease-in-out; background-color: #fff; border-radius: 24px 24px 0 0; overflow: hidden; border-top: 1px solid #e0e0e0; } @keyframes slideUp { from { transform: translateY(100%); } to { transform: translateY(0); } } .controller { position: relative; width: 100%; height: 56px; display: flex; align-items: center; border-top: 1px solid #e0e0e0; } .button { width: 50%; height: 100%; background-color: #fff; display: flex; justify-content: center; align-items: center; font-size: 14px; font-weight: 600; color: #222; cursor: pointer; overflow: hidden; } .line { position: absolute; left: 50%; width: 1px; height: 16px; background-color: #e0e0e0; border-radius: 2px; } .image_wrapper { width: 100%; height: calc(100% - 56px); } .image { width: 100%; height: 100%; background-image: url(https://imagedelivery.net/lfkkXChLw6uG9RcA2ff5fg/d1fa0c01-2871-46bd-1585-c68d1084c000/flarelane); background-size: cover; background-position: center; } .gray { color: #818181; } </style> <div class=\"background\"></div> <div class=\"bottom_sheet\"> <div class=\"image_wrapper\"><div class=\"image\"></div></div> <div class=\"controller\"> <div class=\"button gray\">다시 보지 않기</div> <div class=\"line\"></div> <div class=\"button\">확인</div> </div> </div></html>"
+      "htmlString": "<!DOCTYPE html><html lang="en"> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0, viewport-fit=cover"> <title>Bottom Sheet</title ><style> * { box-sizing: border-box; } body { padding-top: var(--safe-area-inset-top); padding-right: var(--safe-area-inset-right); padding-bottom: calc(var(--safe-area-inset-bottom) + 20px); padding-left: var(--safe-area-inset-left); font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif; }, html { width: 100%; height: 100%; background-color: #fff0; margin: 0; padding: 0; -moz-tap-highlight-color: #fff0; -webkit-tap-highlight-color: #fff0; text-size-adjust: none; overscroll-behavior: none; overflow: hidden; } .background { width: 100%; height: 100%; background-color: rgb(0 0 0 / 0.5); position: fixed; top: 0; left: 0; } .bottom_sheet { width: 100%; height: 50%; position: fixed; bottom: 0; left: 0; animation: slideUp 0.3s ease-in-out; background-color: #fff; border-radius: 24px 24px 0 0; overflow: hidden; border-top: 1px solid #e0e0e0; } @keyframes slideUp { from { transform: translateY(100%); } to { transform: translateY(0); } } .controller { position: relative; width: 100%; height: 56px; display: flex; align-items: center; border-top: 1px solid #e0e0e0; } .button { width: 50%; height: 100%; background-color: #fff; display: flex; justify-content: center; align-items: center; font-size: 14px; font-weight: 600; color: #222; cursor: pointer; overflow: hidden; } .line { position: absolute; left: 50%; width: 1px; height: 16px; background-color: #e0e0e0; border-radius: 2px; } .image_wrapper { width: 100%; height: calc(100% - 56px); } .image { width: 100%; height: 100%; background-image: url(https://imagedelivery.net/lfkkXChLw6uG9RcA2ff5fg/d1fa0c01-2871-46bd-1585-c68d1084c000/flarelane); background-size: cover; background-position: center; } .gray { color: #818181; } </style> <div class="background"></div> <div class="bottom_sheet"> <div class="image_wrapper"><div class="image"></div></div> <div class="controller"> <div class="button gray">다시 보지 않기</div> <div class="line"></div> <div class="button">확인</div> </div> </div></html>"
     },
     {
       "id": "inapp3",