fix style nits for Samsung Internet browser page

immersive-web · Nov 7, 2017 · 4338ae0 · 4338ae0
1 parent 23e481f
commit 4338ae0
Show file tree

Hide file tree

Showing 3 changed files with 35 additions and 10 deletions.
diff --git a/public/media/css/main.css b/public/media/css/main.css
@@ -1122,6 +1122,14 @@ tr[data-headset="windows_mixed_reality"] th a:before {
   margin-top: 1.5rem;
 }
 
+.db {
+  display: block;
+}
+
+.w-100 {
+  width: 100%;
+}
+
 .button-source {
   display: block;
   font-size: .8rem;
@@ -1454,6 +1462,15 @@ html[data-layout~="headset"][data-layout~="htc_vive"] .edit-page a:hover {
   font-weight: bold;
 }
 
+[data-section~="setup"] figure {
+  background: #fafafa;
+  margin-right: 1.5rem;
+}
+
+[data-section~="setup"] figure + figure {
+  margin-top: 1.5em;
+}
+
 /**
  * Breakpoints
  *
@@ -1842,6 +1859,12 @@ html[data-layout~="headset"][data-layout~="htc_vive"] .edit-page a:hover {
   }
 }
 
+@media all and (min-width: 52.8rem) {
+  [data-section~="setup"] figure + figure {
+    margin-top: 0;
+  }
+}
+
 @media all and (min-width: 60rem) {
   .intro-para {
     font-size: 1.6rem;

diff --git a/public/samsung_internet.html b/public/samsung_internet.html
@@ -39,10 +39,12 @@ <h2><a href="#setup">Instructions</a></h2>
             <li>
               <span>
                 <p>Search for and <strong>install <a href="{{ browser.downloadUrl }}">Samsung Internet</a></strong> from the <strong>Oculus Gear VR store</strong>.</p>
-                <figure class="media-outlined">
-                  <img src="samsung_internet/app.png" width="200" alt="Installation screen for Samsung Internet Browser for Gear VR">
-                  <figcaption>Installation screen</figcaption>
-                </figure>
+                <a class="db no-underline w-100" href="{{ browser.url }}" rel="noreferrer noopener">
+                  <figure class="media-outlined">
+                    <img src="samsung_internet/app.png" width="200" alt="Installation screen for Samsung Internet Browser for Gear VR">
+                    <figcaption>Installation screen</figcaption>
+                  </figure>
+                </a>
               </span>
             </li>
             <li>
@@ -51,13 +53,13 @@ <h2><a href="#setup">Instructions</a></h2>
               </span>
             </li>
             <li><span>
-              <p>Samsung Internet for Gear VR automatically detects web pages that use the WebVR API and prompts users to enable WebVR when the page is loaded. You can also enable or disable WebVR via the <strong>Labs</strong> menu.<p>
+              <p>Samsung Internet for Gear VR automatically detects web pages that use the WebVR API and prompts users to enable WebVR when the page is loaded. You can also enable or disable WebVR via the <strong>Labs</strong> menu.</p>
               <figure class="media-outlined">
-                <img src="samsung_internet/labs-menu.jpg" width="270" alt="Labs menu for Samsung Internet Browser for Gear VR">
+                <img src="samsung_internet/labs-menu.jpg" height="330" alt="Labs menu for Samsung Internet Browser for Gear VR">
                 <figcaption>Labs menu</figcaption>
               </figure>
               <figure class="media-outlined">
-                <img src="samsung_internet/webvr-menu.jpg" width="391" alt="WebVR menu for Samsung Internet Browser for Gear VR">
+                <img src="samsung_internet/webvr-menu.jpg" height="330" alt="WebVR menu for Samsung Internet Browser for Gear VR">
                 <figcaption>WebVR menu</figcaption>
               </figure>
             </li>

diff --git a/public/samsung_internet.json b/public/samsung_internet.json
@@ -3,7 +3,7 @@
   "@type": "MobileApplication",
   "name": "Samsung Internet",
   "description": "Samsung's browser for mobile & Gear VR",
-  "description_html": "Samsung's browser for <a href=\"http://developer.samsung.com/internet\">mobile</a> &amp; <a href=\"https://www.oculus.com/experiences/gear-vr/849609821813454/\">Gear VR</a>",
+  "description_html": "Samsung&rsquo;s browser for <a href=\"http://developer.samsung.com/internet\">mobile</a> &amp; <a href=\"https://www.oculus.com/experiences/gear-vr/849609821813454/\">Gear VR</a>",
   "slug": "samsung_internet",
   "operatingSystem": "Android 5.1+",
   "headsets": [
@@ -22,8 +22,8 @@
   "releases": {
     "latest": {
       "url": "https://www.oculus.com/experiences/gear-vr/849609821813454/",
-      "fileSize": "224.56 MB",
-      "version": "5.2.00-14"
+      "fileSize": "226.79 MB",
+      "version": "5.4.10.4"
     }
   },
   "fileSize": "",