SassなどをシンタックスハイライトされたHTMLに変換するサイト

Cotane

久しぶりの制作。

---

Markdownで```sass・・・こんな感じに書くとこうなります。

$color: #f8f8f8

.body
  background: $color
  +center

  .content
    @extend %contents
    width: 70%

  .sub
    @extend %contents
    width: 30%

CotaneでHTML化して貼り付けるとこんな配色にできます。

$color: #f8f8f8

.body
  background: $color
  +center

  .content
    @extend %contents
    width: 70%

  .sub
    @extend %contents
    width: 30%

$color: #f8f8f8

.body
  background: $color
  +center

  .content
    @extend %contents
    width: 70%

  .sub
    @extend %contents
    width: 30%

$color: #f8f8f8

.body
  background: $color
  +center

  .content
    @extend %contents
    width: 70%

  .sub
    @extend %contents
    width: 30%

$color: #f8f8f8

.body
  background: $color
  +center

  .content
    @extend %contents
    width: 70%

  .sub
    @extend %contents
    width: 30%

font-weightやbackgorundみたいなスタイルは貼り付け先の<pre>にスタイルを適用しておく必要があります。

---

Sassの他にもHTMLとCSS、Json、CoffeeScriptとかもシンタックスハイライト化できます。 ただCoffeeScriptの場合""" ~~~ """という構文を使うとエラーが起きるんですが、直し方が分からないので直せないんでしょう、きっと。
あと結構ザルなのでワンライナー系とか、すごすぎる構文を突きつけられるとうまく色付けできない可能性が大です。その場合は、結果は右に反映されるので左のコードをちょろっと優しい構文に変えてやるとイイかもしれないです。

やりました・・・。やったんですよ！必死に！その結果がこれなんでs(ry