Moved shared CSS for benchmarks pages to a separate file (open-telemetry#3482)

Author: martinkuba

content/en/docs/collector/benchmarks.md

@@ -3,74 +3,7 @@ title: Benchmarks
 weight: 99
 ---
 
-<style>
-  main {
-    margin: 8px;
-    width: 100%;
-    display: flex;
-    flex-direction: column;
-  }
-
-  button {
-    color: #fff;
-    background-color: #3298dc;
-    border-color: transparent;
-    cursor: pointer;
-    text-align: center;
-  }
-
-  button:hover {
-    background-color: #2793da;
-    flex: none;
-  }
-
-  .spacer {
-    flex: auto;
-  }
-
-  .small {
-    font-size: 0.75rem;
-  }
-
-  footer {
-    margin-top: 16px;
-    display: flex;
-    align-items: center;
-  }
-
-  .benchmark-set {
-    margin: 8px 0;
-    width: 100%;
-    display: flex;
-    flex-direction: column;
-  }
-
-  .benchmark-title {
-    font-size: 3rem;
-    font-weight: 600;
-    word-break: break-word;
-    text-align: center;
-  }
-
-  .benchmark-graphs {
-    display: flex;
-    flex-direction: column;
-    justify-content: space-around;
-    align-items: center;
-    flex-wrap: wrap;
-    width: 100%;
-  }
-
-  .benchmark-chart {
-    max-width: 1000px;
-  }
-
-  div.container {
-    max-width: 1012px;
-    margin-right: auto;
-    margin-left: auto;
-  }
-</style>
+<link rel="stylesheet" href="/css/benchmarks.css">
 
 The OpenTelemetry Collector runs load tests on every commit to the
 [opentelemetry-collector-contrib](https://github.com/open-telemetry/opentelemetry-collector-contrib/)

content/en/docs/instrumentation/js/benchmarks.md

@@ -4,75 +4,7 @@ weight: 101
 cSpell:ignore: Elems rrggbbaa
 ---
 
- <style>
-
-    main {
-      margin: 8px;
-      width: 100%;
-      display: flex;
-      flex-direction: column;
-    }
-
-    button {
-      color: #fff;
-      background-color: #3298dc;
-      border-color: transparent;
-      cursor: pointer;
-      text-align: center;
-    }
-
-    button:hover {
-      background-color: #2793da;
-      flex: none;
-    }
-
-    .spacer {
-      flex: auto;
-    }
-
-    .small {
-      font-size: 0.75rem;
-    }
-
-    footer {
-      margin-top: 16px;
-      display: flex;
-      align-items: center;
-    }
-
-    .benchmark-set {
-      margin: 8px 0;
-      width: 100%;
-      display: flex;
-      flex-direction: column;
-    }
-
-    .benchmark-title {
-      font-size: 3rem;
-      font-weight: 600;
-      word-break: break-word;
-      text-align: center;
-    }
-
-    .benchmark-graphs {
-      display: flex;
-      flex-direction: column;
-      justify-content: space-around;
-      align-items: center;
-      flex-wrap: wrap;
-      width: 100%;
-    }
-
-    .benchmark-chart {
-      max-width: 1000px;
-    }
-
-    div.container {
-      max-width: 1012px;
-      margin-right: auto;
-      margin-left: auto;
-    }
-  </style>
+<link rel="stylesheet" href="/css/benchmarks.css">
 
 The OpenTelemetry JavaScript SDK runs benchmark tests on every commit to the
 [opentelemetry-js](https://github.com/open-telemetry/opentelemetry-js/)

static/css/benchmarks.css

@@ -0,0 +1,66 @@
+main {
+  margin: 8px;
+  width: 100%;
+  display: flex;
+  flex-direction: column;
+}
+
+button {
+  color: #fff;
+  background-color: #3298dc;
+  border-color: transparent;
+  cursor: pointer;
+  text-align: center;
+}
+
+button:hover {
+  background-color: #2793da;
+  flex: none;
+}
+
+.spacer {
+  flex: auto;
+}
+
+.small {
+  font-size: 0.75rem;
+}
+
+footer {
+  margin-top: 16px;
+  display: flex;
+  align-items: center;
+}
+
+.benchmark-set {
+  margin: 8px 0;
+  width: 100%;
+  display: flex;
+  flex-direction: column;
+}
+
+.benchmark-title {
+  font-size: 3rem;
+  font-weight: 600;
+  word-break: break-word;
+  text-align: center;
+}
+
+.benchmark-graphs {
+  display: flex;
+  flex-direction: column;
+  justify-content: space-around;
+  align-items: center;
+  flex-wrap: wrap;
+  width: 100%;
+}
+
+.benchmark-chart {
+  max-width: 1000px;
+}
+
+div.container {
+  max-width: 1012px;
+  margin-right: auto;
+  margin-left: auto;
+}