Diffy css scss

[jeremylynch]

Anyway to offer Diffy css in an scss variant?

.diff {
  overflow:auto;
  ul {
    background:#fff;
    overflow:auto;
    font-size:13px;
    list-style:none;
    margin:0;
    padding:0;
    display:table;
    width:100%;
  }
  del, ins {
    display:block;
    text-decoration:none;
  }
  li{
    padding:0; 
    display:table-row;
    margin: 0;
    height:1em;
    &.ins{
      background:#dfd; 
      color:#080
    }
    &.del{
      background:#fee; 
      color:#b00
    }
    &.diff-comment { 
      display: none; 
    }
    &.diff-block-info {background: none repeat scroll 0 0 gray;}
    &:hover{background:#ffc}
  }
  del strong{
    font-weight:normal;
    background:#fcc;
  }
  ins strong{
    font-weight:normal;
    background:#9f9;
  }
  del, ins, span {
    white-space:pre-wrap;
    font-family:courier;
  }
}

[onebree]

I am using bootstrap 3. I was able to use your code above to make Diffy work properly. Initially, Bootstrap overridden Diffy's CSS, listing everything in a plan bulleted list (with strikeouts and underlines).

1. In my bootstrap_overrides file, I inserted @import "diff";
2. I created a file app/assets/stylesheets/_diff.scss with your code.
3. In my view, the content to be diffed is held in an instance variable. I prepended the variable with the .diff class, and now it works!

I am not sure if this solves your particular issue, but thank you for solving mine! :-)