css - Sinatra を使用した Slim テンプレート内の Stylus css

Question

私は Sinatra を使用しています。HTML には Slim を、CSS には Stylus を使用しようとしています。

これを行う正しい方法が何であるかはわかりません。私が現在持っているものはうまくいきますが（ローカルでは、展開を試みていません）、これが最も効率的な方法であるかどうか疑問に思っています。

私のlayout.slimファイルには次のものがあります：

styl:
   @import('style')

..頭の中で。これは Stylus スタイルシートを使用する最善の方法ですか、それとも sinatra app.rb に /style パスを設定する必要がありますか?

私のコードは以下の通りです：

---

これは私のapp.rbです

require 'sinatra'       # ruby url route patterns framework
require 'slim'          # html templating
require 'stylus'        # css templating
require 'stylus/tilt'

get '/' do
  @page_title = "Home"
  slim :index
end

---

ビューフォルダーには、次のようなlayout.slimがあります

html
  head
    title #{@page_title}

    styl:
      @import('style')

  body
    #header header in layout.slim

    #central-area
      == yield

    #footer

---

このようなindex.slim

p this is the index which is 'yielded' in the layout.slim

---

app.rbと同じフォルダーに、style.stylがあります。

color-combo1()
  color white
  background-color red
color-combo2()
  color #eeeeee
  background-color blue
#header
  color-combo1()
  padding 5px
  width 100%
#central-area
  padding 0px 20px
  color #111111
#footer
  color-combo2()
  padding 5px