1 files changed, 238 insertions, 0 deletions
diff --git a/chromium/v8/tools/turbolizer/turbo-visualizer-ranges.css b/chromium/v8/tools/turbolizer/turbo-visualizer-ranges.css
new file mode 100644
index 00000000000..03976e2ec54
--- /dev/null
+++ b/chromium/v8/tools/turbolizer/turbo-visualizer-ranges.css
@@ -0,0 +1,238 @@
+/* CSS specific to the live ranges div associated with
+   the RangeView typescript class in src/range-view.ts. */
+
+:root {
+  --range-y-axis-width: 18ch;
+  --range-position-width: 3.5ch;
+  --range-block-border: 6px;
+  --range-instr-border: 3px;
+  --range-position-border: 1px;
+}
+
+.range-bold {
+  font-weight: bold;
+  color: black;
+}
+
+#ranges {
+  font-family: monospace;
+  min-height: auto;
+  overflow: hidden;
+}
+
+#resizer-ranges {
+  height: 10px;
+}
+
+.range-title-div {
+  padding: 2ch 2ch 2ch 2ch;
+  white-space: nowrap;
+  overflow: auto;
+}
+
+.range-title {
+  text-decoration: underline;
+  font-weight: bold;
+  font-size: large;
+  display: inline-block;
+}
+
+.range-title-help {
+  margin-left: 2ch;
+  width: 1ch;
+  padding: 0 0.25ch;
+  border: 1px dotted black;
+  color: slategray;
+  display: inline-block;
+}
+
+input.range-toggle-show {
+  vertical-align: middle;
+}
+
+.range-header-label-x {
+  text-align: center;
+  margin-left: 13ch;
+}
+
+.range-header-label-y {
+  width: 11ch;
+  float: left;
+  white-space: pre-wrap;
+  word-wrap: break-word;
+  margin-left: 6ch;
+  margin-top: 4ch;
+}
+
+.range-y-axis {
+  display: inline-block;
+  width: var(--range-y-axis-width);
+  overflow: hidden;
+  white-space: nowrap;
+  vertical-align: top;
+}
+
+.range-header {
+  display: flex;
+  overflow: hidden;
+  height: 8ch;
+  margin-left: var(--range-y-axis-width);
+}
+
+.range-position-labels,
+.range-register-labels {
+  background-color: lightgray;
+}
+
+.range-register-labels {
+  float: right;
+}
+
+.range-position-labels {
+  margin-top: auto;
+}
+
+.range-registers {
+  float: right;
+  overflow: hidden;
+  text-align: right;
+}
+
+.range-positions-header,
+.range-instruction-ids,
+.range-block-ids {
+  overflow: hidden;
+  white-space: nowrap;
+  display: grid;
+  grid-gap: 0;
+}
+
+.range-reg {
+  width: 13ch;
+  text-align: right;
+}
+
+.range-reg::after {
+  content: ":";
+}
+
+.range-grid {
+  overflow: auto;
+  display: inline-block;
+  white-space: nowrap;
+}
+
+.range-block-id {
+  display: inline-block;
+  text-align: center;
+}
+
+.range-instruction-id {
+  display: inline-block;
+  text-align: center;
+}
+
+.range-position {
+  display: inline-block;
+  text-align: center;
+  z-index: 1;
+}
+
+.range-transparent,
+.range-position.range-empty {
+  color: transparent;
+}
+
+.range-block-id:hover,
+.range-instruction-id:hover,
+.range-reg:hover,
+.range-position:hover {
+  background-color: rgba(0, 0, 255, 0.10);
+}
+
+.range-position.range-header-element {
+  border-bottom: 2px solid rgb(109, 107, 107);
+}
+
+.range-block-id,
+.range-instruction-id,
+.range-reg,
+.range-interval,
+.range-position {
+  position: relative;
+  border: var(--range-position-border) solid rgb(109, 107, 107);
+}
+
+.range-block-id,
+.range-instruction-id,
+.range-interval,
+.range-position {
+  border-left: 0;
+}
+
+.range-block-ids > .range-block-id:first-child,
+.range-instruction-ids > .range-instruction-id:first-child,
+.range-positions > .range-position:first-child {
+  border-left: var(--range-position-border) solid rgb(109, 107, 107);
+}
+
+.range-position.range-interval-position {
+  border: none;
+}
+
+.range-interval-text {
+  position: absolute;
+  padding-left: 0.5ch;
+  z-index: 2;
+  pointer-events: none
+}
+
+.range-position.range-use {
+  border-left: var(--range-instr-border) solid red;
+}
+
+.range-block-border,
+.range-block-border.range-position.range-interval-position:last-child {
+  border-right: var(--range-block-border) solid rgb(109, 107, 107);
+}
+
+.range-block-border.range-position.range-interval-position {
+  border-right: var(--range-block-border) solid transparent;
+}
+
+.range-instr-border,
+.range-instr-border.range-position.range-interval-position:last-child {
+  border-right: var(--range-instr-border) solid rgb(109, 107, 107);
+}
+
+.range-instr-border.range-position.range-interval-position {
+  border-right: var(--range-instr-border) solid transparent;
+}
+
+.range,
+.range-interval,
+.range-interval-wrapper,
+.range-positions {
+  white-space: nowrap;
+  display: inline-block;
+}
+
+.range-interval-wrapper,
+.range-positions {
+  display: grid;
+  grid-gap: 0;
+}
+
+.range-interval {
+  background-color: rgb(153, 158, 168);
+}
+
+.range-hidden {
+  display: none !important;
+}
+
+.range-positions-placeholder {
+  width: 100%;
+  border: var(--range-position-border) solid transparent;
+  color: transparent;
+}
+\ No newline at end of file