scout_apm_ruby icon indicating copy to clipboard operation
scout_apm_ruby copied to clipboard

Add overflow: auto to Scout DevTrace sql output

Open i8ramin opened this issue 5 years ago • 1 comments

DevTrace shows you a code snippet of the SQL generated, but the code hilight area doesn't allow for scrolling, so it is hard to read the full output. It has overflow: hidden set on <pre class="codehilite">...

If you simply change that to overflow: auto, it'll solve the problem! I would create a PR, but I couldn't find the project anywhere in Github. If it is open-source, more than happy to do it.

.pane.sql-detail>div pre {
  background: #333;
  padding: 15px 3px;
  margin: 0;
- overflow: hidden;
+ overflow: auto;
  border-radius: 0 0 3px 3px;
}

i8ramin avatar Aug 18 '19 14:08 i8ramin

Actually, a better solution may be to use white-space: pre-wrap; (https://css-tricks.com/snippets/css/make-pre-text-wrap/)

.pane.sql-detail>div pre {
  background: #333;
  padding: 15px 3px;
  margin: 0;
- overflow: hidden;
+ white-space: pre-wrap;
  border-radius: 0 0 3px 3px;
}

i8ramin avatar Aug 18 '19 14:08 i8ramin