Update website

Nitrino · Aug 13, 2023 · 6b94a97 · 6b94a97
1 parent 52f0dc1
commit 6b94a97
Show file tree

Hide file tree

Showing 50 changed files with 148 additions and 351 deletions.
diff --git a/docs/fav/android-chrome-192x192.png b/docs/fav/android-chrome-192x192.png
diff --git a/docs/fav/android-chrome-512x512.png b/docs/fav/android-chrome-512x512.png
diff --git a/docs/fav/android-icon-144x144.png b/docs/fav/android-icon-144x144.png
diff --git a/docs/fav/android-icon-192x192.png b/docs/fav/android-icon-192x192.png
diff --git a/docs/fav/android-icon-36x36.png b/docs/fav/android-icon-36x36.png
diff --git a/docs/fav/android-icon-48x48.png b/docs/fav/android-icon-48x48.png
diff --git a/docs/fav/android-icon-72x72.png b/docs/fav/android-icon-72x72.png
diff --git a/docs/fav/android-icon-96x96.png b/docs/fav/android-icon-96x96.png
diff --git a/docs/fav/apple-icon-114x114.png b/docs/fav/apple-icon-114x114.png
diff --git a/docs/fav/apple-icon-120x120.png b/docs/fav/apple-icon-120x120.png
diff --git a/docs/fav/apple-icon-144x144.png b/docs/fav/apple-icon-144x144.png
diff --git a/docs/fav/apple-icon-152x152.png b/docs/fav/apple-icon-152x152.png
diff --git a/docs/fav/apple-icon-180x180.png b/docs/fav/apple-icon-180x180.png
diff --git a/docs/fav/apple-icon-57x57.png b/docs/fav/apple-icon-57x57.png
diff --git a/docs/fav/apple-icon-60x60.png b/docs/fav/apple-icon-60x60.png
diff --git a/docs/fav/apple-icon-72x72.png b/docs/fav/apple-icon-72x72.png
diff --git a/docs/fav/apple-icon-76x76.png b/docs/fav/apple-icon-76x76.png
diff --git a/docs/fav/apple-icon-precomposed.png b/docs/fav/apple-icon-precomposed.png
diff --git a/docs/fav/apple-icon.png b/docs/fav/apple-icon.png
diff --git a/docs/fav/apple-touch-icon.png b/docs/fav/apple-touch-icon.png
diff --git a/docs/fav/browserconfig.xml b/docs/fav/browserconfig.xml
diff --git a/docs/fav/favicon-16x16.png b/docs/fav/favicon-16x16.png
diff --git a/docs/fav/favicon-32x32.png b/docs/fav/favicon-32x32.png
diff --git a/docs/fav/favicon-96x96.png b/docs/fav/favicon-96x96.png
diff --git a/docs/fav/favicon.ico b/docs/fav/favicon.ico
diff --git a/docs/fav/manifest.json b/docs/fav/manifest.json
diff --git a/docs/fav/ms-icon-144x144.png b/docs/fav/ms-icon-144x144.png
diff --git a/docs/fav/ms-icon-150x150.png b/docs/fav/ms-icon-150x150.png
diff --git a/docs/fav/ms-icon-310x310.png b/docs/fav/ms-icon-310x310.png
diff --git a/docs/fav/ms-icon-70x70.png b/docs/fav/ms-icon-70x70.png
diff --git a/docs/fav/site.webmanifest b/docs/fav/site.webmanifest
@@ -0,0 +1 @@
+{"name":"","short_name":"","icons":[{"src":"/android-chrome-192x192.png","sizes":"192x192","type":"image/png"},{"src":"/android-chrome-512x512.png","sizes":"512x512","type":"image/png"}],"theme_color":"#ffffff","background_color":"#ffffff","display":"standalone"}
diff --git a/docs/img/export-to-service.jpg b/docs/img/export-to-service.jpg
diff --git a/docs/img/export-to-service.webp b/docs/img/export-to-service.webp
diff --git a/docs/img/logo.svg b/docs/img/logo.svg
diff --git a/docs/img/mockup.webp b/docs/img/mockup.webp
diff --git a/docs/img/progressbar.jpg b/docs/img/progressbar.jpg
diff --git a/docs/img/progressbar.png b/docs/img/progressbar.png
diff --git a/docs/img/progressbar.webp b/docs/img/progressbar.webp
diff --git a/docs/img/subtitles-settings.jpg b/docs/img/subtitles-settings.jpg
diff --git a/docs/img/subtitles-settings.webp b/docs/img/subtitles-settings.webp
diff --git a/docs/img/word.jpg b/docs/img/word.jpg
diff --git a/docs/img/word.webp b/docs/img/word.webp
diff --git a/docs/index.html b/docs/index.html
@@ -17,18 +17,11 @@
       content="https://raw.githubusercontent.com/Nitrino/easysubs/master/docs/img/promotional.png"
     />
 
-    <link rel="apple-touch-icon" sizes="57x57" href="./fav/apple-icon-57x57.png" />
-    <link rel="apple-touch-icon" sizes="60x60" href="./fav/apple-icon-60x60.png" />
-    <link rel="apple-touch-icon" sizes="72x72" href="./fav/apple-icon-72x72.png" />
-    <link rel="apple-touch-icon" sizes="76x76" href="./fav/apple-icon-76x76.png" />
-    <link rel="apple-touch-icon" sizes="114x114" href="./fav/apple-icon-114x114.png" />
-    <link rel="apple-touch-icon" sizes="120x120" href="./fav/apple-icon-120x120.png" />
-    <link rel="apple-touch-icon" sizes="144x144" href="./fav/apple-icon-144x144.png" />
-    <link rel="apple-touch-icon" sizes="152x152" href="./fav/apple-icon-152x152.png" />
-    <link rel="apple-touch-icon" sizes="180x180" href="./fav/apple-icon-180x180.png" />
-    <link rel="icon" type="image/png" sizes="192x192" href="./fav/android-icon-192x192.png" />
+    <link rel="apple-touch-icon" href="./fav/apple-touch-icon.png" />
+    <link rel="apple-touch-icon" sizes="512x512" href="./fav/apple-icon-512x512.png" />
+    <link rel="icon" type="image/png" sizes="192x192" href="./fav/android-chrome-192x192" />
+    <link rel="icon" type="image/png" sizes="512x512" href="./fav/android-chrome-512x512" />
     <link rel="icon" type="image/png" sizes="32x32" href="./fav/favicon-32x32.png" />
-    <link rel="icon" type="image/png" sizes="96x96" href="./fav/favicon-96x96.png" />
     <link rel="icon" type="image/png" sizes="16x16" href="./fav/favicon-16x16.png" />
     <link rel="manifest" href="./fav/manifest.json" />
 
@@ -44,13 +37,13 @@
 
     <script async src="https://www.googletagmanager.com/gtag/js?id=UA-154148157-2"></script>
     <script>
-      window.dataLayer = window.dataLayer || []
+      window.dataLayer = window.dataLayer || [];
       function gtag() {
-        dataLayer.push(arguments)
+        dataLayer.push(arguments);
       }
-      gtag('js', new Date())
+      gtag("js", new Date());
 
-      gtag('config', 'UA-154148157-2')
+      gtag("config", "UA-154148157-2");
     </script>
   </head>
 
@@ -143,25 +136,10 @@
                 >
                   <img src="./img/chrome-store.png" alt="chrome store" />
                 </a>
-
-                <a
-                  href="https://addons.mozilla.org/en-US/firefox/addon/easysubs/?utm_source=easysubsco&utm_medium=social&utm_campaign=easysubs_co"
-                  class="btn cover__store"
-                  target="_blank"
-                >
-                  <img src="./img/firefox-store.svg" alt="firefox store" />
-                </a>
-                <a
-                  href="https://apps.apple.com/ru/app/easysubs/id1548110281?l=en&mt=12"
-                  class="btn cover__store"
-                  target="_blank"
-                >
-                  <img src="./img/mac-app-store.svg" alt="mac app store" />
-                </a>
               </div>
             </div>
             <div class="cover__right">
-              <img src="./img/mockup.jpg" />
+              <img src="./img/mockup.webp" />
             </div>
           </div>
         </div>
@@ -195,17 +173,16 @@ <h2 class="block__title">Integration with multiple video services</h2>
         <div class="content">
           <div class="features">
             <h2 class="block__title">Easysubs features</h2>
-            <div class="block__subtitle">The list of&nbsp;services will expand at&nbsp;the request of&nbsp;users</div>
             <div class="features__list">
               <div class="features__item">
                 <div class="features__text">
                   <div class="features__text__title">Word and full subtitle translation</div>
                   <div class="features__text__description">
-                    Just hover over the word you want to&nbsp;translate&nbsp;it, the video will automatically pause and
-                    start when you remove the cursor from the subtitles.
+                    Simply hover over the word you want to&nbsp;translate and the video will automatically pause and
+                    restart when you move the cursor away from the subtitles.
                     <br />
                     <br />
-                    Click on&nbsp;subtitles for translation all text.
+                    Click on the subtitles to translate the entire text.
                   </div>
 
                   <a
@@ -216,50 +193,37 @@ <h2 class="block__title">Easysubs features</h2>
                   >
                 </div>
                 <div class="features__image">
-                  <img src="./img/word.jpg" alt="word translation" />
+                  <img src="./img/word.webp" alt="word translation" />
                 </div>
               </div>
               <div class="features__item -reverse">
                 <div class="features__text">
                   <div class="features__text__title">Export words to learning services</div>
                   <div class="features__text__description">
-                    You can add unknown words to&nbsp;one of&nbsp;the supported language learning services.
+                    You can add new words to any of the supported language learning services.
                     <br />
                     <br />
                     <span class="bold">Now supported:</span>
                     <ul class="features__text__list">
+                      <li>– <a href="https://apps.ankiweb.net/" target="_blank">Anki</a></li>
                       <li>– <a href="https://lingualeo.com/" target="_blank">LinguaLeo</a></li>
                       <li>– <a href="https://puzzle-english.com/" target="_blank">Puzzle English</a></li>
                     </ul>
                   </div>
-
-                  <a
-                    href="https://github.com/Nitrino/easysubs#export-words-to-learning-services"
-                    class="btn -second features__btn"
-                    target="_blank"
-                    >Details</a
-                  >
                 </div>
                 <div class="features__image">
-                  <img src="./img/export-to-service.jpg" alt="export to service" />
+                  <img src="./img/export-to-service.webp" alt="export to service" />
                 </div>
               </div>
               <div class="features__item">
                 <div class="features__text">
                   <div class="features__text__title">Rewind to previous and next subtitle</div>
                   <div class="features__text__description">
-                    Rewind to&nbsp;previous subtitle by&nbsp;press ⬅️ left arrow.
+                    Rewind to&nbsp;previous subtitle by&nbsp;pressing ⬅️ left arrow.
                     <br />
-                    Rewind to&nbsp;next subtitle by&nbsp;press ➡️ right arrow.
+                    Rewind to&nbsp;next subtitle by&nbsp;pressing ➡️ right arrow.
                     <br />
                   </div>
-
-                  <a
-                    href="https://github.com/Nitrino/easysubs#rewind-to-previous-and-next-subtitle"
-                    class="btn -second features__btn"
-                    target="_blank"
-                    >Details</a
-                  >
                 </div>
                 <div class="features__image">
                   <img src="./img/navigation.png" alt="easysubs navigation" />
@@ -269,42 +233,52 @@ <h2 class="block__title">Easysubs features</h2>
                 <div class="features__text">
                   <div class="features__text__title">Subtitles progress bar</div>
                   <div class="features__text__description">
-                    At&nbsp;the bottom of&nbsp;the player, there is&nbsp;a&nbsp;subtitles progress bar to&nbsp;simplify
-                    navigation between subtitles.
+                    There is&nbsp;a&nbsp;subtitle progress bar at&nbsp;the bottom of&nbsp;the player to&nbsp;help you
+                    navigate between subtitles.
                     <br />
-                    Click on&nbsp;the progress bar to&nbsp;rewind the video to&nbsp;the desired point.
+                    <br />
+                    Click the progress bar to&nbsp;rewind the video to&nbsp;the point you want.
                   </div>
                 </div>
                 <div class="features__image">
-                  <img src="./img/progressbar.jpg" alt="easysubs progressbar" />
+                  <img src="./img/progressbar.webp" alt="easysubs progressbar" />
                 </div>
               </div>
             </div>
             <div class="features__item">
               <div class="features__text">
                 <div class="features__text__title">Subtitles settings and custom subtitles</div>
                 <div class="features__text__description">
-                  The extension allows you to&nbsp;adjust the size of&nbsp;the subtitles and their delay.
+                  The extension allows you to&nbsp;customise the appearance, position and delay of&nbsp;subtitles.
+                  <br />
                   <br />
-                  You can also upload your custom subtitles if&nbsp;they are not on&nbsp;the video service, supported
-                  srt and vtt formats.
+                  You can also upload your own subtitles if&nbsp;they are not available on&nbsp;the video service. SRT
+                  and VTT formats are supported.
                 </div>
-
-                <a
-                  href="https://github.com/Nitrino/easysubs#subtitles-settings-and-custom-subtitles"
-                  class="btn -second features__btn"
-                  target="_blank"
-                  >Details</a
-                >
               </div>
               <div class="features__image">
-                <img src="./img/subtitles-settings.jpg" alt="easysubs subtitles settings" />
+                <img src="./img/subtitles-settings.webp" alt="easysubs subtitles settings" />
               </div>
             </div>
           </div>
         </div>
       </div>
       <div class="block -dark">
+        <div class="content">
+          <h2 class="block__title">Install Easysubs extention</h2>
+          <div class="block__subtitle">
+            Chrome and compatible browsers are supported. Developers are welcome to support other browsers
+          </div>
+          <a
+            href="https://chrome.google.com/webstore/detail/easysubs/ocelmccppkcibiflhhepafdjjomimddf?utm_source=easysubsco&utm_medium=social&utm_campaign=easysubs_co"
+            class="btn install__store"
+            target="_blank"
+          >
+            <img src="./img/chrome-store.png" alt="chrome store" />
+          </a>
+        </div>
+      </div>
+      <div class="block">
         <div class="content">
           <div class="footer">
             <div class="footer__text">