사이트를 웹앱으로 실행되도록 하고, meta, favicon 설정 (#320)

* feat: (#319) favicon 및 디바이스별로 보여줄 보투게더 로고 이미지 적용 * feat: (#319) 모바일 즐겨찾기 후 사용시 웹앱 네이티브로 보이도록 선언 아이패드가 켜질 때 로딩중 화면 설정 * feat: (#319) 라인, 카카오톡 공유시 사이트 정보를 미리볼 수 있도록 설정 * feat: (#319) 모바일 환경에서 사이트에 접근할 경우 홈으로 즐겨찾기 여부를 묻는 기능 구현 * refactor: (#319) 모바일 사용자에게 즐겨찾기를 묻는 함수 코드 가독성 개선 * fix: (#319) 모바일 디바이스에 물어보도록 수정 * feat: (#310) PWA(프로그레시브 웹 앱) 요소를 충족시키는 조건 설정 * chore: (#319) 사용하지 않는 코드 삭제 * chore: (#319) EOL을 위한 개행 추가
woowacourse-teams · Sep 12, 2023 · ff5dbdb · ff5dbdb
1 parent ce4b4da
commit ff5dbdb
Show file tree

Hide file tree

Showing 31 changed files with 101 additions and 0 deletions.
diff --git a/frontend/public/icons/android-icon-144x144.png b/frontend/public/icons/android-icon-144x144.png
diff --git a/frontend/public/icons/android-icon-192x192.png b/frontend/public/icons/android-icon-192x192.png
diff --git a/frontend/public/icons/android-icon-36x36.png b/frontend/public/icons/android-icon-36x36.png
diff --git a/frontend/public/icons/android-icon-48x48.png b/frontend/public/icons/android-icon-48x48.png
diff --git a/frontend/public/icons/android-icon-512x512.png b/frontend/public/icons/android-icon-512x512.png
diff --git a/frontend/public/icons/android-icon-72x72.png b/frontend/public/icons/android-icon-72x72.png
diff --git a/frontend/public/icons/android-icon-96x96.png b/frontend/public/icons/android-icon-96x96.png
diff --git a/frontend/public/icons/apple-icon-114x114.png b/frontend/public/icons/apple-icon-114x114.png
diff --git a/frontend/public/icons/apple-icon-120x120.png b/frontend/public/icons/apple-icon-120x120.png
diff --git a/frontend/public/icons/apple-icon-144x144.png b/frontend/public/icons/apple-icon-144x144.png
diff --git a/frontend/public/icons/apple-icon-152x152.png b/frontend/public/icons/apple-icon-152x152.png
diff --git a/frontend/public/icons/apple-icon-180x180.png b/frontend/public/icons/apple-icon-180x180.png
diff --git a/frontend/public/icons/apple-icon-57x57.png b/frontend/public/icons/apple-icon-57x57.png
diff --git a/frontend/public/icons/apple-icon-60x60.png b/frontend/public/icons/apple-icon-60x60.png
diff --git a/frontend/public/icons/apple-icon-72x72.png b/frontend/public/icons/apple-icon-72x72.png
diff --git a/frontend/public/icons/apple-icon-76x76.png b/frontend/public/icons/apple-icon-76x76.png
diff --git a/frontend/public/icons/apple-icon-precomposed.png b/frontend/public/icons/apple-icon-precomposed.png
diff --git a/frontend/public/icons/apple-icon.png b/frontend/public/icons/apple-icon.png
diff --git a/frontend/public/icons/browserconfig.xml b/frontend/public/icons/browserconfig.xml
@@ -0,0 +1,2 @@
+<?xml version="1.0" encoding="utf-8"?>
+<browserconfig><msapplication><tile><square70x70logo src="/ms-icon-70x70.png"/><square150x150logo src="/ms-icon-150x150.png"/><square310x310logo src="/ms-icon-310x310.png"/><TileColor>#ffffff</TileColor></tile></msapplication></browserconfig>
diff --git a/frontend/public/icons/favicon-16x16.png b/frontend/public/icons/favicon-16x16.png
diff --git a/frontend/public/icons/favicon-32x32.png b/frontend/public/icons/favicon-32x32.png
diff --git a/frontend/public/icons/favicon-96x96.png b/frontend/public/icons/favicon-96x96.png
diff --git a/frontend/public/icons/favicon.ico b/frontend/public/icons/favicon.ico
diff --git a/frontend/public/icons/manifest.json b/frontend/public/icons/manifest.json
@@ -0,0 +1,59 @@
+{
+ "name": "VoTogether",
+ "short_name": "VoTogether",
+ "icons": [
+ {
+ "src": "./android-icon-36x36.png",
+ "sizes": "36x36",
+ "type": "image/png",
+ "density": "0.75",
+ "purpose": "any maskable"
+ },
+ {
+ "src": "./android-icon-48x48.png",
+ "sizes": "48x48",
+ "type": "image/png",
+ "density": "1.0",
+ "purpose": "any maskable"
+ },
+ {
+ "src": "./android-icon-72x72.png",
+ "sizes": "72x72",
+ "type": "image/png",
+ "density": "1.5",
+ "purpose": "any maskable"
+ },
+ {
+ "src": "./android-icon-96x96.png",
+ "sizes": "96x96",
+ "type": "image/png",
+ "density": "2.0",
+ "purpose": "any maskable"
+ },
+ {
+ "src": "./android-icon-144x144.png",
+ "sizes": "144x144",
+ "type": "image/png",
+ "density": "3.0",
+ "purpose": "any maskable"
+ },
+ {
+ "src": "./android-icon-192x192.png",
+ "sizes": "192x192",
+ "type": "image/png",
+ "density": "4.0",
+ "purpose": "any maskable"
+ },
+ {
+ "src": "/images/android-icon-512x512.png",
+ "type": "image/png",
+ "sizes": "512x512",
+ "density": "5.0",
+ "purpose": "any maskable"
+ }
+ ],
+ "start_url": "/",
+ "display": "standalone",
+ "background_color": "#ffffff",
+ "theme_color": "#ffffff"
+}
diff --git a/frontend/public/icons/ms-icon-144x144.png b/frontend/public/icons/ms-icon-144x144.png
diff --git a/frontend/public/icons/ms-icon-150x150.png b/frontend/public/icons/ms-icon-150x150.png
diff --git a/frontend/public/icons/ms-icon-310x310.png b/frontend/public/icons/ms-icon-310x310.png
diff --git a/frontend/public/icons/ms-icon-70x70.png b/frontend/public/icons/ms-icon-70x70.png
diff --git a/frontend/public/icons/splash-screen-768x1004.png b/frontend/public/icons/splash-screen-768x1004.png
diff --git a/frontend/public/icons/thumbnail.png b/frontend/public/icons/thumbnail.png
diff --git a/frontend/public/index.html b/frontend/public/index.html
@@ -3,6 +3,46 @@
  <head>
  <meta charset="UTF-8" />
  <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+
+ <link rel="apple-touch-icon" sizes="57x57" href="icons/apple-icon-57x57.png" />
+ <link rel="apple-touch-icon" sizes="60x60" href="icons/apple-icon-60x60.png" />
+ <link rel="apple-touch-icon" sizes="72x72" href="icons/apple-icon-72x72.png" />
+ <link rel="apple-touch-icon" sizes="76x76" href="icons/apple-icon-76x76.png" />
+ <link rel="apple-touch-icon" sizes="114x114" href="icons/apple-icon-114x114.png" />
+ <link rel="apple-touch-icon" sizes="120x120" href="icons/apple-icon-120x120.png" />
+ <link rel="apple-touch-icon" sizes="144x144" href="icons/apple-icon-144x144.png" />
+ <link rel="apple-touch-icon" sizes="152x152" href="icons/apple-icon-152x152.png" />
+ <link rel="apple-touch-icon" sizes="180x180" href="icons/apple-icon-180x180.png" />
+ <link rel="icon" type="image/png" sizes="192x192" href="icons/android-icon-192x192.png" />
+ <link rel="icon" type="image/png" sizes="32x32" href="icons/favicon-32x32.png" />
+ <link rel="icon" type="image/png" sizes="96x96" href="icons/favicon-96x96.png" />
+ <link rel="icon" type="image/png" sizes="16x16" href="icons/favicon-16x16.png" />
+ <link rel="manifest" href="icons/manifest.json" />
+ <meta name="msapplication-TileColor" content="#ffffff" />
+ <meta name="msapplication-TileImage" content="/ms-icon-144x144.png" />
+ <meta name="theme-color" content="#ffffff" />
+
+ <meta name="apple-mobile-web-app-title" content="VoTogether" />
+ <meta name="apple-mobile-web-app-capable" content="yes" />
+ <meta name="apple-mobile-web-app-status-bar-style" content="#BE0000" />
+
+ <link
+ rel="apple-touch-startup-image"
+ sizes="768x1004"
+ href="icons/splash-screen-768x1004.png"
+ />
+
+ <meta property="og:type" content="website" />
+ <meta property="og:url" content="https://votogether.com/" />
+ <meta property="og:title" content="VoTogether" />
+ <meta property="og:image" content="icons/thumbnail.jpg" />
+ <meta
+ property="og:description"
+ content='"VoTogether(보투게더)"는 투표를 통해 고민을 해결하고 재미를 찾는 투표 SNS 서비스입니다. 고민이 있으신가요? 글을 써보세요! 익명으로 글을 작성하며 나를 드러내지 않아도 쉽게 고민을 나눌 수 있습니다. 보투게더는 사람들의 다양한 주제로 질문하고 답변하면서, 사람들의 반응을 확인할 수 있다는 점에서 특별합니다. 나의 이야기가 우리의 이야기가 되는 공간, 보투게더에서 우리 함께해요!✌🏻.'
+ />
+ <meta property="og:site_name" content="VoTogether" />
+ <meta property="og:locale" content="ko_KR" />
+
  <title>VoTogether</title>
  </head>
  <body>