Adding upstream version 115.7.0esr.upstream/115.7.0esrupstream

Signed-off-by: Daniel Baumann <daniel.baumann@progress-linux.org>

1 files changed, 520 insertions, 0 deletions

diff --git a/third_party/webkit/PerformanceTests/MotionMark/resources/runner/animometer.css b/third_party/webkit/PerformanceTests/MotionMark/resources/runner/animometer.css
new file mode 100644
index 0000000000..86da6bea1c
--- /dev/null
+++ b/third_party/webkit/PerformanceTests/MotionMark/resources/runner/animometer.css
@@ -0,0 +1,520 @@
+/* Outer harness */
+
+html,
+body {
+    min-height: 100%;
+}
+
+body {
+    background-color: hsl(0, 0%, 95%);
+
+    font-family: "Helvetica Neue", Helvetica, Verdana, sans-serif;
+    font-size: 15px;
+
+    cursor: default;
+
+    -webkit-user-select: none;
+}
+
+body.showing-intro,
+body.showing-results {
+    background-color: hsl(35, 100%, 100%);
+    background-image: url(crystal.svg), url(lines.svg);
+    background-size: auto 225%, auto 100%;
+    background-repeat: no-repeat;
+
+    animation: background-fade 1s ease-in 1s, background-color 60s linear infinite 2s;
+    animation-play-state: paused;
+
+    will-change: background-color;
+}
+
+body.showing-test-container {
+    overflow: hidden;
+}
+
+body.images-loaded {
+    animation-play-state: running;
+}
+
+@media screen and (min-width: 667px) {
+    body {
+        font-size: 24px;
+    }
+
+    body.showing-intro,
+    body.showing-results {
+        background-size: 200% 100%, 150% auto;
+    }
+}
+
+@media screen and (min-width: 1025px) {
+    body.showing-intro,
+    body.showing-results {
+        background-size: 150% 100%, 150% auto;
+    }
+}
+
+::selection {
+    background-color: black;
+    color: white;
+}
+
+.hidden {
+    display: none;
+}
+
+section {
+    display: none;
+}
+
+section.selected {
+    display: block;
+}
+
+svg.logo {
+    width: 350px;
+    height: 88px;
+
+    max-width: 100%;
+
+    padding-bottom: 1em;
+
+    color: hsl(35, 100%, 50%);
+
+    animation: foreground-color 60s linear infinite 2s;
+    animation-play-state: paused;
+
+    will-change: color;
+}
+
+body.images-loaded svg.logo {
+    animation-play-state: running;
+}
+
+@media screen and (min-width: 667px) {
+    svg.logo {
+        width: 525px;
+        height: 130px;
+    }
+}
+
+section .body {
+    margin: 0 1em;
+    max-width: 350px;
+}
+
+section .body p {
+    margin: 1em 0;
+    line-height: 1.5em;
+
+    -webkit-user-select: text;
+    cursor: text;
+}
+
+@media screen and (min-width: 667px) {
+    section .body {
+        margin-left: 2.5em;
+        max-width: 500px;
+        transform: skewX(-10deg);
+    }
+
+    section button {
+        transform: none;
+    }
+}
+
+button {
+    background-color: hsl(35, 100%, 50%);
+    color: white;
+
+    padding: 0.25em;
+    margin: 1.5em -0.25em 0 0;
+
+    min-width: 50%;
+
+    border: none;
+
+    font-family: inherit;
+    font-size: inherit;
+
+    transform: skewX(-10deg);
+
+    transition: 100ms filter ease-in-out;
+
+    animation: background-color 60s linear infinite 2s;
+    animation-play-state: paused;
+
+    will-change: background-color;
+}
+
+body.images-loaded button {
+    animation-play-state: running;
+}
+
+button:hover {
+    filter: brightness(115%);
+}
+
+button:active {
+    filter: brightness(130%);
+}
+
+button:disabled {
+    opacity: 0.5;
+    filter: none !important;
+}
+
+@media print {
+    button {
+        display: none;
+    }
+}
+
+.portrait-orientation-check {
+    display: none;
+}
+
+@media screen and (max-device-width: 1025px) and (orientation: portrait) {
+    .portrait-orientation-check {
+        display: block;
+    }
+}
+
+@media screen and (max-device-width: 1025px) and (orientation: portrait) {
+    .landscape-orientation-check {
+        /* This keeps the button color animation in sync with page, while display: none does not. */
+        visibility: hidden;
+    }
+}
+
+@keyframes background-fade {
+    100% {
+        background-color: hsl(35, 100%, 50%);
+    }
+}
+
+@keyframes background-color {
+    0%, 10% {
+        background-color: hsl(35, 100%, 50%);
+    }
+
+    12%, 20% {
+        background-color: hsl(75, 100%, 30%);
+    }
+
+    22%, 30% {
+        background-color: hsl(115, 100%, 30%);
+    }
+
+    32%, 40% {
+        background-color: hsl(155, 100%, 30%);
+    }
+
+    42%, 50% {
+        background-color: hsl(195, 100%, 30%);
+    }
+
+    52%, 60% {
+        background-color: hsl(235, 100%, 30%);
+    }
+
+    62%, 70% {
+        background-color: hsl(275, 100%, 30%);
+    }
+
+    72%, 80% {
+        background-color: hsl(315, 100%, 30%);
+    }
+
+    82%, 90% {
+        background-color: hsl(355, 100%, 30%);
+    }
+
+    92%, 100% {
+        background-color: hsl(395, 100%, 50%);
+    }
+}
+
+@keyframes foreground-color {
+    0%, 10% {
+        color: hsl(35, 100%, 50%);
+    }
+
+    12%, 20% {
+        color: hsl(75, 100%, 30%);
+    }
+
+    22%, 30% {
+        color: hsl(115, 100%, 30%);
+    }
+
+    32%, 40% {
+        color: hsl(155, 100%, 30%);
+    }
+
+    42%, 50% {
+        color: hsl(195, 100%, 30%);
+    }
+
+    52%, 60% {
+        color: hsl(235, 100%, 30%);
+    }
+
+    62%, 70% {
+        color: hsl(275, 100%, 30%);
+    }
+
+    72%, 80% {
+        color: hsl(315, 100%, 30%);
+    }
+
+    82%, 90% {
+        color: hsl(355, 100%, 30%);
+    }
+
+    92%, 100% {
+        color: hsl(395, 100%, 50%);
+    }
+}
+
+/* Intro section, About page */
+
+#intro, #about {
+    padding: 2em;
+}
+
+#intro {
+    opacity: 0;
+    transition: opacity 500ms ease-in;
+}
+
+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;
+}
+
+/* Running test section */
+
+.frame-container {
+    position: absolute;
+
+    top: 50%;
+    left: 50%;
+}
+
+.frame-container > iframe {
+    width: 100%;
+    height: 100%;
+
+    border: 0;
+    margin: 0;
+}
+
+body.small .frame-container {
+    width: 568px;
+    height: 320px;
+    margin-left: -284px;
+    margin-top: -160px;
+}
+
+body.medium .frame-container {
+    width: 900px;
+    height: 600px;
+    margin-left: -450px;
+    margin-top: -300px;
+}
+
+body.large .frame-container {
+    width: 1600px;
+    height: 800px;
+    margin-left: -800px;
+    margin-top: -400px;
+}
+
+/* Results section */
+
+#results {
+    padding: 2em;
+}
+
+#results .body {
+    -webkit-user-select: text;
+}
+
+#results .score-container {
+    padding-bottom: 2em;
+}
+
+#results .table-container {
+    position: relative;
+}
+
+#results .table-container > div {
+    margin-left: 40%;
+}
+
+#results .score {
+    font-size: 5em;
+    font-weight: bold;
+    font-style: italic;
+    line-height: 1;
+    margin: 0;
+}
+
+#results .confidence {
+    font-size: 2em;
+    font-style: italic;
+    line-height: 1;
+    margin: 0;
+    text-indent: 1.75em;
+    color: hsl(0, 0%, 40%);
+    padding-bottom: .3em;
+}
+
+#results table {
+    border-spacing: 0;
+    margin: 0;
+    padding: 0;
+    min-width: 25%;
+}
+
+#results table td,
+#results table th {
+    padding: 0.25em;
+}
+
+#results table td.suites-separator {
+    padding: 0;
+}
+
+#results table tr:nth-child(even) {
+    background-color: hsla(0, 0%, 0%, 0.05);
+}
+
+#results #results-header {
+    top: 0;
+    left: 0;
+    width: 40%;
+    position: absolute;
+}
+
+#results #results-score {
+    float: left;
+}
+
+#results #results-data span {
+    font-size: .75em;
+    color: hsl(0, 0%, 40%);
+}
+
+#results #results-header td,
+#results #results-header th {
+    text-align: right;
+    padding-right: 1em !important;
+    padding-left: 0.5em !important;
+}
+
+#results #results-score td,
+#results #results-score th {
+    text-align: left;
+    padding-right: 0.5em !important;
+}
+
+#results #results-score td {
+    cursor: text;
+}
+
+@media screen and (min-width: 667px) {
+    #results .score,
+    #results .confidence {
+        font-style: normal;
+    }
+}
+
+.detail span {
+    display: none;
+}
+
+body.small .detail .small,
+body.medium .detail .medium,
+body.large .detail .large {
+    display: initial;
+}
+
+#overlay {
+    position: fixed;
+
+    top: 0;
+    left: 0;
+    bottom: 0;
+    right: 0;
+
+    background: hsla(0, 0%, 100%, 0.9);
+}
+
+@supports (-webkit-backdrop-filter: blur(10px)) {
+    #overlay {
+        background: hsla(0, 0%, 100%, 0.7);
+        -webkit-backdrop-filter: blur(20px);
+    }
+}
+
+#overlay > div {
+    position: absolute;
+
+    width: 500px;
+    height: 500px;
+
+    margin-top: -250px;
+    margin-left: -250px;
+
+    top: 50%;
+    left: 50%;
+}
+
+#overlay > div div {
+    overflow: scroll;
+
+    font-size: 12px;
+    -webkit-user-select: text;
+    cursor: text;
+
+    max-height: 250px;
+
+    border: 1px solid hsla(0, 0%, 0%, 0.1);
+    padding: 1em;
+}