Changeset 224317 in webkit

Timestamp:

Nov 1, 2017 9:17:36 PM (6 years ago)

Author:

jonlee@apple.com

Message:

Add about page for MotionMark
​https://bugs.webkit.org/show_bug.cgi?id=179152

Reviewed by Ryosuke Niwa.

• MotionMark/about.html: Added.
• MotionMark/index.html:
• MotionMark/resources/runner/motionmark.css:

Location:

trunk/PerformanceTests

Files:

• ChangeLog (modified) (1 diff)
• MotionMark/about.html (added)
• MotionMark/index.html (modified) (1 diff)
• MotionMark/resources/runner/motionmark.css (modified) (2 diffs)

trunk/PerformanceTests/ChangeLog

@@ +1 @@
+2017-11-01  Jon Lee  <jonlee@apple.com>
+
+        Add about page for MotionMark
+        https://bugs.webkit.org/show_bug.cgi?id=179152
+
+        Reviewed by Ryosuke Niwa.
+
+        * MotionMark/about.html: Added.
+        * MotionMark/index.html:
+        * MotionMark/resources/runner/motionmark.css:
+
 2017-10-30  Michael Saboff  <msaboff@apple.com>
 

trunk/PerformanceTests/MotionMark/index.html

@@ -31 +31 @@
             <div class="body">
                 <p>MotionMark is a graphics benchmark that measures a browser’s capability to animate complex scenes at a target frame rate.</p>
+
+                <p><a href="about.html">More details</a> about the benchmark are available. Bigger scores are better.</p>
                 <p>For accurate results, please take your browser window full screen, or rotate your device to landscape orientation.</p>
                 <p class="portrait-orientation-check"><b>Please rotate your device.</b></p>

trunk/PerformanceTests/MotionMark/resources/runner/motionmark.css

@@ -279 +279 @@
 }
 
-/* Intro section */
+/* Intro section, About page */
+
+#intro, #about {
+    padding: 2em;
+}
 
 #intro {
-    padding: 2em;
     opacity: 0;
     transition: opacity 500ms ease-in;
@@ -289 +292 @@
 body.images-loaded #intro {
     opacity: 1;
+}
+
+#about .body {
+    transform: none;
+    margin: 0;
+    max-width: initial;
+}
+
+#about li {
+    line-height: 1.5em;
+}
+
+#about button {
+    padding: .75em 2em;
+    margin: 1.5em auto 0;
+    min-width: initial;
+    transform: skewX(-10deg);
+}
+
+@media screen and (min-width: 667px) {
+    #about .body {
+        font-size: .7em;
+        margin: 1em;
+    }
+
+    #about ol, #about ul {
+        padding-left: 3em;
+    }
+}
+
+
+#intro a, #about a,
+#intro a:visited, #about a:visited {
+    color: black;
 }